@sowell/quasar-app-extension-auth 0.2.6 → 0.2.7

package/README.md

@@ -39,7 +39,7 @@ The default is http://localhost:3000, you must point it to your server base url
 
 6. Server route for authentication
 
-The default is /users/sign_in
+The default is /auth
 
 7. Server route to reset password
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sowell/quasar-app-extension-auth",
-  "version": "0.2.6",
+  "version": "0.2.7",
   "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/Auth.vue

@@ -145,6 +145,7 @@ export default defineComponent({
         },
       };
 
+
       post(AUTH_SERVER_RESET_PASSWORD_ROUTE, data)
         .then(() => {
           forgottenPassword.value = false;

package/src/components/pages/ResetPassword.vue

@@ -41,7 +41,7 @@
               no-caps
               data-cy="send-new-password"
               class="full-width"
-              :disable="canSubmit"
+              :disable="!canSubmit"
             />
           </div>
         </q-form>
@@ -52,50 +52,111 @@
 
 <script lang="ts">
 //@ts-ignore
-import { computed, defineComponent, ref } from "vue";
+import { computed, defineComponent, ref, Ref, onMounted } from "vue";
 import { useQuasar } from "quasar";
 import { useI18n } from "vue-i18n";
-import { useRouter } from "vue-router";
-import { $api, $prompts } from "../../injects";
+import { $api, $prompts, $router } from "../../injects";
+import jwt from 'jwt-decode'
+import { Buffer } from 'buffer'
+
+interface DecodedToken { // FIXME: consider to move to its own file
+  sub: number,
+  email: string,
+  token: string
+}
 
 export default defineComponent({
   name: "ResetPassword",
 
   setup() {
-    const { patch } = $api();
+    const { patch, post } = $api();
     const {
+      AUTH_SERVER_SIGNING_ROUTE,
       AUTH_SERVER_UPDATE_PASSWORD_ROUTE,
-      LOCAL_SUCCESS_REDIRECTION_ROUTE,
+      LOCAL_LOGIN_ROUTE,
     } = $prompts();
     const $q = useQuasar();
-    const router = useRouter();
+    const router = $router()
+    const $route = router.currentRoute.value
     const password = ref("");
     const loading = ref(false);
     const { t } = useI18n();
 
-    const canSubmit = computed(() => password.value.length < 6);
+    const token = ref("")
+
+    const decodedToken = computed(() => {
+      if (!token.value) return null
+      return jwt(token.value) as DecodedToken
+    }) as Ref<DecodedToken | null>
+
+    const canSubmit = computed(() => {
+      return decodedToken.value !== null && password.value.length >= 6
+    });
 
     const validations = {
       passwordRules: [
         (val: string) => !!val || t("auth.passwordPresenceError"),
-        (val: string) => val.length >= 6 || t("auth.passwordLengthError"),
+        (val: string) => val.length >= 6 || t("auth.passwordLengthError")
+      ],
+      passwordConfirmationRules: [
+        (val: string) =>
+          val === password.value || t("auth.newPasswordConfirmationFailed"),
+        (val: string) => !!val || t("auth.resetPasswordPresenceError"),
+        (val: string) => val.length >= 6 || t("auth.resetPasswordLengthError"),
       ],
     };
 
+    const decodeKey  = (key: string) => {
+      try {
+        const decodedKey = Buffer.from(key, "base64").toString("utf-8").split(',')
+        if (decodedKey.length !== 2) {
+          throw 'Invalid encoded key'
+        }
+        console.log('decodedKey', decodedKey)
+        const email = decodedKey[0].replace('{', '').split(':')[1]
+        const tmpToken = decodedKey[1].replace('}', '').split(':')[1]
+        return {
+          decoded: true,
+          email,
+          tmpToken
+        }
+      } catch (err) {
+        console.log('decodeKey err', err)
+        return {
+          decoded: false
+        }
+      }
+    }
+
     const onSubmit = () => {
-      const data = {
-        password: password.value,
-      };
-      patch(AUTH_SERVER_UPDATE_PASSWORD_ROUTE, data)
-        .then(() => {
+      const updatePasswordPayload = {
+        data: {
+          type: "users",
+          id: decodedToken.value.sub,
+          attributes:
+          {
+            password: password.value
+          }
+        }
+      }
+      const updatePasswordHeaders = {
+        headers: {
+          'Authorization': `Bearer ${token.value}`
+        }
+      }
+
+      patch(
+        AUTH_SERVER_UPDATE_PASSWORD_ROUTE.replace(':userId', String(decodedToken.value.sub)),
+        updatePasswordPayload,
+        updatePasswordHeaders
+      ).then(() => {
           $q.notify({
             message: t("auth.passwordRecoverySuccess"),
             color: "positive",
             position: "top",
           });
-          router.push(LOCAL_SUCCESS_REDIRECTION_ROUTE);
-        })
-        .catch(() => {
+          router.push(LOCAL_LOGIN_ROUTE);
+        }).catch(() => {
           $q.notify({
             message: t("auth.passwordRecoveryFailed"),
             color: "negative",
@@ -104,6 +165,49 @@ export default defineComponent({
         });
     };
 
+    onMounted(() => {
+      let key = $route.query.key as string
+      const { decoded, email, tmpToken } = decodeKey(key)
+
+      if (!decoded) {
+        return $q.notify({
+          message: t("auth.passwordRecoveryInvalidLink"),
+          color: "negative",
+          position: "top",
+        })
+      }
+
+      const tmpAuthPayload = {
+        auth: { 
+          email: email, 
+          token: tmpToken
+        }
+      }
+
+      post(AUTH_SERVER_SIGNING_ROUTE, tmpAuthPayload)
+        .then((response) => {
+          token.value = response.data.jwt
+          if (!token.value) throw 'Error reading the temporary token'
+        })
+        .catch((error) => {
+          if (error.response) {
+            // Request made and server responded
+            if (error.response.status === 404) {
+              return $q.notify({
+                message: t("auth.passwordRecoveryExpiredLink"),
+                color: "negative",
+                position: "top",
+              });
+            }
+          }
+          return $q.notify({
+            message: t("auth.passwordRecoveryFailed"),
+            color: "negative",
+            position: "top",
+          });
+        });
+    })
+
     return {
       password,
       validations,

package/src/prompts.js

@@ -27,7 +27,7 @@ module.exports = function () {
       type: "input",
       required: true,
       message: "Route to update the password (page)",
-      default: "/reset_password",
+      default: "/ResetPassword/",
     },
     {
       name: "AUTH_SERVER_BASE_URL",
@@ -41,7 +41,7 @@ module.exports = function () {
       type: "input",
       required: true,
       message: "API endpoint for signin (without host)",
-      default: "/users/sign_in",
+      default: "/auth",
     },
     {
       name: "AUTH_SERVER_RESET_PASSWORD_ROUTE",