@goweekdays/layer-common 1.3.1 → 1.3.3

package/pages/login.vue

@@ -0,0 +1,156 @@
+<template>
+  <v-row
+    no-gutters
+    class="fill-height pa-8"
+    justify="center"
+    align-content="center"
+  >
+    <v-col cols="12" lg="3" md="4" sm="6">
+      <v-form
+        v-model="isValid"
+        @submit.prevent="submit({ email, password })"
+        :disabled="loading"
+      >
+        <v-row no-gutters>
+          <v-col cols="12">
+            <v-row no-gutters justify="center">
+              <nuxt-link
+                class="text-h3 text-sm-h2 text-md-h2 text-lg-h2 text-xl-h2 font-weight-bold text-decoration-none"
+                style="color: unset"
+                :to="{ name: 'index' }"
+              >
+                GoWeekdays
+              </nuxt-link>
+            </v-row>
+          </v-col>
+
+          <v-col cols="12" class="mt-6">
+            <v-row no-gutters>
+              <v-col cols="12" class="text-h6 font-weight-bold"> Email </v-col>
+              <v-col cols="12">
+                <v-text-field
+                  v-model="email"
+                  :rules="[requiredRule, emailRule]"
+                ></v-text-field>
+              </v-col>
+            </v-row>
+          </v-col>
+
+          <v-col cols="12">
+            <v-row no-gutters>
+              <v-col cols="12" class="text-h6 font-weight-bold">
+                Password
+              </v-col>
+              <v-col cols="12">
+                <InputPassword v-model="password" :rules="[requiredRule]" />
+              </v-col>
+            </v-row>
+          </v-col>
+
+          <v-col v-if="message" cols="12" class="my-2 text-center font-italic">
+            {{ message }}
+          </v-col>
+
+          <v-col cols="12" class="mt-4">
+            <v-row no-gutters justify="center">
+              <v-btn
+                block
+                type="submit"
+                variant="tonal"
+                :disabled="!isValid"
+                rounded="xl"
+                size="large"
+                class="text-none"
+                :loading="loading"
+              >
+                Login
+              </v-btn>
+            </v-row>
+          </v-col>
+
+          <v-col cols="12" class="text-center font-weight-bold mt-4">
+            <nuxt-link
+              :to="{ name: 'forgot-password' }"
+              class="text-decoration-none text-primary"
+            >
+              Forgot password?
+            </nuxt-link>
+          </v-col>
+
+          <v-col cols="12" class="my-4">
+            <v-divider></v-divider>
+          </v-col>
+
+          <v-col cols="12">
+            <v-row no-gutters justify="center">
+              <v-btn
+                block
+                variant="flat"
+                color="black"
+                rounded="xl"
+                size="large"
+                class="text-none"
+                :to="{ name: 'sign-up' }"
+              >
+                Create new account
+              </v-btn>
+            </v-row>
+          </v-col>
+        </v-row>
+      </v-form>
+    </v-col>
+  </v-row>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  layout: "plain",
+});
+const { requiredRule, emailRule } = useUtils();
+const email = ref("");
+const password = ref("");
+const isValid = ref(false);
+
+const { login } = useLocalAuth();
+
+const message = ref("");
+
+const loading = ref(false);
+
+const { APP, cookieConfig } = useRuntimeConfig().public;
+
+const { getByApp } = useMember();
+
+async function submit({ email = "", password = "" } = {}) {
+  loading.value = true;
+  try {
+    await login({ email, password });
+
+    if (APP === "main") {
+      await navigateTo({ name: "feed" });
+      return;
+    }
+
+    if (APP === "admin") {
+      await navigateTo({ name: "home" });
+      return;
+    }
+
+    const userId = (useCookie("user", cookieConfig).value as string) ?? "";
+
+    const memberData = await getByApp({ app: APP, user: userId });
+
+    if (memberData && memberData.org) {
+      navigateTo({
+        name: "org-dashboard",
+        params: { org: memberData.org },
+      });
+      return;
+    }
+  } catch (error: any) {
+    message.value = error.response._data.message;
+  } finally {
+    loading.value = false;
+  }
+}
+</script>

package/pages/logout.vue

@@ -0,0 +1,18 @@
+<template>
+  <v-row no-gutters class="fill-height" justify="center" align-content="center">
+    <v-col cols="12" class="mt-2 text-center font-weight-bold">
+      You have been logged out.
+      <nuxt-link :to="{ name: 'login' }">Login</nuxt-link>
+    </v-col>
+  </v-row>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  layout: "plain",
+});
+
+const { logout } = useLocalAuth();
+
+logout();
+</script>

package/pages/member-suspended.vue

@@ -0,0 +1,44 @@
+<template>
+  <v-row no-gutters class="fill-height" justify="center" align-content="center">
+    <v-col cols="12" class="mb-4">
+      <v-row justify="center" class="pa-4">
+        <span class="text-h5 font-weight-medium"> Member Suspended </span>
+      </v-row>
+    </v-col>
+
+    <span class="text-subtitle-2">
+      Your membership has been suspended. Please contact your organization
+      administrator for more information.
+    </span>
+
+    <v-col cols="12" class="mt-6">
+      <v-row no-gutters justify="center">
+        <v-btn
+          size="large"
+          class="text-none"
+          variant="flat"
+          color="black"
+          rounded
+          @click="navigateTo({ name: 'index' })"
+        >
+          Return to Landing Page
+        </v-btn>
+      </v-row>
+    </v-col>
+  </v-row>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  layout: "plain",
+});
+
+function createOrg() {
+  const { APP, APP_ORG } = useRuntimeConfig().public;
+  if (APP === "organization") {
+    navigateTo({ name: "organizations-create" });
+  } else {
+    navigateTo(`${APP_ORG}/organizations/create`, { external: true });
+  }
+}
+</script>

package/pages/sign-up/[id].vue

@@ -0,0 +1,214 @@
+<template>
+  <v-row no-gutters class="fill-height" justify="center" align-content="center">
+    <v-col cols="12" class="mb-6">
+      <v-row no-gutters justify="center">
+        <nuxt-link
+          class="text-h2 font-weight-bold text-decoration-none"
+          style="color: unset"
+          :to="{ name: 'index' }"
+        >
+          GoWeekdays
+        </nuxt-link>
+      </v-row>
+    </v-col>
+
+    <v-col
+      v-if="validating"
+      cols="12"
+      class="text-subtitle-1 font-weight-medium text-center font-italic"
+    >
+      {{ message }}
+    </v-col>
+    <v-col v-else cols="12" lg="3" md="4" sm="6">
+      <v-row no-gutters>
+        <v-col v-if="validInvitation" cols="12">
+          <v-form
+            v-model="isValid"
+            @submit.prevent="
+              submit({ firstName, lastName, password, id, referralCode, type })
+            "
+            id="form1"
+            autocomplete="off"
+            :disabled="isFormDisabled"
+          >
+            <v-row no-gutters>
+              <v-col cols="12">
+                <v-row no-gutters>
+                  <InputLabel
+                    class="text-capitalize"
+                    title="First Name"
+                    required
+                  />
+                  <v-col cols="12">
+                    <v-text-field
+                      v-model="firstName"
+                      density="comfortable"
+                      :rules="[requiredRule]"
+                    ></v-text-field>
+                  </v-col>
+                </v-row>
+              </v-col>
+
+              <v-col cols="12" class="mt-2">
+                <v-row no-gutters>
+                  <InputLabel
+                    class="text-capitalize"
+                    title="Last Name"
+                    required
+                  />
+                  <v-col cols="12">
+                    <v-text-field
+                      v-model="lastName"
+                      density="comfortable"
+                      :rules="[requiredRule]"
+                    ></v-text-field>
+                  </v-col>
+                </v-row>
+              </v-col>
+
+              <v-col cols="12">
+                <v-row no-gutters>
+                  <InputLabel
+                    class="text-capitalize"
+                    title="Password"
+                    required
+                  />
+                  <v-col cols="12">
+                    <InputPassword v-model="password" :rules="[requiredRule]" />
+                  </v-col>
+                </v-row>
+              </v-col>
+
+              <v-col
+                v-if="message"
+                cols="12"
+                :class="'my-2 text-center font-italic' + msgColor"
+              >
+                {{ message }}
+              </v-col>
+
+              <v-col cols="12" v-if="!isFormDisabled">
+                <v-btn
+                  block
+                  type="submit"
+                  variant="text"
+                  :disabled="!isValid"
+                  rounded="xl"
+                  size="large"
+                  :loading="loading"
+                >
+                  submit
+                </v-btn>
+              </v-col>
+            </v-row>
+          </v-form>
+        </v-col>
+
+        <v-col
+          v-else
+          cols="12"
+          class="text-subtitle-1 font-weight-medium text-center font-italic"
+        >
+          <span>{{ message }}</span>
+          <v-row no-gutters justify="center">
+            <nuxt-link :to="{ name: 'index' }">Go to homepage</nuxt-link>
+          </v-row>
+        </v-col>
+      </v-row>
+    </v-col>
+  </v-row>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  layout: "plain",
+});
+const { verify } = useLocalAuth();
+
+const id = (useRoute().params.id as string) ?? "";
+
+const validating = ref(true);
+const validInvitation = ref(false);
+
+const message = ref("Validating invitation...");
+const msgColor = ref("text-error");
+
+const type = ref("");
+const referralCode = ref("");
+const loading = ref(false);
+
+async function validate() {
+  try {
+    const result = await verify(id);
+
+    if (result.type) {
+      type.value = result.type;
+    }
+
+    if (result.referralCode) {
+      referralCode.value = result.referralCode;
+    }
+
+    validInvitation.value = true;
+    message.value = "";
+  } catch (error: any) {
+    message.value = error.data.message;
+  }
+  validating.value = false;
+}
+
+await validate();
+
+const { requiredRule } = useUtils();
+const firstName = ref("");
+const lastName = ref("");
+const password = ref("");
+
+const isValid = ref(false);
+
+const { createUserByVerification } = useUser();
+
+const countdown = ref(5); // Countdown from 5 seconds
+const isFormDisabled = ref(false);
+
+async function submit({
+  firstName = "",
+  lastName = "",
+  password = "",
+  id = "",
+  type = "",
+  referralCode = "",
+} = {}) {
+  message.value = "";
+  loading.value = true;
+  try {
+    const res = await createUserByVerification({
+      firstName,
+      lastName,
+      password,
+      id,
+      type,
+      referralCode,
+    });
+
+    isFormDisabled.value = true;
+
+    msgColor.value = " text-none";
+
+    message.value = `${res.message} Redirecting in ${countdown.value} seconds...`;
+
+    // Start countdown
+    const interval = setInterval(() => {
+      countdown.value--;
+      message.value = `${res.message} Redirecting in ${countdown.value} seconds...`;
+      if (countdown.value <= 0) {
+        clearInterval(interval);
+        navigateTo({ name: "index" });
+      }
+    }, 1000);
+  } catch (error: any) {
+    message.value = error.data.message;
+  }
+  loading.value = false;
+}
+</script>

package/pages/sign-up/index.vue

@@ -0,0 +1,135 @@
+<template>
+  <v-row no-gutters class="fill-height" justify="center" align-content="center">
+    <v-col cols="12" lg="3" md="4" sm="6">
+      <v-form
+        v-model="valid"
+        @submit.prevent="submit(email)"
+        :disabled="loading"
+      >
+        <v-row no-gutters>
+          <v-col cols="12">
+            <v-row no-gutters justify="center">
+              <nuxt-link
+                class="text-h2 font-weight-bold text-decoration-none"
+                style="color: unset"
+                :to="{ name: 'index' }"
+              >
+                GoWeekdays
+              </nuxt-link>
+            </v-row>
+          </v-col>
+
+          <v-col cols="12" class="mt-6">
+            <v-row no-gutters>
+              <v-col cols="12" class="text-h6 font-weight-bold"> Email </v-col>
+              <v-col cols="12">
+                <v-text-field
+                  v-model="email"
+                  :rules="[requiredRule, emailRule]"
+                ></v-text-field>
+              </v-col>
+            </v-row>
+          </v-col>
+
+          <!-- Honeypot Field (Hidden) -->
+          <v-text-field
+            v-model="goWeekdaysHoneypot"
+            label="Leave this field empty"
+            class="goWeekdaysHoneypot"
+            autocomplete="off"
+          ></v-text-field>
+
+          <v-col cols="12">
+            <v-row no-gutters justify="center">
+              <v-col
+                cols="12"
+                class="text-subtitle-1 font-weight-medium text-center font-italic"
+              >
+                {{ message }}
+              </v-col>
+            </v-row>
+          </v-col>
+
+          <v-col cols="12" class="mt-4">
+            <v-btn
+              block
+              type="submit"
+              variant="tonal"
+              :disabled="!valid"
+              rounded="xl"
+              size="large"
+              class="text-none"
+              :loading="loading"
+            >
+              Sign up
+            </v-btn>
+          </v-col>
+
+          <v-col cols="12" class="my-4">
+            <v-divider></v-divider>
+          </v-col>
+
+          <v-col cols="12" class="text-center font-weight-bold">
+            <v-btn
+              block
+              variant="flat"
+              color="black"
+              rounded="xl"
+              size="large"
+              class="text-none"
+              :to="{ name: 'login' }"
+            >
+              Login
+            </v-btn>
+          </v-col>
+        </v-row>
+      </v-form>
+    </v-col>
+  </v-row>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  layout: "plain",
+});
+
+const { requiredRule, emailRule } = useUtils();
+const email = ref("");
+const valid = ref(false);
+
+const goWeekdaysHoneypot = ref("");
+
+const { signUp } = useVerification();
+
+const message = ref("");
+
+const loading = ref(false);
+
+async function submit(email = "") {
+  loading.value = true;
+  if (goWeekdaysHoneypot.value) {
+    console.warn("Bot detected! Form rejected.");
+    return;
+  }
+
+  try {
+    await signUp(email);
+    message.value = "Verification email sent! Please check your inbox.";
+  } catch (error: any) {
+    message.value = error.response._data.message;
+  } finally {
+    loading.value = false;
+  }
+}
+</script>
+
+<style scoped>
+.goWeekdaysHoneypot {
+  position: absolute;
+  left: -9999px;
+  opacity: 0;
+  height: 0;
+  width: 0;
+  pointer-events: none;
+}
+</style>

package/plugins/member.client.ts

@@ -13,18 +13,22 @@ export default defineNuxtPlugin(() => {
 
     const userId = useCookie("user").value ?? "";
 
-    if (!membership.value) {
-      try {
-        const member = await getByApp({ app: APP, user: userId, org });
-        membership.value = member;
+    try {
+      const member = await getByApp({ app: APP, user: userId, org });
+      membership.value = member;
 
-        const role = await getRoleById(member.role);
-        permissions.value = role.permissions ?? [];
-      } catch (error) {
+      const role = await getRoleById(member.role);
+      permissions.value = role.permissions ?? [];
+
+      if (member.status === "suspended") {
         navigateTo({
-          name: "index",
+          name: "member-suspended",
         });
       }
+    } catch (error) {
+      navigateTo({
+        name: "index",
+      });
     }
   });
 });

package/types/member.d.ts

@@ -5,6 +5,7 @@ declare type TMember = {
   name: string;
   user: string;
   role: string;
+  roleName?: string;
   status?: string;
   createdAt?: string;
   updatedAt?: string;
@@ -12,6 +13,7 @@ declare type TMember = {
 };
 
 declare type TMemberInvitation = {
+  _id?: string;
   email: string;
   app: string;
   org: string;

package/types/role.d.ts

@@ -2,7 +2,7 @@ declare type TRole = {
   _id?: string;
   name?: string;
   permissions?: Array<string>;
-  type?: string;
+  app: string;
   org?: string;
   description?: string;
   status?: string;