title: How can I restrict google login to my company's email domain (@company.com) in React Native?
body: <h1>Question</h1>
  
  <p>What is the best way to prevent users from using an email address that does not end in @mycompany.com from logging in to our internal app through Firebase/Google auth?</p>
  
  <h1>Goal</h1>
  
  <ul>
  <li>Prevent users from using the wrong email to login to the app</li>
  <li>Fetch the user's company email address and use that for authentication elsewhere (i.e. for pulling data from an internal website)</li>
  </ul>
  
  <h1>Restraints</h1>
  
  <ul>
  <li>I am using react-native init because I had to implement with our company's native SDK module</li>
  <li>Preferably would like a solution with Firebase since we are already using it with said native SDK module for FCM/push notifications.</li>
  </ul>
  
  <h1>Research results</h1>
  
  <ul>
  <li>I saw that react-native-google-signin had a "hostedDomain" option, but it doesn't seem to do anything. I'm not sure how to use it, and there are no docs or good examples of its use. There was a feature request for it <a href="https://github.com/devfd/react-native-google-signin/issues/199" rel="noreferrer">here</a> but that's all I can find.</li>
  <li>I saw that there is a similar repo, react-native-google-sign-in, but it doesn't offer any more information on this subject.</li>
  <li>I read somewhere that I'm probably thinking about this all wrong and authentication can't restrict email addresses(?), but I can restrict who can access information with said email addresses. This doesn't help me because we're not using Firebase's database for anything right now. I need a way to guide users to log in using their company email.</li>
  <li><a href="https://github.com/jaredhanson/passport-google-oauth2/issues/13" rel="noreferrer">This person seemed to have a similar issue</a> and found a solution for passport, but I don't know how to apply this to my use case.</li>
  </ul>
  
  <h1>Setup</h1>
  
  <ul>
  <li>IntelliJ Ultimate 2017.2.2</li>
  <li>React Native 0.47.1 (using react-native init, not CRNA or expo since I needed to integrate with a native SDK module)</li>
  <li>google-services.json from Firebase exists in android/app folder</li>
  </ul>
  
  <h3>Android Setup</h3>
  
  <p>package.json dependencies</p>
  
  <pre><code>"dependencies": {
      "create-react-class": "^15.6.0", /* Ignore this */
      "firebase": "^4.2.0",
      "react": "16.0.0-alpha.12",
      "react-native": "0.47.1",
      "react-native-app-intro": "^1.1.5",
      "react-native-google-signin": "^0.11.0",
      "react-native-linear-gradient": "^2.2.0",
      "react-navigation": "^1.0.0-beta.12"
  }
  </code></pre>
  
  <p>android/settings.gradle</p>
  
  <pre><code>rootProject.name = '[My Project Name]'
  include ':react-native-google-signin'
  project(':react-native-google-signin').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-google-signin/android')
  include ':react-native-linear-gradient'
  project(':react-native-linear-gradient').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-linear-gradient/android')
  
  include ':app', ':[Internal Android SDK]'
  </code></pre>
  
  <p>android/build.gradle</p>
  
  <pre><code>buildscript {
      repositories {
          jcenter()
      }
      dependencies {
          classpath 'com.android.tools.build:gradle:2.3.3'
          classpath 'com.google.gms:google-services:3.0.0'
      }
  }
  
  allprojects {
      repositories {
          mavenLocal()
          jcenter()
          maven {
              // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
              url "$rootDir/../node_modules/react-native/android"
          }
      }
  }
  
  ext {
      compileSdkVersion = 26
      buildToolsVersion = "26.0.1"
  }
  
  subprojects { subproject -&gt;
      afterEvaluate{
          if((subproject.plugins.hasPlugin('android') || subproject.plugins.hasPlugin('android-library'))) {
              android {
                  compileSdkVersion rootProject.ext.compileSdkVersion
                  buildToolsVersion rootProject.ext.buildToolsVersion
              }
          }
      }
  }
  </code></pre>
  
  <p>android/app/build.gradle</p>
  
  <pre><code>apply plugin: "com.android.application"
  
  [...]
  
  dependencies {
      compile(project(":react-native-google-signin")){
          exclude group: "com.google.android.gms" // very important
      }
      compile project(':react-native-linear-gradient')
      compile project(':[Internal Android SDK]')
      compile fileTree(include: ['*.jar'], dir: 'libs')
      compile 'com.android.support:appcompat-v7:26.0.0-alpha1'
      compile 'com.facebook.react:react-native:+'
      compile 'com.facebook.fresco:animated-gif:1.0.1'
      compile 'com.google.android.gms:play-services-auth:10.0.1'
      compile 'com.google.firebase:firebase-messaging:10.0.1'
  }
  
  [...]
  
  apply plugin: 'com.google.gms.google-services'
  </code></pre>
  
  <h3>React Native setup</h3>
  
  <p>Current folder structure:</p>
  
  <pre><code>&gt; app
      &gt; components [...]
      &gt; config [...]
      &gt; screens
          HomeScreen.js
          LoginScreen.js
          [...]
      &gt; styles [...]
      router.js (just a simple StackNavigator setup from react-navigation)
  &gt; assets
      &gt; fonts [...]
      &gt; img [...]
  &gt; node_modules [...]
  index.android.js
  index.ios.js
  package.json
  [...]
  </code></pre>
  
  <p>LoginScreen.js (This is a work in progress)</p>
  
  <pre><code>import React, { Component } from 'react';
  import { Alert, Button, Image, Text, View } from 'react-native';
  import {GoogleSignin, GoogleSigninButton} from 'react-native-google-signin';
  
  export default class LoginScreen extends Component{
  
      constructor(props){
          super(props);
          this.state = {
              user: null
          }
      }
  
      componentDidMount() {
          this._setupGoogleSignin().then(() =&gt; console.log('Mounted &amp; Google setup complete.'));
      }
  
      async _setupGoogleSignin() {
          try {
              await GoogleSignin.hasPlayServices({ autoResolve: true });
              await GoogleSignin.configure({
                  hostedDomain: 'mycompany.com' //doesn't do anything
              });
  
              const user = await GoogleSignin.currentUserAsync();
              console.log('User: ',user);
              this.setState({user});
          }
          catch(err) {
              console.log("Play services error", err.code, err.message);
          }
      }
  
      _signIn() {
          GoogleSignin.signIn()
              .then((user) =&gt; {
                  console.log('User: ',user);
                  this.setState({user: user});
              })
              .catch((err) =&gt; {
                  console.log('WRONG SIGNIN', err);
              })
              .done();
      }
  
      _signOut() {
          GoogleSignin.revokeAccess().then(() =&gt; GoogleSignin.signOut()).then(() =&gt; {
                  this.setState({user: null});
              })
              .done();
      }
  
      render(){
  
          if (!this.state.user){
              return (
                  &lt;View style={{flex: 1}}&gt;
                      &lt;View style={{flex: 1.5, alignItems: 'center', justifyContent: 'center', marginTop: 40}}&gt;
                          &lt;Image
                              style={{width: 156, height: 156, resizeMode: 'contain'}}
                              source={require('../../assets/img/google_logo1600.png')} /&gt;
                          &lt;Text style={{fontSize: 32, fontWeight: 'bold'}}&gt;
                              Google Identity
                          &lt;/Text&gt;
                          &lt;Text style={[{fontSize: 15, paddingTop: 5}]}&gt;
                              To continue, please sign-in.
                          &lt;/Text&gt;
                      &lt;/View&gt;
                      &lt;View style={{flex: 1, alignItems: 'center', justifyContent: 'center', marginBottom: 40}}&gt;
                          &lt;GoogleSigninButton
                              style={{width: 312, height: 48}}
                              size={GoogleSigninButton.Size.Wide}
                              color={GoogleSigninButton.Color.Light}
                              onPress={() =&gt; this._signIn()}/&gt;
                      &lt;/View&gt;
                  &lt;/View&gt;
              );
          } else {
              return (
                  &lt;View style={{flex: 1}}&gt;
                      &lt;View style={{flex: 1.5, alignItems: 'center', justifyContent: 'center', marginTop: 40}}&gt;
                          &lt;Image
                              style={{width: 156, height: 156, resizeMode: 'contain'}}
                              source={require('../../assets/img/google_logo1600.png')} /&gt;
                          &lt;Text style={{fontSize: 32, fontWeight: 'bold'}}&gt;
                              Google Identity
                          &lt;/Text&gt;
                          &lt;Text style={[{fontSize: 15, paddingTop: 5}]}&gt;
                              To continue, please sign-in.
                          &lt;/Text&gt;
                      &lt;/View&gt;
                      &lt;View style={{flex: 1, alignItems: 'center', justifyContent: 'center', marginBottom: 40}}&gt;
                          &lt;Button style={{width: 312, height: 48, backgroundColor: '#4385F2', color: 'white'}} title="Log Out" onPress={() =&gt; this._signOut()} /&gt;
                      &lt;/View&gt;
                  &lt;/View&gt;
              )
          }
  
      }
  }
  </code></pre>
  
  <p>If there's a better way to do this, I'm all ears. Thanks!</p>