@fishawack/lab-velocity 2.0.0-beta.5 → 2.0.0-beta.50

package/_Build/vue/modules/AuthModule/routes/force-reset.vue

@@ -1,21 +1,14 @@
 <template>
     <div class="relative">
         <section id="resetPasswordForm">
-            <h1
-                class="h2 h2--small"
-                v-html="!form.successful ? 'Welcome' : 'Success'"
-            />
+            <h1 class="h2 h2--small" v-html="'Welcome'" />
             <form class="form" @submit.prevent="submit">
-                <div v-if="!form.successful">
-                    <p class="AM-mt-2 AM-mb-0 AM-color-highlight">
-                        <strong class=""
-                            >Email:
-                            {{ $store.state?.auth?.user?.email }}</strong
-                        >
+                <div>
+                    <p class="mt-2 mb-0 color-highlight">
+                        <strong class="">Email: {{ email }}</strong>
                     </p>
-                    <p class="AM-mt-0.5">
-                        <strong
-                            >Hello {{ $store.state?.auth?.user?.name }}</strong
+                    <p class="mt-0.5">
+                        <strong>Hello {{ name }}</strong
                         >, and welcome to {{ $root.appName }}. To maintain
                         security, anyone signing in with a one-time-password
                         must <strong>create a new password</strong> the first
@@ -23,7 +16,7 @@
                     </p>
                     <el-input
                         v-model="form.password"
-                        class="AM-mt-2"
+                        class="mt-2"
                         label="New Password"
                         placeholder="Enter new password"
                         name="password"
@@ -33,31 +26,22 @@
                         required
                     />
 
-                    <VPasswordValidation
+                    <VelPasswordValidation
                         :password="form.password"
                         @passwordValid="updatePasswordValidity"
                     />
 
                     <elButton
                         native-type="submit"
-                        class="AM-mt-3"
+                        class="mt-3"
                         type="primary"
-                        :disabled="form.processing || !isPasswordValid"
-                        :loading="form.processing"
+                        :disabled="loading || !isPasswordValid"
+                        :loading="loading"
                         @click="onSubmit"
                     >
                         <span v-text="'Update password'" />
                     </elButton>
                 </div>
-                <div v-else>
-                    <strong class=""
-                        >Email: {{ $store.state.auth?.user?.email }}</strong
-                    >
-                    <p v-text="`Your password has been updated.`" />
-                    <elButton type="primary" @click="handleButton">
-                        Continue
-                    </elButton>
-                </div>
             </form>
         </section>
     </div>
@@ -65,8 +49,18 @@
 
 <script>
 import Form from "form-backend-validation";
+import { ElNotification } from "element-plus";
+import { guestRequest } from "../js/guest-request";
 
 export default {
+    components: {
+        VelPasswordValidation:
+            require("../../../components/layout/PasswordValidation.vue")
+                .default,
+        elInput: require("../../../components/form/basic.vue").default,
+        elButton: require("../../../components/basic/Button.vue").default,
+    },
+
     data() {
         return {
             form: new Form(
@@ -77,13 +71,17 @@ export default {
                 { resetOnSuccess: false },
             ),
             isPasswordValid: false,
+            loading: false,
+            name: "",
+            email: "",
         };
     },
 
     mounted() {
-        this.$store.dispatch("getUser", {
-            errors: this.$root.errors,
-        });
+        this.$store.dispatch("getUser");
+
+        this.name = this.$store.state?.auth?.user?.name;
+        this.email = this.$store.state?.auth?.user?.email;
     },
 
     methods: {
@@ -94,46 +92,41 @@ export default {
                 await this.form.put("/user/password");
                 await this.login();
             } catch (e) {
-                this.$root.errors(e);
+                console.log(e);
             } finally {
                 this.loading = false;
             }
         },
         async login() {
-            this.loading = true;
-
             try {
-                const res = await this.form.post("/login");
-
-                if (res["logged-in"]) {
-                    try {
-                        await this.$store.dispatch("logout", {
-                            errors: this.$root.errors,
-                        });
-                    } catch (e) {}
-
-                    await this.form.post("/login");
-                }
+                await guestRequest({
+                    form: this.form,
+                    url: "/login",
+                    store: this.$store,
+                });
             } catch (e) {
-                this.$root.errors(e);
+                console.log(e);
             } finally {
-                this.loading = false;
                 await this.postLogin();
             }
         },
 
         async postLogin() {
-            const { data: user } = await this.$store.dispatch("getUser", {
-                errors: this.$root.errors,
+            const { data: user } = await this.$store.dispatch("getUser");
+
+            this.$router.push({ name: this.$store.state.auth.redirect });
+
+            ElNotification({
+                type: "success",
+                message: "Password updated successfully",
+                duration: 10000,
+                class: "el-notification--success el-notification--right-override",
             });
         },
 
         updatePasswordValidity(isValid) {
             this.isPasswordValid = isValid;
         },
-        handleButton() {
-            this.$emit("close");
-        },
     },
 
     metaInfo() {
@@ -141,12 +134,5 @@ export default {
             title: "Reset Password",
         };
     },
-
-    components: {
-        VPasswordValidation: require("./../components/VPasswordValidation.vue")
-            .default,
-        elInput: require("../../../components/form/basic.vue").default,
-        elButton: require("../../../components/basic/Button.vue").default,
-    },
 };
 </script>

package/_Build/vue/modules/AuthModule/routes/forgot.vue

@@ -3,14 +3,14 @@
         <section id="forgotPasswordForm">
             <h1 class="h2 h2--small">Reset password</h1>
             <form class="form" @submit.prevent="submit">
-                <p class="AM-mt-2">
+                <p class="mt-2">
                     Enter the email address associated with your account to
                     continue.
                 </p>
 
                 <el-input
                     v-if="!form.successful"
-                    class="AM-mt-3 AM-mb-3"
+                    class="mt-3 mb-3"
                     v-model="form.email"
                     label="Email "
                     placeholder="Enter email address"
@@ -32,7 +32,7 @@
                     Continue
                 </elButton>
 
-                <p class="disclaimer AM-mt-3">
+                <p class="disclaimer mt-3">
                     <router-link
                         class="color-1 underline"
                         :to="{ name: 'auth.login' }"
@@ -47,6 +47,7 @@
 
 <script>
 import Form from "form-backend-validation";
+import { guestRequest } from "../js/guest-request";
 
 export default {
     components: {
@@ -66,14 +67,18 @@ export default {
     methods: {
         async onSubmit() {
             try {
-                await this.form.post("/forgot-password");
+                await guestRequest({
+                    form: this.form,
+                    url: "/forgot-password",
+                    store: this.$store,
+                });
 
                 this.$router.push({
                     name: "auth.success-forgot",
                     query: { email: this.form.email },
                 });
             } catch (e) {
-                this.$root.errors(e);
+                console.log(e);
             }
         },
     },

package/_Build/vue/modules/AuthModule/routes/login.vue

@@ -1,10 +1,10 @@
 <template>
     <h1 class="h2 h2--small">Sign in</h1>
-    <p class="AM-mb-3 AM-mt-2">Enter your password to continue.</p>
+    <p class="mb-3 mt-2">Enter your password to continue.</p>
 
     <form @submit.prevent="submit" class="form" id="memberLoginForm">
         <el-input
-            class="AM-mb-3"
+            class="mb-3"
             label="Email"
             placeholder="Enter your email address"
             name="email"
@@ -15,7 +15,7 @@
         />
 
         <el-input
-            class="AM-mb-3"
+            class="mb-3"
             label="Password"
             placeholder="Enter your password"
             name="password"
@@ -47,7 +47,7 @@
             Continue
         </el-button>
 
-        <p class="disclaimer AM-mt-3">
+        <p class="disclaimer mt-3">
             Having trouble signing in?
             <router-link
                 class="color-1 underline"
@@ -65,6 +65,7 @@
 
 <script>
 import Form from "form-backend-validation";
+import { guestRequest } from "../js/guest-request";
 
 export default {
     components: {
@@ -93,30 +94,22 @@ export default {
             this.loading = true;
 
             try {
-                const res = await this.form.post("/login");
-
-                if (res["logged-in"]) {
-                    try {
-                        await this.$store.dispatch("logout", {
-                            errors: this.$root.errors,
-                        });
-                    } catch (e) {}
-
-                    await this.form.post("/login");
-                }
+                const res = await guestRequest({
+                    form: this.form,
+                    url: "/login",
+                    store: this.$store,
+                });
 
                 await this.postLogin();
             } catch (e) {
-                this.$root.errors(e);
+                console.log(e);
             } finally {
                 this.loading = false;
             }
         },
 
         async postLogin() {
-            const { data: user } = await this.$store.dispatch("getUser", {
-                errors: this.$root.errors,
-            });
+            const { data: user } = await this.$store.dispatch("getUser");
 
             if (window.dataLayer) {
                 window.dataLayer.push({ event: "login", user });

package/_Build/vue/modules/AuthModule/routes/logincallback.vue

@@ -16,9 +16,7 @@ export default {
 
     methods: {
         async postLogin() {
-            const { data: user } = await this.$store.dispatch("getUser", {
-                errors: this.$root.errors,
-            });
+            const { data: user } = await this.$store.dispatch("getUser");
 
             if (window.dataLayer) {
                 window.dataLayer.push({ event: "login", user });

package/_Build/vue/modules/AuthModule/routes/loginsso.vue

@@ -1,11 +1,11 @@
 <template>
     <template v-if="stage === 1">
         <h1 class="h2 h2--small">Sign in</h1>
-        <p class="AM-mb-3 AM-mt-2">Enter your email address to continue.</p>
+        <p class="mb-3 mt-2">Enter your email address to continue.</p>
 
         <form @submit.prevent="submit" class="form" id="memberLoginForm">
             <el-input
-                class="AM-mb-3"
+                class="mb-3"
                 label="Email"
                 placeholder="Enter your email address"
                 name="email"
@@ -35,7 +35,7 @@
                 Continue
             </el-button>
 
-            <p class="disclaimer AM-mt-3">
+            <p class="disclaimer mt-3">
                 Having trouble signing in?
                 <a :href="$store.state.auth.contact" class="underline"
                     >Contact us</a
@@ -45,13 +45,11 @@
     </template>
     <template v-else>
         <h1 class="h2 h2--small">Sign in with SSO</h1>
-        <p class="AM-mt-2">
+        <p class="mt-2">
             Redirecting you to your organisation’s Single Sign-On (SSO) gateway
-            <span class="AM-color-highlight"
-                >in {{ countdown }} seconds...</span
-            >
+            <span class="color-highlight">in {{ countdown }} seconds...</span>
         </p>
-        <p class="disclaimer AM-mt-3">
+        <p class="disclaimer mt-3">
             <a :href="redirect_url" class="underline">Go to SSO gateway</a>
         </p>
     </template>
@@ -59,6 +57,7 @@
 
 <script>
 import Form from "form-backend-validation";
+import { guestRequest } from "../js/guest-request";
 
 export default {
     components: {
@@ -89,7 +88,12 @@ export default {
             this.loading = true;
 
             try {
-                const res = await this.form.post(`/hydrate/sso/check`);
+                const res = await guestRequest({
+                    form: this.form,
+                    url: "/hydrate/sso/check",
+                    store: this.$store,
+                });
+
                 if (res["redirect_url"]) {
                     this.redirect_url = res["redirect_url"];
                     this.setRedirect();
@@ -100,7 +104,7 @@ export default {
                     });
                 }
             } catch (e) {
-                this.$root.errors(e);
+                console.log(e);
             } finally {
                 this.loading = false;
             }

package/_Build/vue/modules/AuthModule/routes/logout.vue

@@ -1,4 +1,7 @@
 <script>
+import axios from "axios";
+import Cookies from "js-cookie";
+
 export default {
     metaInfo() {
         return {
@@ -8,14 +11,23 @@ export default {
 
     async mounted() {
         try {
-            await this.$store.dispatch("logout", {
-                errors: this.$root.errors,
-            });
+            await this.$store.dispatch("logout");
+        } catch {
+            /* empty */
+        }
+
+        // Clear all cookies
+        Object.keys(Cookies.get()).forEach(function (cookie, attributes) {
+            Cookies.remove(cookie, attributes);
+        });
+
+        try {
+            await axios.get("/sanctum/csrf-cookie");
         } catch {
             /* empty */
-        } finally {
-            this.$router.push({ name: "auth.login" });
         }
+
+        this.$router.push({ name: "auth.login" });
     },
 };
 </script>

package/_Build/vue/modules/AuthModule/routes/logoutheadless.vue

@@ -16,9 +16,7 @@ export default {
 
     async mounted() {
         try {
-            await this.$store.dispatch("logout", {
-                errors: this.$root.errors,
-            });
+            await this.$store.dispatch("logout");
         } finally {
             this.done = true;
         }

package/_Build/vue/modules/AuthModule/routes/register.vue

@@ -1,6 +1,6 @@
 <template>
     <h1 class="h2 h2--small">Register</h1>
-    <p class="AM-mb-3 AM-mt-2">
+    <p class="mb-3 mt-2">
         Please enter your personal details to complete your registration.
     </p>
 
@@ -10,7 +10,7 @@
         id="memberLoginForm"
     >
         <el-input
-            class="AM-mb-2"
+            class="mb-2"
             label="Full name"
             placeholder="Enter your full name"
             name="name"
@@ -20,7 +20,7 @@
         />
 
         <el-input
-            class="AM-mb-2"
+            class="mb-2"
             label="Email"
             placeholder="Enter your email address"
             name="email"
@@ -31,7 +31,7 @@
         />
 
         <el-input
-            class="AM-mb-2"
+            class="mb-2"
             label="Password"
             name="password"
             placeholder="Create a unique password"
@@ -42,7 +42,7 @@
             :error="form.errors"
         />
 
-        <VPasswordValidation
+        <VelPasswordValidation
             :password="form.password"
             @passwordValid="updatePasswordValidity"
         />
@@ -72,7 +72,7 @@
             Register
         </elButton>
 
-        <p class="disclaimer AM-mt-3">
+        <p class="disclaimer mt-3">
             Having trouble registering?
             <a :href="$store.state.auth.contact" class="underline"
                 >Contact us</a
@@ -83,8 +83,18 @@
 
 <script>
 import Form from "form-backend-validation";
+import { ElNotification } from "element-plus";
+import { guestRequest } from "../js/guest-request";
 
 export default {
+    components: {
+        VelPasswordValidation:
+            require("../../../components/layout/PasswordValidation.vue")
+                .default,
+        elInput: require("../../../components/form/basic.vue").default,
+        elButton: require("../../../components/basic/Button.vue").default,
+    },
+
     data() {
         return {
             form: new Form(
@@ -107,24 +117,19 @@ export default {
             this.loading = true;
 
             try {
-                const res = await this.form.post("/register");
-
-                if (res["logged-in"]) {
-                    try {
-                        await this.$store.dispatch("logout", {
-                            errors: this.$root.errors,
-                        });
-                    } catch (e) {}
+                const res = await guestRequest({
+                    form: this.form,
+                    url: "/register",
+                    store: this.$store,
+                });
 
-                    await this.form.post("/register");
-                }
                 if (res["redirect"]) {
                     // Redirect here
                     this.$router.push({
                         name: `auth.login`,
                         query: { company: res["company"] },
                     });
-                    this.$notify.error({
+                    ElNotification.error({
                         title: "Domain is SSO enabled",
                         message: "Sign in with your company email address",
                         duration: 10000,
@@ -133,16 +138,14 @@ export default {
                     await this.postLogin();
                 }
             } catch (e) {
-                this.$root.errors(e);
+                console.log(e);
             } finally {
                 this.loading = false;
             }
         },
 
         async postLogin() {
-            const { data: user } = await this.$store.dispatch("getUser", {
-                errors: this.$root.errors,
-            });
+            const { data: user } = await this.$store.dispatch("getUser");
 
             if (window.dataLayer) {
                 window.dataLayer.push({ event: "login", user });
@@ -163,12 +166,5 @@ export default {
             this.isPasswordValid = isValid;
         },
     },
-
-    components: {
-        VPasswordValidation: require("./../components/VPasswordValidation.vue")
-            .default,
-        elInput: require("../../../components/form/basic.vue").default,
-        elButton: require("../../../components/basic/Button.vue").default,
-    },
 };
 </script>

package/_Build/vue/modules/AuthModule/routes/reset.vue

@@ -4,16 +4,16 @@
             <h1 class="h2 h2--small">Reset password</h1>
             <form class="form" @submit.prevent="submit">
                 <div v-if="!form.successful">
-                    <p class="AM-mt-2 AM-mb-0 AM-color-highlight">
+                    <p class="mt-2 mb-0 color-highlight">
                         <strong class="">Email: {{ form?.email }}</strong>
                     </p>
-                    <p class="AM-mt-0.5">
+                    <p class="mt-0.5">
                         Please create a new password. Passwords you have used
                         previously aren’t permitted.
                     </p>
                     <el-input
                         v-model="form.password"
-                        class="AM-mt-3"
+                        class="mt-3"
                         label="New Password"
                         placeholder="Enter new password"
                         name="password"
@@ -23,7 +23,7 @@
                         required
                     />
 
-                    <VPasswordValidation
+                    <VelPasswordValidation
                         :password="form.password"
                         @passwordValid="updatePasswordValidity"
                     />
@@ -51,7 +51,7 @@
                     <h4 class="mt" v-text="`Success!`" />
                     <p v-text="`Your password has been reset.`" />
                 </div>
-                <p class="disclaimer AM-mt-3">
+                <p class="disclaimer mt-3">
                     <router-link
                         class="color-1 underline"
                         :to="{ name: 'auth.login' }"
@@ -66,8 +66,17 @@
 
 <script>
 import Form from "form-backend-validation";
+import { guestRequest } from "../js/guest-request";
 
 export default {
+    components: {
+        VelPasswordValidation:
+            require("../../../components/layout/PasswordValidation.vue")
+                .default,
+        elInput: require("../../../components/form/basic.vue").default,
+        elButton: require("../../../components/basic/Button.vue").default,
+    },
+
     data() {
         return {
             form: new Form(
@@ -90,7 +99,11 @@ export default {
     methods: {
         async onSubmit() {
             try {
-                const res = await this.form.post("/reset-password");
+                await guestRequest({
+                    form: this.form,
+                    url: "/reset-password",
+                    store: this.$store,
+                });
 
                 this.$router.push({
                     name: "auth.success-reset",
@@ -108,7 +121,7 @@ export default {
                         query: { email: this.form.email },
                     });
                 }
-                this.$root.errors(e);
+                console.log(e);
             }
         },
 
@@ -122,12 +135,5 @@ export default {
             title: "Reset Password",
         };
     },
-
-    components: {
-        VPasswordValidation: require("./../components/VPasswordValidation.vue")
-            .default,
-        elInput: require("../../../components/form/basic.vue").default,
-        elButton: require("../../../components/basic/Button.vue").default,
-    },
 };
 </script>