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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sowell/quasar-app-extension-auth",
-  "version": "0.3.17",
+  "version": "0.3.19",
   "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="column items-center">
-      <div class="column short-screen">
-        <div class="column col-7 justify-center">
+    <q-page class="column justify-end items-center">
+      <div class="column">
+        <div class="column justify-center" style="height: 35vh">
           <div class="row justify-center">
             <img
               src="../../assets/Logo.svg"
@@ -16,7 +16,7 @@
             />
           </div>
         </div>
-        <div class="col-5">
+        <div class="">
           <q-form @submit="onSubmit">
             <div>
               <div
@@ -97,7 +97,7 @@
                 </q-btn>
               </div>
               <div
-                class="q-mb-lg q-mt-lg text-primary text-center"
+                class="q-mb-xl q-mt-lg text-primary text-center"
                 @click="forgottenPassword = true"
                 data-cy="forgot-password"
                 style="font-size: 14px; cursor: pointer; width: 350px"
@@ -234,14 +234,4 @@ 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,7 +9,7 @@ import {
   ionEyeSharp,
   ionEyeOffSharp,
 } from "@quasar/extras/ionicons-v5";
-import { useQuasar, Platform } from "quasar";
+import { Platform } from "quasar";
 
 import { $prompts, $router, useAuthState } from "../injects";
 
@@ -21,7 +21,6 @@ interface HeadersInterface {
 
 export function useAuth() {
   const authState = useAuthState();
-  const { localStorage } = useQuasar();
 
   const { t } = useI18n();
   const {
@@ -92,12 +91,12 @@ export function useAuth() {
       // @ts-ignore
       if (!window.Cypress) {
         const isDifferentUser =
-          !localStorage.has("credentials") ||
+          !localStorage.getItem("credentials") ||
           // @ts-ignore
-          localStorage.getItem("credentials").email !== data.auth.email;
+          JSON.parse(localStorage.getItem("credentials")).email !== data.auth.email;
 
         if (isDifferentUser) {
-          localStorage.set("credentials", data.auth);
+          localStorage.setItem("credentials", JSON.stringify(data.auth));
         }
       }
       push(LOCAL_SUCCESS_REDIRECTION_ROUTE);
@@ -117,11 +116,11 @@ export function useAuth() {
   };
 
   const deviceReady = () => {
-    if (localStorage.has("credentials")) {
+    if (localStorage.getItem("credentials")) {
       // @ts-ignore
-      email.value = localStorage.getItem("credentials").email;
+      email.value = JSON.parse(localStorage.getItem("credentials")).email;
       // @ts-ignore
-      password.value = localStorage.getItem("credentials").password;
+      password.value = JSON.parse(localStorage.getItem("credentials")).password;
     }
   };