only requiring google sign in for specific command

src/components/MainCommand.js

@@ -17,7 +17,9 @@ const INITIAL_COMMAND_STATE = {
       : 'https://s3-us-west-1.amazonaws.com/charify-assets/defaultLogo.png',
   commandInputPlaceholder: 'Do Everything You Want',
   commandComplete: false,
-  commandProcessedData: null
+  commandProcessedData: null,
+
+  needGoogleAuth: false
 };
 
 class MainCommand extends Component {
@@ -94,6 +96,7 @@ class MainCommand extends Component {
     var newCommandInputPlaceholder = this.state.commandInputPlaceholder;
     var newCommandComplete = this.state.commandComplete;
     var newCommandProcessedData = this.state.commandProcessedData;
+    var newNeedGoogleAuth = this.state.needGoogleAuth;
 
     // initial finding that command was entered
     // TODO: helper function to properly change properties
@@ -103,6 +106,7 @@ class MainCommand extends Component {
         'https://image.flaticon.com/icons/png/512/281/281769.png';
       newInput = newInput.replace('gmail', '');
       newCommandInputPlaceholder = 'to | subject | message';
+      newNeedGoogleAuth = true;
     }
 
     if (newCommand == 'google') {
@@ -129,6 +133,11 @@ class MainCommand extends Component {
       }
     }
 
+    if (newNeedGoogleAuth) {
+      // Make the user go through google sign in
+      this.googleSignIn();
+    }
+
     this.setState({
       command: newCommand,
       commandInput: newInput,
@@ -196,8 +205,11 @@ class MainCommand extends Component {
 
     return (
       <div className={styles.searchCont}>
-        {googleAccessToken == null ? (
+        {/* Google Sign In button */}
-          <div className={styles.googleButton} onClick={this.googleSignIn}>
+        {/* <div
+            className={[styles.googleButton, styles.hidden].join(' ')}
+            onClick={this.googleSignIn}
+          >
             <img
               className={styles.googleLogo}
               width="20px"
@@ -205,19 +217,18 @@ class MainCommand extends Component {
               src="https://upload.wikimedia.org/wikipedia/commons/thumb/5/53/Google_%22G%22_Logo.svg/512px-Google_%22G%22_Logo.svg.png"
             />
             Login with Google
-          </div>
+          </div> */}
-        ) : (
+
-          <React.Fragment>
+        <React.Fragment>
-            <img className={styles.commandIcon} src={commandIcon} />
+          <img className={styles.commandIcon} src={commandIcon} />
-            <input
+          <input
-              value={commandInput}
+            value={commandInput}
-              onChange={this.handleInputChange}
+            onChange={this.handleInputChange}
-              onKeyDown={this.handleInputKeyDown}
+            onKeyDown={this.handleInputKeyDown}
-              className={styles.searchBar}
+            className={styles.searchBar}
-              placeholder={commandInputPlaceholder}
+            placeholder={commandInputPlaceholder}
-            />
+          />
-          </React.Fragment>
+        </React.Fragment>
-        )}
 
         {commandComplete && (
           <Button

src/components/root.less

@@ -117,3 +117,7 @@
     z-index: -1;
   }
 }
+
+.hidden {
+  display: none !important;
+}