feat: Update the frontend to support the new intermediate OAuth login…

… step

src/aux-server/aux-web/aux-auth/iframe/AuthHandler.ts

@@ -14,6 +14,7 @@ import {
 } from '../../../../aux-vm-browser/html/IFrameHelpers';
 import { authManager } from '../shared/index';
 import {
+    CompleteOpenIDLoginSuccess,
     CreatePublicRecordKeyResult,
     PublicRecordKeyPolicy,
 } from '@casual-simulation/aux-records';
@@ -625,38 +626,28 @@ export class AuthHandler implements AuxAuth {
     }): Promise<string> {
         const result = await authManager.loginWithPrivo();
         if (result.success) {
-            const thisOrigin = location.origin;
+            const requestId = result.requestId;
             const newTab = window.open(result.authorizationUrl, '_blank');
 
-            const codes = await new Promise<{ code: string; state: string }>(
+            const codes = await new Promise<CompleteOpenIDLoginSuccess>(
                 (resolve, reject) => {
-                    const getOrigin = () => {
-                        try {
-                            return newTab.origin;
-                        } catch (err) {
-                            return null;
-                        }
-                    };
-
                     let intervalId: number | NodeJS.Timer;
-                    const handleClose = () => {
+                    const handleClose = async () => {
                         if (intervalId) {
                             clearInterval(intervalId);
                         }
 
-                        const origin = getOrigin();
-
-                        if (origin === thisOrigin) {
-                            // redirected back to here:
-                            const url = new URL(newTab.location.href);
-                            const state = url.searchParams.get('state');
-                            const code = url.searchParams.get('code');
-                            resolve({
-                                code,
-                                state,
-                            });
+                        const loginResult =
+                            await authManager.completeOAuthLogin(requestId);
+
+                        if (loginResult.success === true) {
+                            resolve(loginResult);
                         } else {
-                            reject(new Error('Login canceled.'));
+                            if (loginResult.errorCode === 'not_completed') {
+                                reject(new Error('Login canceled.'));
+                            } else {
+                                reject(new Error('Login failed.'));
+                            }
                         }
                     };
 

src/aux-server/aux-web/aux-auth/shared/AuthManager.ts

@@ -39,6 +39,9 @@ import type {
     ReplaceSessionResult,
     PrivoSignUpRequestResult,
     OpenIDLoginRequestResult,
+    ProcessOpenIDAuthorizationCodeRequest,
+    ProcessOpenIDAuthorizationCodeResult,
+    CompleteOpenIDLoginResult,
 } from '@casual-simulation/aux-records/AuthController';
 import { AddressType } from '@casual-simulation/aux-records/AuthStore';
 import type {
@@ -762,6 +765,46 @@ export class AuthManager {
         return await this._privoRegister(info, parentEmail);
     }
 
+    async processAuthCode(
+        params: object
+    ): Promise<ProcessOpenIDAuthorizationCodeResult> {
+        const response = await axios.post<ProcessOpenIDAuthorizationCodeResult>(
+            `${this.apiEndpoint}/api/v2/oauth/code`,
+            {
+                ...params,
+            },
+            {
+                validateStatus: (status) => status < 500,
+            }
+        );
+
+        return response.data;
+    }
+
+    async completeOAuthLogin(
+        requestId: string
+    ): Promise<CompleteOpenIDLoginResult> {
+        const response = await axios.post<CompleteOpenIDLoginResult>(
+            `${this.apiEndpoint}/api/v2/oauth/complete`,
+            {
+                requestId,
+            },
+            {
+                validateStatus: (status) => status < 500,
+            }
+        );
+
+        const result = response.data;
+
+        if (result.success === true) {
+            this.savedSessionKey = result.sessionKey;
+            this.savedConnectionKey = result.connectionKey;
+            this._userId = result.userId;
+        }
+
+        return result;
+    }
+
     private async _privoRegister(
         info: PrivoSignUpInfo,
         parentEmail: string

src/aux-server/aux-web/aux-auth/site/OAuthRedirect/OAuthRedirect.ts

@@ -0,0 +1,23 @@
+import { EventBus } from '@casual-simulation/aux-components';
+import Vue from 'vue';
+import Component from 'vue-class-component';
+import { Prop, Provide, Watch } from 'vue-property-decorator';
+import { authManager } from '../../shared/index';
+
+@Component({
+    components: {},
+})
+export default class OAuthRedirect extends Vue {
+    async mounted() {
+        const url = new URL(window.location.href);
+        let params: any = {};
+        for (let [key, value] of url.searchParams.entries()) {
+            params[key] = value;
+        }
+
+        if (params.code && params.state) {
+            await authManager.processAuthCode(params);
+        }
+        // window.close();
+    }
+}

src/aux-server/aux-web/aux-auth/site/OAuthRedirect/OAuthRedirect.vue

@@ -0,0 +1,9 @@
+<template>
+    <div>
+        <md-progress-spinner md-mode="indeterminate" :md-diameter="20" :md-stroke="2"
+            >Processing</md-progress-spinner
+        >
+    </div>
+</template>
+<script src="./OAuthRedirect.ts"></script>
+<style src="./OAuthRedirect.css" scoped></style>

src/aux-server/aux-web/aux-auth/site/index.ts

@@ -86,6 +86,8 @@ import AuthRecordsRoles from './AuthRecordsRoles/AuthRecordsRoles';
 import AuthStudio from './AuthStudio/AuthStudio';
 import AuthRecordsInsts from './AuthRecordsInsts/AuthRecordsInsts';
 import './global.css';
+import { appManager } from 'aux-web/shared/AppManager';
+import OAuthRedirect from './OAuthRedirect/OAuthRedirect';
 
 Vue.use(VueRouter);
 Vue.use(MdButton);
@@ -219,6 +221,11 @@ const routes: RouteConfig[] = [
         }),
         component: AuthStudio,
     },
+    {
+        path: '/oauth/redirect',
+        name: 'oauth-redirect',
+        component: OAuthRedirect,
+    },
 ];
 
 const router = new VueRouter({
@@ -278,6 +285,7 @@ const publicPages = new Set([
     'privacy-policy',
     'acceptable-use-policy',
     'olx-terms-of-service',
+    'oauth-redirect',
 ]);
 
 router.beforeEach(async (to, from, next) => {