1 files changed, 21 insertions, 14 deletions
diff --git a/src/client/apis/GoogleAuthenticationManager.tsx b/src/client/apis/GoogleAuthenticationManager.tsx
index 46581397d..1b1d6f734 100644
--- a/src/client/apis/GoogleAuthenticationManager.tsx
+++ b/src/client/apis/GoogleAuthenticationManager.tsx
@@ -1,4 +1,4 @@
-import { action, IReactionDisposer, observable, reaction, runInAction } from 'mobx';
+import { action, IReactionDisposer, makeObservable, observable, reaction, runInAction } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
 import { Opt } from '../../fields/Doc';
@@ -6,12 +6,13 @@ import { Networking } from '../Network';
 import { ScriptingGlobals } from '../util/ScriptingGlobals';
 import { MainViewModal } from '../views/MainViewModal';
 import './GoogleAuthenticationManager.scss';
+import { ObservableReactComponent } from '../views/ObservableReactComponent';
 
 const AuthenticationUrl = 'https://accounts.google.com/o/oauth2/v2/auth';
 const prompt = 'Paste authorization code here...';
 
 @observer
-export class GoogleAuthenticationManager extends React.Component<object> {
+export class GoogleAuthenticationManager extends ObservableReactComponent<object> {
     // eslint-disable-next-line no-use-before-define
     public static Instance: GoogleAuthenticationManager;
     private authenticationLink: Opt<string> = undefined;
@@ -23,6 +24,12 @@ export class GoogleAuthenticationManager extends React.Component<object> {
     @observable private credentials: { user_info: { name: string; picture: string }; access_token: string } | undefined = undefined;
     private disposer: Opt<IReactionDisposer>;
 
+    constructor(props: object) {
+        super(props);
+        makeObservable(this);
+        GoogleAuthenticationManager.Instance = this;
+    }
+
     private set isOpen(value: boolean) {
         runInAction(() => (this.openState = value));
     }
@@ -49,14 +56,15 @@ export class GoogleAuthenticationManager extends React.Component<object> {
                     () => this.authenticationCode,
                     async authenticationCode => {
                         if (authenticationCode && /\d{1}\/[\w-]{55}/.test(authenticationCode)) {
+                            resolve(authenticationCode);
                             this.disposer?.();
-                            const response2 = await Networking.PostToServer('/writeGoogleAccessToken', { authenticationCode });
-                            runInAction(() => {
-                                this.success = true;
-                                this.credentials = response2 as { user_info: { name: string; picture: string }; access_token: string };
-                            });
+                            // const response2 = await Networking.PostToServer('/writeGoogleAccessToken', { authenticationCode });
+                            // runInAction(() => {
+                            //     this.success = true;
+                            //     this.credentials = response2 as { user_info: { name: string; picture: string }; access_token: string };
+                            // });
+                            // resolve((response2 as { access_token: string }).access_token);
                             this.resetState();
-                            resolve((response2 as { access_token: string }).access_token);
                         }
                     }
                 );
@@ -109,11 +117,6 @@ export class GoogleAuthenticationManager extends React.Component<object> {
         }
     });
 
-    constructor(props: object) {
-        super(props);
-        GoogleAuthenticationManager.Instance = this;
-    }
-
     private get renderPrompt() {
         return (
             <div className={'authorize-container'}>
@@ -153,7 +156,11 @@ export class GoogleAuthenticationManager extends React.Component<object> {
     }
 
     render() {
-        return <MainViewModal isDisplayed={this.openState} interactive={true} contents={this.renderPrompt} dialogueBoxStyle={this.dialogueBoxStyle} overlayStyle={{ zIndex: 1001 }} closeOnExternalClick={action(() => (this.isOpen = false))} />;
+        return (
+            <div className="hell">
+                <MainViewModal isDisplayed={this.openState} interactive={true} contents={this.renderPrompt} dialogueBoxStyle={this.dialogueBoxStyle} overlayStyle={{ zIndex: 1001 }} closeOnExternalClick={action(() => (this.isOpen = false))} />
+            </div>
+        );
     }
 }