How to use firebaseui - 10 common examples

if (getRuntimeEnv() == RuntimeEnv.ELECTRON_RENDERER) {
                            vue.onSignInSuccessWithAuthResult();
                            return false;
                        } else {
                            return true;
                        }
                    },
                    uiShown: function () {
                        // The widget is rendered.
                        // Hide the loader.
                    }
                },
                signInSuccessUrl: '/home',
                signInOptions: Services.getInstance().config.authProviders,
            };
            let ui = firebaseui.auth.AuthUI.getInstance() ? firebaseui.auth.AuthUI.getInstance() : new firebaseui.auth.AuthUI(firebase.auth());
            ui.start('#firebaseui-auth-container', uiConfig);

            console.log(Services.getInstance().config.authProviders);
        }

firebase.auth().onAuthStateChanged(user => {
  if (user) {
    console.log('already signed in')

    // firebase.auth().signOut()


  } else {
    const ui = new firebaseui.auth.AuthUI(firebase.auth())
    ui.start('#firebaseui-auth-container', {
      signInOptions: [
        firebase.auth.GoogleAuthProvider.PROVIDER_ID,
      ],
      callbacks: {
        signInSuccess: () => false,
      }
    })
  }
})

startUi () {
      // Initialize the FirebaseUI Widget using Firebase.
      let ui = firebaseui.auth.AuthUI.getInstance()
      if (!ui) {
        ui = new firebaseui.auth.AuthUI(firebase.auth())
      }
      console.log('isPendingRedirect() → ', ui.isPendingRedirect())
      // The start method will wait until the DOM is loaded.
      // if (ui.isPendingRedirect()) {
      //   ui.start('#firebaseui-auth-container', uiConfig);
      // }
      const el = document.getElementById('firebaseui-auth-container')
      if (!el) return
      ui.start('#firebaseui-auth-container', uiConfig)
    },
  }

}
    },
    'signInFlow': 'popup',
    'signInOptions': [
      {
        provider: firebase.auth.GoogleAuthProvider.PROVIDER_ID
      },
      {
        provider: firebase.auth.EmailAuthProvider.PROVIDER_ID,
        // Whether the display name should be displayed in Sign Up page.
        requireDisplayName: true
      }
    ],
    // Terms of service url.
    'tosUrl': 'https://www.google.com',
    'credentialHelper': firebaseui.auth.CredentialHelper.NONE
  };
}

initUI() {
    const ui = new firebaseui.auth.AuthUI(this.auth.auth);
    // The start method will wait until the DOM is loaded.
    const uiConfig = {
      signInSuccessUrl: '',
      signInOptions: [
        // Leave the lines as is for the providers you want to offer your users.
        firebase.auth.GoogleAuthProvider.PROVIDER_ID,
        firebase.auth.FacebookAuthProvider.PROVIDER_ID,
        firebase.auth.TwitterAuthProvider.PROVIDER_ID,
        firebase.auth.GithubAuthProvider.PROVIDER_ID,
        firebase.auth.EmailAuthProvider.PROVIDER_ID,
        firebase.auth.PhoneAuthProvider.PROVIDER_ID
      ],
      // Terms of service url.
      // tosUrl: ''
    }

bannedRestrictedOperator: "AND",
      cyclesOperator: "AND",
      rulesTextOperator: "AND",
      flavourTextOperator: "AND",
      typeLineOperator: "AND",
      gathererOperator: "AND",
      coloursOnly: false,
      colourIdentityOnly: false};
    // Bind the prop function to this scope.
    this.handleClick = this.handleClick.bind(this)
    
    Firebase.initializeApp(fbconfig[0]);

    // Initialize the FirebaseUI Widget using Firebase.
    // Need to 'this' them so they can be used by the modal popup.
    this.ui = new firebaseui.auth.AuthUI(Firebase.auth());
    this.uiConfig = {
      'signInSuccessUrl': 'mtg-hunter.com',
      //'signInSuccessUrl': 'localhost:3333',
      'signInOptions': [
        // Leave the lines as is for the providers you want to offer your users.
        Firebase.auth.GoogleAuthProvider.PROVIDER_ID,
        Firebase.auth.FacebookAuthProvider.PROVIDER_ID,
        Firebase.auth.TwitterAuthProvider.PROVIDER_ID,
        Firebase.auth.GithubAuthProvider.PROVIDER_ID,
        //Firebase.auth.EmailAuthProvider.PROVIDER_ID
      ],
      'signInFlow': 'popup',
      callbacks: {
        signInSuccess: function(currentUser, credential, redirectUrl) {
          //alert("Signed in as "+currentUser + " with credential " + credential);
        this.setState({"showLoginModal":false}); // For now going to use email as 

constructor(props) {
		super(props);
		if (!window.authUi) window.authUi = new firebaseui.auth.AuthUI(firebase.auth());
	}

componentWillUnmount() {
    const { onRedirect } = this.props;

    onRedirect(false);
  }

  uiConfig = {
    signInOptions: [
      this.props.firebase.auth.GoogleAuthProvider.PROVIDER_ID,
      this.props.firebase.auth.TwitterAuthProvider.PROVIDER_ID,
      {
        provider: this.props.firebase.auth.EmailAuthProvider.PROVIDER_ID,
        requireDisplayName: false
      }
    ],
    credentialHelper: firebaseui.auth.CredentialHelper.NONE,
    callbacks: {
      signInSuccessWithAuthResult: authResult => {
        const user = authResult.user;
        const isNewUser = authResult.additionalUserInfo.isNewUser;

        isNewUser &&
          this.props.firebase.user(user.uid).set({
            ...JSON.parse(localStorage.getItem('budgetDuoState')),
            lastSaved: this.props.firebase.timestamp()
          });

        this.props.history.push('/');
      }
    }
  };