@sowell/quasar-app-extension-auth 0.2.3 → 0.2.4

package/.github/workflows/main.yml

@@ -19,4 +19,4 @@ jobs:
         uses: cypress-io/github-action@v2
         with:
           working-directory: dev
-          command: yarn test:e2e:ci
+          command: yarn test

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sowell/quasar-app-extension-auth",
-  "version": "0.2.3",
+  "version": "0.2.4",
   "description": "A Quasar app extension to manage Authentication",
   "main": "src/index.js",
   "repository": "https://github.com/sowell-ai/quasar.extension.auth",
@@ -8,8 +8,9 @@
     "lint": "cd dev && eslint --ext .js,.ts,.vue ./",
     "dev": "cd dev && quasar dev",
     "dep": "cd dev && yarn",
-    "test:e2e": "cd dev && yarn && cross-env E2E_TEST=true start-test \"quasar dev\" http-get://localhost:8080 \"cypress open\"",
-    "test:e2e:ci": "cd dev && yarn && cross-env E2E_TEST=true start-test \"quasar dev\" http-get://localhost:8080 \"cypress run\""
+    "test:link": "cd dev && yarn test:link",
+    "test:browser": "cd dev && yarn test:browser",
+    "test": "cd dev && yarn test"
   },
   "keywords": [],
   "author": "SoWell SAS",

package/src/boot/router-guards.ts

@@ -5,17 +5,17 @@ import { BootInterface } from "../interfaces";
 
 export default boot(({ router, store }: BootInterface) => {
   const {
-    "@sowell/auth": { LOCAL_LOGIN_ROUTE, LOCAL_CHECK_CODE_ROUTE },
+    "@sowell/auth": { LOCAL_LOGIN_ROUTE },
   } = prompts;
 
   router.beforeEach((to, from, next) => {
-    let isValid = store.getters["token/getIsValid"]
-    let token = store.getters["token/getRaw"]
+    let isValid = store.getters["token/getIsValid"];
+    let token = store.getters["token/getRaw"];
     if (
       !isValid &&
       !token &&
       to.path !== LOCAL_LOGIN_ROUTE &&
-      to.path !== LOCAL_CHECK_CODE_ROUTE
+      to.name !== "update_password"
     ) {
       next(LOCAL_LOGIN_ROUTE);
     } else {

package/src/components/pages/ResetPassword.vue

@@ -1,59 +1,59 @@
 <template>
-  <q-page class="flex flex-center">
-    <q-card square>
-      <q-card-section>
-        <div class="text-h5 text-center head">
-          {{ $t("auth.passwordRecovery") }}
-        </div>
-      </q-card-section>
-
-      <q-form class="q-gutter-md" @submit="onSubmit">
-        <q-card-section>
-          <q-input
-            id="password"
-            v-model="password"
-            type="password"
-            :label="$t('auth.newPassword')"
-            :rules="validations['passwordRules']"
-            rounded
-            outlined
-            dense
-            class="full-width q-mb-md"
-          >
-          </q-input>
-          <q-input
-            id="passwordConfirmation"
-            v-model="passwordConfirmation"
-            type="password"
-            :label="$t('auth.newPasswordConfirmation')"
-            :rules="validations['passwordConfirmationRules']"
-            rounded
-            outlined
-            dense
-            class="full-width q-mb-md"
+  <q-layout>
+    <q-page class="flex flex-center">
+      <div>
+        <div class="column items-center q-mb-xl">
+          <img
+            style="width: 40px"
+            src="../../assets/Logo.svg"
+            class="q-mb-sm"
+          />
+          <div
+            class="text-h5 text-center head q-mt-sm"
+            style="font-size: 17px; font-weight: 500"
           >
-          </q-input>
-        </q-card-section>
+            {{ $t("auth.passwordRecovery") }}
+          </div>
+        </div>
+        <q-form class="column items-center" @submit="onSubmit">
+          <div>
+            <div class="q-mb-sm" style="font-size: 14px; font-weight: 400">
+              {{ $t("auth.newPassword") }}
+            </div>
+            <q-input
+              id="password"
+              v-model="password"
+              data-cy="reset-password"
+              :rules="validations['passwordRules']"
+              outlined
+              dense
+              class="full-width q-mb-md"
+            />
+          </div>
 
-        <q-card-actions>
-          <q-btn
-            rounded
-            :label="$t('common.register')"
-            color="primary"
-            :loading="loading"
-            type="submit"
-            class="full-width"
-            :disable="canSubmit"
-          />
-        </q-card-actions>
-      </q-form>
-    </q-card>
-  </q-page>
+          <div class="full-width">
+            <q-btn
+              rounded
+              :label="$t('common.register')"
+              color="primary"
+              :loading="loading"
+              type="submit"
+              no-caps
+              data-cy="send-new-password"
+              class="full-width"
+              :disable="canSubmit"
+            />
+          </div>
+        </q-form>
+      </div>
+    </q-page>
+  </q-layout>
 </template>
 
 <script lang="ts">
-import { useQuasar } from "quasar";
+//@ts-ignore
 import { computed, defineComponent, ref } from "vue";
+import { useQuasar } from "quasar";
 import { useI18n } from "vue-i18n";
 import { useRouter } from "vue-router";
 import { $api, $prompts } from "../../injects";
@@ -70,31 +70,21 @@ export default defineComponent({
     const $q = useQuasar();
     const router = useRouter();
     const password = ref("");
-    const passwordConfirmation = ref("");
     const loading = ref(false);
     const { t } = useI18n();
 
-    const canSubmit = computed(() => {
-      return password.value != "" &&
-        password.value === passwordConfirmation.value
-        ? false
-        : true;
-    });
+    const canSubmit = computed(() => password.value.length < 6);
 
     const validations = {
       passwordRules: [
-        (val: string) => !!val || t("auth.newPasswordPresenceError"),
-      ],
-      passwordConfirmationRules: [
-        (val: string) =>
-          val === password.value || t("auth.newPasswordConfirmationFailed"),
+        (val: string) => !!val || t("auth.passwordPresenceError"),
+        (val: string) => val.length >= 6 || t("auth.passwordLengthError"),
       ],
     };
 
     const onSubmit = () => {
       const data = {
         password: password.value,
-        password_confirmation: passwordConfirmation.value,
       };
       patch(AUTH_SERVER_UPDATE_PASSWORD_ROUTE, data)
         .then(() => {
@@ -116,7 +106,6 @@ export default defineComponent({
 
     return {
       password,
-      passwordConfirmation,
       validations,
       loading,
       onSubmit,
@@ -127,13 +116,8 @@ export default defineComponent({
 </script>
 
 <style scoped>
-.head,
+@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&display=swap");
 .q-page {
-  opacity: 0.7;
-}
-
-.q-card {
-  width: 400px;
-  padding: 50px;
+  font-family: "Montserrat", sans-serif;
 }
 </style>

package/src/routes/index.ts

@@ -14,6 +14,7 @@ const routes: RouteRecordRaw[] = [
   },
   {
     path: LOCAL_UPDATE_PASSWORD_ROUTE,
+    name:"update_password",
     // @ts-ignore
     component: () => import("@sowell/auth/pages/ResetPassword.vue"),
   },

package/src/store/index.ts

@@ -34,6 +34,16 @@ const mutations: MutationTree<tokenStateInterface> = {
   },
   setPayload(state, value: payload) {
     state.payload = {...value}
+  },
+  reset(state) {
+    state.raw = ""
+    state.payload = {
+      company_hp: undefined,
+      exp: undefined,
+      gm_key: "",
+      roles: [],
+      sub: null
+    }
   }
 }