@sowell/quasar-app-extension-auth 1.10.1 → 1.11.1

package/package.json

@@ -1,16 +1,16 @@
 {
   "name": "@sowell/quasar-app-extension-auth",
-  "version": "1.10.1",
+  "version": "1.11.1",
   "description": "A Quasar app extension to manage Authentication",
   "main": "src/index.js",
   "repository": "https://github.com/sowell-ai/quasar.extension.auth",
   "scripts": {
-    "lint": "cd dev && eslint --ext .js,.ts,.vue ./",
+    "lint": "eslint --ext .js,.ts,.vue ./",
     "dev": "cd dev && quasar dev",
     "dep": "cd dev && yarn",
     "test:link": "cd dev && yarn test:link",
     "test:browser": "cd dev && yarn test:browser",
-    "test": "cd dev && yarn test"
+    "test": "vitest run"
   },
   "keywords": [],
   "author": "SoWell SAS",
@@ -34,7 +34,10 @@
     "eslint-plugin-vue": "^7.0.0",
     "jwt-decode": "^3.1.2",
     "quasar": "^2.8.4",
-    "typescript": "^4.4.2"
+    "typescript": "^4.4.2",
+    "vitest": "^4.1.11",
+    "vue": "^3.2.0",
+    "vue-i18n": "^9"
   },
   "directories": {
     "test": "test"

package/src/components/dialogs/SendEmail.vue

@@ -11,7 +11,7 @@
         alt="Background logo"
       />
     </div>
-    <div class="row justify-between items-center full-width q-px-lg q-pt-lg top-bar">
+    <div class="row justify-between items-center full-width q-px-lg top-bar">
       <div
         class="row items-center back-link"
         data-testid="restricted-back-btn"
@@ -62,7 +62,7 @@
 
   <div
     v-else
-    class="row justify-center full-height q-pl-sm q-pr-sm"
+    class="row justify-center full-height q-pl-sm q-pr-sm send-email-form"
     style="background: #f4f5f6"
     data-testid="ask-password-change-form"
   >
@@ -107,6 +107,9 @@
           <q-input
             data-testid="email-input"
             v-model="email"
+            type="email"
+            autocapitalize="off"
+            autocorrect="off"
             dense
             borderless
             bg-color="white"
@@ -247,9 +250,18 @@ export default defineComponent({
   max-height: 100vh;
 }
 
+/* Ce composant s'affiche dans un q-dialog. Sur iOS, Quasar (q-ios-padding)
+   décale déjà .q-dialog__inner sous la barre d'état : on ne lit donc PAS
+   env(), sinon le décalage serait doublé. --safe-area-inset-top n'est
+   injectée que par Capacitor SystemBars sur Android (edge-to-edge, 15+). */
 .top-bar {
   z-index: 1;
   max-width: 430px;
+  padding-top: calc(24px + var(--safe-area-inset-top, 0px));
+}
+
+.send-email-form {
+  padding-top: var(--safe-area-inset-top, 0px);
 }
 
 .back-link {

package/src/components/pages/FirstLogin.vue

@@ -8,7 +8,7 @@
         class="background-logo"
         alt="Background logo" />
     </div>
-    <div class="row justify-between items-center full-width q-px-lg q-pt-lg top-bar">
+    <div class="row justify-between items-center full-width q-px-lg top-bar">
       <div
         class="row items-center back-link"
         data-testid="back-btn"
@@ -424,6 +424,11 @@ export default defineComponent({
 .top-bar {
   z-index: 1;
   max-width: 430px;
+  /* 24px = ancien q-pt-lg. Sur iOS (viewport-fit=cover), la page n'a pas de
+     q-header : le padding iOS de Quasar ne s'applique pas, on ajoute donc la
+     safe-area ici. --safe-area-inset-top est injectée par SystemBars sur
+     Android ; env() vaut 0 sur le web. */
+  padding-top: calc(24px + var(--safe-area-inset-top, env(safe-area-inset-top, 0px)));
 }
 
 .back-link {

package/src/components/pages/ResetPassword.vue

@@ -8,7 +8,7 @@
         class="background-logo"
         alt="Background logo" />
     </div>
-    <div class="row justify-between items-center full-width q-px-lg q-pt-lg top-bar">
+    <div class="row justify-between items-center full-width q-px-lg top-bar">
       <div
         class="row items-center back-link"
         data-testid="back-btn"
@@ -317,6 +317,11 @@ export default defineComponent({
 .top-bar {
   z-index: 1;
   max-width: 430px;
+  /* 24px = ancien q-pt-lg. Sur iOS (viewport-fit=cover), la page n'a pas de
+     q-header : le padding iOS de Quasar ne s'applique pas, on ajoute donc la
+     safe-area ici. --safe-area-inset-top est injectée par SystemBars sur
+     Android ; env() vaut 0 sur le web. */
+  padding-top: calc(24px + var(--safe-area-inset-top, env(safe-area-inset-top, 0px)));
 }
 
 .back-link {

package/src/composables/useMagicLink.ts

@@ -124,6 +124,9 @@ export function useMagicLink() {
   }
 
   const requestChannels = async () => {
+    // Quasar's `loading` does not disable the button: Enter would resubmit and send
+    // a second e-mail, invalidating the first link (the API replaces the token).
+    if (isLoading.value) return
     apiErrorMessage.value = ""
     if (!validateEmail()) return
     isLoading.value = true
@@ -138,14 +141,21 @@ export function useMagicLink() {
       channels.value = offered.length ? offered : ["email"]
       channelTargets.value = targets
       selectedChannel.value = "email"
+      // Nothing to choose when only e-mail is offered (user without phone, or an
+      // app restricted to e-mail): send the link straight away.
+      if (channels.value.length === 1 && channels.value[0] === "email") {
+        await sendMagicLink("email")
+        return
+      }
       step.value = "channel"
     } catch (error) {
       const axiosError = error as AxiosError
       if (axiosError.response?.status === 403) {
-        // Backend check: ENV["COMPANY_RESET_PASSWORD_FORBIDDEN"] vs user.company_id,
-        // rescued as Rescueable::Forbidden with i18n key errors.magiclink.forbidden.
-        // No pre-flight signal exists (no Company.config field, nothing on /me) - the
-        // front can only ever find out by attempting the call, hence no button hiding.
+        // Backend check: the user's company (or its master/slaves) has
+        // `no_password_reset` set, rescued as Rescueable::Forbidden with i18n key
+        // errors.magiclink.forbidden. No pre-flight signal exists on the front, so
+        // it only finds out by attempting the call, hence no button hiding. The
+        // same 403 can come from the automatic send in requestChannels.
         restricted.value = true
         restrictedMessage.value = readApiError(error) || ""
       } else if (axiosError.response?.status === 404) {