@sowell/quasar-app-extension-auth 0.3.15 → 0.3.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sowell/quasar-app-extension-auth",
-  "version": "0.3.15",
+  "version": "0.3.17",
   "description": "A Quasar app extension to manage Authentication",
   "main": "src/index.js",
   "repository": "https://github.com/sowell-ai/quasar.extension.auth",

package/src/components/pages/AuthReporter.vue

@@ -1,8 +1,8 @@
 <template>
   <q-layout>
-    <q-page class="">
-      <div class="column q-pa-lg" style="height: 80vh">
-        <div class="column col-8 justify-center items-center">
+    <q-page class="column items-center">
+      <div class="column short-screen">
+        <div class="column col-7 justify-center">
           <div class="row justify-center">
             <img
               src="../../assets/Logo.svg"
@@ -16,7 +16,7 @@
             />
           </div>
         </div>
-        <div class="col-4">
+        <div class="col-5">
           <q-form @submit="onSubmit">
             <div>
               <div
@@ -97,10 +97,10 @@
                 </q-btn>
               </div>
               <div
-                class="q-mb-lg q-mt-lg text-primary"
+                class="q-mb-lg q-mt-lg text-primary text-center"
                 @click="forgottenPassword = true"
                 data-cy="forgot-password"
-                style="font-size: 14px; cursor: pointer"
+                style="font-size: 14px; cursor: pointer; width: 350px"
               >
                 {{ $t("auth.forgottenPassword") }}
               </div>
@@ -234,4 +234,14 @@ export default defineComponent({
 div.q-field__messages {
   display: none;
 }
+
+.short-screen {
+  height: 80vh;
+}
+
+@media screen and (max-height: 680px) {
+  .short-screen {
+    height: 65vh;
+  }
+}
 </style>

package/src/composables/auth.ts

@@ -9,6 +9,7 @@ import {
   ionEyeSharp,
   ionEyeOffSharp,
 } from "@quasar/extras/ionicons-v5";
+import { useQuasar, Platform } from "quasar";
 
 import { $prompts, $router, useAuthState } from "../injects";
 
@@ -20,6 +21,8 @@ interface HeadersInterface {
 
 export function useAuth() {
   const authState = useAuthState();
+  const { localStorage } = useQuasar();
+
   const { t } = useI18n();
   const {
     LOCAL_SUCCESS_REDIRECTION_ROUTE,
@@ -86,6 +89,17 @@ export function useAuth() {
 
     try {
       await authState.signin(data, options);
+      // @ts-ignore
+      if (!window.Cypress) {
+        const isDifferentUser =
+          !localStorage.has("credentials") ||
+          // @ts-ignore
+          localStorage.getItem("credentials").email !== data.auth.email;
+
+        if (isDifferentUser) {
+          localStorage.set("credentials", data.auth);
+        }
+      }
       push(LOCAL_SUCCESS_REDIRECTION_ROUTE);
       loading.value = false;
     } catch (err) {
@@ -102,10 +116,22 @@ export function useAuth() {
     );
   };
 
+  const deviceReady = () => {
+    if (localStorage.has("credentials")) {
+      // @ts-ignore
+      email.value = localStorage.getItem("credentials").email;
+      // @ts-ignore
+      password.value = localStorage.getItem("credentials").password;
+    }
+  };
+
   onMounted(() => {
     if (authState.raw) {
       replace(LOCAL_SUCCESS_REDIRECTION_ROUTE);
     }
+    if (Platform.is.capacitor) {
+      deviceReady();
+    }
   });
 
   return {