feat: 🎸 add GoogleAuthButton scaffolding

Author: streamich

src/GoogleAuth/__story__/story.tsx

@@ -0,0 +1,14 @@
+import {createElement as h} from 'react';
+import {storiesOf} from '@storybook/react';
+import {GoogleAuthButton} from '..';
+// import ShowDocs from '../../../.storybook/ShowDocs'
+
+const clientId = '305188012168-htfit0k0u4vegn0f6hn10rcqoj1m77ca.apps.googleusercontent.com';
+
+storiesOf('Context/GoogleAuthButton', module)
+  // .add('Documentation', () => h(ShowDocs, {md: require('../../../docs/en/GoogleAuthButton.md')}))
+  .add('Default', () =>
+    <GoogleAuthButton clientId={clientId}>{(state) =>
+      <button>Sign in with Google!</button>
+    }</GoogleAuthButton>
+  );

src/GoogleAuth/index.ts

@@ -0,0 +1,17 @@
+import {Component} from 'react';
+import renderProp from '../util/renderProp';
+import {IUniversalInterfaceProps} from '../typing';
+
+export interface IGoogleAuthButtonProps extends IUniversalInterfaceProps<IGoogleAuthButtonState> {
+    clientId: string;
+}
+
+export interface IGoogleAuthButtonState {
+    loading?: boolean;
+}
+
+export class GoogleAuthButton extends Component<IGoogleAuthButtonProps, IGoogleAuthButtonState> {
+    render () {
+        return renderProp(this.props, this.state);
+    }
+}

src/GoogleAuth/util.ts

@@ -0,0 +1,58 @@
+export type GoogleAPI = any;
+
+let gapiCache: GoogleAPI;
+
+export const getGapi = async (): Promise<GoogleAPI> => {
+    if (gapiCache) {
+        return gapiCache;
+    }
+
+    await new Promise(resolve => {
+        const gapicallback = `__gapicb${Date.now().toString(36)}`;
+        (window as any)[gapicallback] = () => {
+            delete (window as any)[gapicallback];
+            gapiCache = (window as any).gapi;
+            resolve();
+        };
+
+        const script = document.createElement('script');
+
+        script.src = 'https://apis.google.com/js/platform.js?onload=' + gapicallback;
+        document.head.appendChild(script);
+    });
+
+    return gapiCache;
+};
+
+let gapiAuth2Cache;
+
+export const getGapiAuth2 = async (): Promise<any> => {
+    if (gapiAuth2Cache) {
+        return gapiAuth2Cache;
+    }
+
+    const gapi = await getGapi();
+
+    await new Promise(resolve => {
+        gapi.load('auth2', () => {
+            gapiAuth2Cache = gapi.auth2;
+            resolve();
+        });
+    });
+
+    return gapiAuth2Cache;
+};
+
+let GoogleAuthCache;
+
+export const getGapiAuthInstance = async (client_id: string) => {
+    if (GoogleAuthCache) {
+        return GoogleAuthCache;
+    }
+
+    const gapiAuth2 = await getGapiAuth2();
+
+    GoogleAuthCache = await gapiAuth2.init({client_id});
+
+    return GoogleAuthCache;
+};