From ae4c7388e1442919f2f358d92fb02a9aa62ee638 Mon Sep 17 00:00:00 2001
From: Shrinath Prabhu <shrinathprabhu.123@gmail.com>
Date: Wed, 23 Nov 2022 18:12:29 +0530
Subject: [PATCH] Updated the template to use auth popup (auth.connect)

---
 src/pages/AppLogin.vue | 15 +++++++++------
 src/use/arcanaAuth.js  |  6 +++---
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/src/pages/AppLogin.vue b/src/pages/AppLogin.vue
index 5cb6d3c..95a996c 100644
--- a/src/pages/AppLogin.vue
+++ b/src/pages/AppLogin.vue
@@ -5,12 +5,12 @@
       style="height: 120px; display: inline"
     />
     <div class="inline-block mt-12">
-      By clicking on signin with google, you agree to Arcana Network's
+      By clicking on Login, you agree to Arcana Network's
       <a href="/" style="color: #058aff; text-decoration: none"> Privacy </a>
       &
       <a href="/" style="color: #058aff; text-decoration: none"> Terms </a>
     </div>
-    <a class="google-button" @click.stop="onSignInClick">Sign In with Google</a>
+    <a class="google-button" @click.stop="onSignInClick">Login</a>
   </div>
 </template>
 
@@ -58,8 +58,7 @@
 }
 
 .google-button {
-  display: inline-block;
-  padding: 0.8em 1.2em;
+  display: inline-flex;
   border: 1px solid rgb(5, 138, 255);
   background-color: rgb(5, 138, 255);
   color: white;
@@ -69,6 +68,10 @@
   white-space: nowrap;
   font-weight: 800;
   font-size: 1.2em;
+  width: 8rem;
+  height: 3rem;
+  justify-content: center;
+  align-items: center;
 }
 </style>
 
@@ -83,7 +86,7 @@ export default {
   setup() {
     const router = useRouter();
     const { toastSuccess, toastError } = useToast();
-    const { requestSocialLogin, fetchUserDetails, auth  } = useArcanaAuth();
+    const { requestLogin, fetchUserDetails, auth } = useArcanaAuth();
 
     onMounted(async () => {
       document.title = "Login | Arcana Demo";
@@ -94,7 +97,7 @@ export default {
 
     async function onSignInClick() {
       try {
-        await requestSocialLogin("google");
+        await requestLogin();
         await fetchUserDetails();
         await router.push("/my-files");
         toastSuccess("Login Success");
diff --git a/src/use/arcanaAuth.js b/src/use/arcanaAuth.js
index d4effd4..05f0e69 100644
--- a/src/use/arcanaAuth.js
+++ b/src/use/arcanaAuth.js
@@ -33,8 +33,8 @@ function useArcanaAuth() {
     return loginStatus;
   }
 
-  async function requestSocialLogin(type) {
-    // AUTH-4: Login user with selected social login type
+  async function requestLogin() {
+    // AUTH-4: Login user using auth popup
     // ...
   }
 
@@ -76,7 +76,7 @@ function useArcanaAuth() {
     isLoggedIn,
     logout,
     requestPublicKey,
-    requestSocialLogin,
+    requestLogin,
   };
 }