diff options
Diffstat (limited to 'src/client/apis')
| -rw-r--r-- | src/client/apis/GoogleAuthenticationManager.scss | 3 | ||||
| -rw-r--r-- | src/client/apis/GoogleAuthenticationManager.tsx (renamed from src/client/apis/AuthenticationManager.tsx) | 52 | ||||
| -rw-r--r-- | src/client/apis/google_docs/GooglePhotosClientUtils.ts | 7 |
3 files changed, 43 insertions, 19 deletions
diff --git a/src/client/apis/GoogleAuthenticationManager.scss b/src/client/apis/GoogleAuthenticationManager.scss new file mode 100644 index 000000000..5efb3ab3b --- /dev/null +++ b/src/client/apis/GoogleAuthenticationManager.scss @@ -0,0 +1,3 @@ +.paste-target { + padding: 5px; +}
\ No newline at end of file diff --git a/src/client/apis/AuthenticationManager.tsx b/src/client/apis/GoogleAuthenticationManager.tsx index d8f6b675b..1ab6380ef 100644 --- a/src/client/apis/AuthenticationManager.tsx +++ b/src/client/apis/GoogleAuthenticationManager.tsx @@ -4,17 +4,21 @@ import * as React from "react"; import MainViewModal from "../views/MainViewModal"; import { Opt } from "../../new_fields/Doc"; import { Identified } from "../Network"; +import { RouteStore } from "../../server/RouteStore"; +import "./GoogleAuthenticationManager.scss"; const AuthenticationUrl = "https://accounts.google.com/o/oauth2/v2/auth"; -const prompt = "Please paste the external authetication code here..."; +const prompt = "Paste authorization code here..."; @observer -export default class AuthenticationManager extends React.Component<{}> { - public static Instance: AuthenticationManager; +export default class GoogleAuthenticationManager extends React.Component<{}> { + public static Instance: GoogleAuthenticationManager; @observable private openState = false; private authenticationLink: Opt<string> = undefined; @observable private authenticationCode: Opt<string> = undefined; @observable private clickedState = false; + @observable private success: Opt<boolean> = undefined; + @observable private displayLauncher = true; private set isOpen(value: boolean) { runInAction(() => this.openState = value); @@ -24,8 +28,8 @@ export default class AuthenticationManager extends React.Component<{}> { runInAction(() => this.clickedState = value); } - public executeFullRoutine = async (service: string) => { - let response = await Identified.FetchFromServer(`/read${service}AccessToken`); + public fetchOrGenerateAccessToken = async () => { + let response = await Identified.FetchFromServer(RouteStore.readGoogleAccessToken); // if this is an authentication url, activate the UI to register the new access token if (new RegExp(AuthenticationUrl).test(response)) { this.isOpen = true; @@ -35,12 +39,26 @@ export default class AuthenticationManager extends React.Component<{}> { () => this.authenticationCode, authenticationCode => { if (authenticationCode) { - Identified.PostToServer(`/write${service}AccessToken`, { authenticationCode }).then(token => { - this.isOpen = false; - this.hasBeenClicked = false; - resolve(token); - disposer(); - }); + Identified.PostToServer(RouteStore.writeGoogleAccessToken, { authenticationCode }).then( + token => { + runInAction(() => this.success = true); + setTimeout(() => { + this.isOpen = false; + runInAction(() => this.displayLauncher = false); + setTimeout(() => { + runInAction(() => this.success = undefined); + runInAction(() => this.displayLauncher = true); + this.hasBeenClicked = false; + }, 500); + }, 1000); + disposer(); + resolve(token); + }, + () => { + this.hasBeenClicked = false; + runInAction(() => this.success = false); + } + ); } } ); @@ -52,12 +70,12 @@ export default class AuthenticationManager extends React.Component<{}> { constructor(props: {}) { super(props); - AuthenticationManager.Instance = this; + GoogleAuthenticationManager.Instance = this; } private handleClick = () => { window.open(this.authenticationLink); - this.hasBeenClicked = true; + setTimeout(() => this.hasBeenClicked = true, 500); } private handlePaste = action((e: React.ChangeEvent<HTMLInputElement>) => { @@ -67,8 +85,12 @@ export default class AuthenticationManager extends React.Component<{}> { private get renderPrompt() { return ( <div style={{ display: "flex", flexDirection: "column" }}> - <button onClick={this.handleClick}>Please click here to authorize a Google account...</button> + {this.displayLauncher ? <button + className={"dispatch"} + onClick={this.handleClick} + >Authorize a Google account...</button> : (null)} {this.clickedState ? <input + className={'paste-target'} onChange={this.handlePaste} placeholder={prompt} style={{ marginTop: 15 }} @@ -83,6 +105,8 @@ export default class AuthenticationManager extends React.Component<{}> { isDisplayed={this.openState} interactive={true} contents={this.renderPrompt} + overlayDisplayedOpacity={0.9} + dialogueBoxStyle={{ borderColor: this.success === undefined ? "black" : this.success ? "green" : "red" }} /> ); } diff --git a/src/client/apis/google_docs/GooglePhotosClientUtils.ts b/src/client/apis/google_docs/GooglePhotosClientUtils.ts index 8e88040db..e93fa6eb4 100644 --- a/src/client/apis/google_docs/GooglePhotosClientUtils.ts +++ b/src/client/apis/google_docs/GooglePhotosClientUtils.ts @@ -14,14 +14,11 @@ import { NewMediaItemResult, MediaItem } from "../../../server/apis/google/Share import { AssertionError } from "assert"; import { DocumentView } from "../../views/nodes/DocumentView"; import { Identified } from "../../Network"; -import AuthenticationManager from "../AuthenticationManager"; -import { List } from "../../../new_fields/List"; +import GoogleAuthenticationManager from "../GoogleAuthenticationManager"; export namespace GooglePhotos { - const endpoint = async () => { - return new Photos(await AuthenticationManager.Instance.executeFullRoutine("GooglePhotos")); - }; + const endpoint = async () => new Photos(await GoogleAuthenticationManager.Instance.fetchOrGenerateAccessToken()); export enum MediaType { ALL_MEDIA = 'ALL_MEDIA', |