merge upstream. Add dynamic client-side support for optional oauth2 and social login methods

1 files changed, 46 insertions, 44 deletions

diff --git a/front-end/src/views/Login/social/[type].vue b/front-end/src/views/Login/social/[type].vue
index 51da94f..f011f9c 100644
--- a/front-end/src/views/Login/social/[type].vue
+++ b/front-end/src/views/Login/social/[type].vue
@@ -1,35 +1,3 @@
-<template>
-  <div id="social-login-template" class="app-component-entry">
-    <div class="container flex flex-col m-auto my-16">
-      <div id="social-final-template" class="flex justify-center">
-        <div class="entry-container">
-          <h3>Finalizing login</h3>
-          <div class="mt-6 mb-4">
-            <div v-if="message?.length > 0" class="text-lg text-red-500 dark:text-rose-500">
-              <p>{{ message }}</p>
-              <div class="flex justify-center mt-5">
-                <router-link to="/login">
-                  <button type="submit" class="btn primary" :disabled="waiting">
-                    <fa-icon icon="sign-in-alt" />
-                    Try again
-                  </button>
-                </router-link>
-              </div>
-            </div>
-            <div v-else>
-              <div class="flex justify-center">
-                <div class="m-auto">
-                  <fa-icon class="animate-spin" icon="spinner" size="2x"/>
-                </div>
-              </div>
-              <p>Please wait while we log you in.</p>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
 
 <script setup lang="ts">
 import { defer } from 'lodash-es'
@@ -62,19 +30,20 @@ tryOnMounted(() => defer(() => {
 
   //try to complete an oauth login
   apiCall(async ({ toaster }) => {
-    try{
-        //Complete the login
-        const { completeLogin } = await store.socialOauth();
-        await completeLogin()
-        
-        toaster.general.success({
-          title:'Login Successful',
-          text: 'You have successfully logged in.'
-        })
-        
-        router.push({ name: 'Login' })
+    try {
+      const { completeLogin } = await store.socialOauth();
+
+      //Complete the login
+      await completeLogin();
+
+      toaster.general.success({
+        title: 'Login Successful',
+        text: 'You have successfully logged in.'
+      })
+
+      router.push({ name: 'Login' })
     }
-    catch(err: any){
+    catch (err: any) {
       set(message, err.message)
     }
   })
@@ -82,6 +51,39 @@ tryOnMounted(() => defer(() => {
 
 </script>
 
+<template>
+  <div id="social-login-template" class="app-component-entry">
+    <div class="container flex flex-col m-auto my-16">
+      <div id="social-final-template" class="flex justify-center">
+        <div class="entry-container">
+          <h3>Finalizing login</h3>
+          <div class="mt-6 mb-4">
+            <div v-if="message?.length > 0" class="text-lg text-red-500 dark:text-rose-500">
+              <p>{{ message }}</p>
+              <div class="flex justify-center mt-5">
+                <router-link to="/login">
+                  <button type="submit" class="btn primary" :disabled="waiting">
+                    <fa-icon icon="sign-in-alt" />
+                    Try again
+                  </button>
+                </router-link>
+              </div>
+            </div>
+            <div v-else>
+              <div class="flex justify-center">
+                <div class="m-auto">
+                  <fa-icon class="animate-spin" icon="spinner" size="2x"/>
+                </div>
+              </div>
+              <p>Please wait while we log you in.</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
 <style lang="scss">
 
 #social-login-template{