@goweekdays/layer-common 0.0.4 → 0.0.7

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @goweekdays/layer-common
 
+## 0.0.7
+
+### Patch Changes
+
+- 3b7164b: add promo code
+
+## 0.0.6
+
+### Patch Changes
+
+- 01873f7: Add error page
+
+## 0.0.5
+
+### Patch Changes
+
+- 0a6bba5: Enhance usePaymentMethod
+
 ## 0.0.4
 
 ### Patch Changes

package/components/Input/NewDate.vue

@@ -0,0 +1,123 @@
+<script setup lang="ts">
+import { defineModel, defineProps, computed, ref } from "vue";
+
+const props = defineProps<{
+  rules?: ((value: string) => boolean | string)[]; // Accepts external validation rules
+}>();
+
+const dateValue = defineModel<string>({ default: "" });
+const inputRef = ref<HTMLInputElement | null>(null);
+
+const formatDate = (event: Event) => {
+  const input = event.target as HTMLInputElement;
+  let value = input.value.replace(/\D/g, ""); // Remove non-numeric characters
+
+  // Format as MM/DD/YYYY
+  let formattedValue = value
+    .slice(0, 8)
+    .replace(/(\d{2})(\d{0,2})?(\d{0,4})?/, (_, m, d, y) =>
+      [m, d, y].filter(Boolean).join("/")
+    );
+
+  // Preserve cursor position
+  const cursorPosition = input.selectionStart ?? 0;
+  const slashCountBefore = (dateValue.value.match(/\//g) || []).length;
+  const slashCountAfter = (formattedValue.match(/\//g) || []).length;
+  const cursorOffset = slashCountAfter - slashCountBefore;
+
+  // Only update if value changed to prevent unnecessary reactivity updates
+  if (dateValue.value !== formattedValue) {
+    dateValue.value = formattedValue;
+    setTimeout(() => {
+      input.setSelectionRange(
+        cursorPosition + cursorOffset,
+        cursorPosition + cursorOffset
+      );
+    });
+  }
+};
+
+// Compute combined validation rules
+const computedRules = computed(() => {
+  return props.rules ? [...props.rules] : [];
+});
+
+// Handle arrow key increments with cursor preservation
+const handleArrowKeys = (event: KeyboardEvent) => {
+  if (!dateValue.value) return;
+
+  const input = event.target as HTMLInputElement;
+  const cursorPosition = input.selectionStart ?? 0; // Store cursor position
+  dateValue.value.split("/").map(Number);
+
+  let updatedDate = dateValue.value;
+
+  // Determine which part to modify
+  if (cursorPosition <= 2) {
+    updatedDate = modifyDatePart(
+      dateValue.value,
+      "month",
+      event.key === "ArrowUp" ? 1 : -1
+    );
+  } else if (cursorPosition <= 5) {
+    updatedDate = modifyDatePart(
+      dateValue.value,
+      "day",
+      event.key === "ArrowUp" ? 1 : -1
+    );
+  } else {
+    updatedDate = modifyDatePart(
+      dateValue.value,
+      "year",
+      event.key === "ArrowUp" ? 1 : -1
+    );
+  }
+
+  if (dateValue.value !== updatedDate) {
+    dateValue.value = updatedDate;
+    setTimeout(() => {
+      input.setSelectionRange(cursorPosition, cursorPosition);
+    });
+  }
+
+  event.preventDefault();
+};
+
+const modifyDatePart = (
+  date: string,
+  part: "month" | "day" | "year",
+  change: number
+) => {
+  let [month, day, year] = date.split("/").map(Number);
+
+  if (part === "month") {
+    month = Math.max(1, Math.min(12, month + change));
+    const maxDays = new Date(year, month, 0).getDate();
+    day = Math.min(day, maxDays); // Adjust day to fit new month's max days
+  } else if (part === "day") {
+    const maxDays = new Date(year, month, 0).getDate();
+    day = Math.max(1, Math.min(maxDays, day + change));
+  } else if (part === "year") {
+    year += change;
+    const maxDays = new Date(year, month, 0).getDate();
+    day = Math.min(day, maxDays); // Adjust day to fit new year's month
+  }
+
+  return `${String(month).padStart(2, "0")}/${String(day).padStart(
+    2,
+    "0"
+  )}/${year}`;
+};
+</script>
+
+<template>
+  <v-text-field
+    ref="inputRef"
+    v-model="dateValue"
+    placeholder="MM/DD/YYYY"
+    @input="formatDate"
+    @keydown.up="handleArrowKeys"
+    @keydown.down="handleArrowKeys"
+    :rules="computedRules"
+  ></v-text-field>
+</template>

package/components/Input/Number.vue

@@ -1,18 +1,29 @@
 <script setup lang="ts">
 import { ref, computed, nextTick, useAttrs } from "vue";
 
+const props = defineProps({
+  infinityEnabled: { type: Boolean, default: false }, // Enable ∞ display for 0
+});
+
 const modelValue = defineModel<number>(); // Store actual number
-const inputRef = ref<HTMLInputElement | null>(null); // Reference input field
-const attrs = useAttrs(); // Get all passed attributes (rules, required, etc.)
+const inputRef = ref<HTMLInputElement | null>(null);
+const attrs = useAttrs();
 
-let cursorPosition = 0; // Track cursor position
-let forceCursorToEnd = false; // Track if cursor should be forced to end
+let cursorPosition = 0;
+let forceCursorToEnd = false;
 
-// Computed property to format value with commas
+// Computed property to format value with commas or infinity sign
 const formattedValue = computed({
-  get: () =>
-    modelValue.value !== undefined ? modelValue.value.toLocaleString() : "",
+  get: () => {
+    if (props.infinityEnabled && modelValue.value === 0) return "∞"; // Show ∞ if enabled
+    return modelValue.value?.toLocaleString() ?? "";
+  },
   set: (val: string) => {
+    if (props.infinityEnabled && val === "∞") {
+      modelValue.value = 0; // Convert back to 0 internally
+      return;
+    }
+
     const rawValue = val.replace(/\D/g, ""); // Remove non-numeric characters
     const numericValue = rawValue ? Number(rawValue) : 0;
 
@@ -30,7 +41,6 @@ const handleKeyDown = (event: KeyboardEvent) => {
   const { selectionStart, selectionEnd, value } = inputRef.value;
   const isAllSelected = selectionStart === 0 && selectionEnd === value.length;
 
-  // Allow only numbers (prevent non-numeric input)
   if (
     !/^\d$/.test(event.key) &&
     ![
@@ -46,7 +56,6 @@ const handleKeyDown = (event: KeyboardEvent) => {
     return;
   }
 
-  // If all text is selected and a number is pressed, replace entire value
   if (isAllSelected && /^\d$/.test(event.key)) {
     event.preventDefault();
     modelValue.value = Number(event.key);
@@ -55,13 +64,11 @@ const handleKeyDown = (event: KeyboardEvent) => {
     return;
   }
 
-  // Allow cursor movement with ArrowLeft & ArrowRight
   if (event.key === "ArrowLeft" || event.key === "ArrowRight") {
     forceCursorToEnd = false;
     return;
   }
 
-  // Force cursor to end when incrementing/decrementing
   if (event.key === "ArrowUp") {
     event.preventDefault();
     modelValue.value += 1;
@@ -71,21 +78,21 @@ const handleKeyDown = (event: KeyboardEvent) => {
     modelValue.value = Math.max(0, modelValue.value - 1);
     forceCursorToEnd = true;
   } else {
-    cursorPosition = selectionStart || 0; // Store cursor position before input
+    cursorPosition = selectionStart || 0;
   }
 
   nextTick(() => restoreCursor());
 };
 
-// Restore cursor position correctly
+// Restore cursor position
 const restoreCursor = () => {
   if (!inputRef.value) return;
   const length = formattedValue.value.length;
 
   if (forceCursorToEnd) {
-    inputRef.value.setSelectionRange(length, length); // Keep cursor at end
+    inputRef.value.setSelectionRange(length, length);
   } else {
-    inputRef.value.setSelectionRange(cursorPosition, cursorPosition); // Keep normal position
+    inputRef.value.setSelectionRange(cursorPosition, cursorPosition);
   }
 };
 </script>
@@ -96,7 +103,22 @@ const restoreCursor = () => {
     v-model="formattedValue"
     v-bind="attrs"
     type="text"
-    placeholder="Enter a number"
     @keydown="handleKeyDown"
-  ></v-text-field>
+  >
+    <template v-if="$slots.prepend" v-slot:prepend>
+      <slot name="prepend"></slot>
+    </template>
+
+    <template v-if="$slots.append" v-slot:append>
+      <slot name="append"></slot>
+    </template>
+
+    <template v-if="$slots['append-inner']" v-slot:append-inner>
+      <slot name="append-inner"></slot>
+    </template>
+
+    <template v-if="$slots['prepend-inner']" v-slot:prepend-inner>
+      <slot name="prepend-inner"></slot>
+    </template>
+  </v-text-field>
 </template>

package/components/Layout/Header.vue

@@ -112,7 +112,9 @@
                 height="42"
               ></v-img>
 
-              <span v-else class="text-h5">{{ getNameInitials(name) }}</span>
+              <span v-else class="text-subtitle-1">{{
+                getNameInitials(name)
+              }}</span>
             </v-avatar>
           </v-btn>
         </template>

package/components/SwitchOrg.vue

@@ -12,7 +12,7 @@
     >
       <template #activator="{ props }">
         <v-btn variant="text" class="text-none ml-2" v-bind="props">
-          <div class="d-block text-truncate" style="max-width: 130px">
+          <div class="d-block text-truncate" style="width: 130px">
             {{ selectedOrg?.text || "Select organization" }}
           </div>
           <v-icon class="ml-1">mdi-menu-down</v-icon>

package/composables/useOrder.ts

@@ -0,0 +1,22 @@
+export default function useOrder() {
+  function getOrders({
+    search = "",
+    id = "",
+    page = 1,
+    status = "succeeded",
+  } = {}) {
+    return useNuxtApp().$api<Record<string, any>>("/api/orders", {
+      method: "GET",
+      query: {
+        search,
+        id,
+        page,
+        status,
+      },
+    });
+  }
+
+  return {
+    getOrders,
+  };
+}

package/composables/usePaymentMethod.ts

@@ -7,7 +7,7 @@ export default function usePaymentMethod() {
     success_return_url = "",
     failure_return_url = "",
     cancel_return_url = "",
-    subscriptionData = {},
+    category = "individual",
   } = {}) {
     return useNuxtApp().$api<Record<string, any>>(
       "/api/payment-methods/e-wallet",
@@ -21,7 +21,7 @@ export default function usePaymentMethod() {
           success_return_url,
           failure_return_url,
           cancel_return_url,
-          subscriptionData,
+          category,
         },
       }
     );
@@ -81,6 +81,14 @@ export default function usePaymentMethod() {
   const cardholderName = useState("cardholderName", () => "");
   const selectedPaymentMethod = useState("selectedPaymentMethod", () => "");
 
+  function reset() {
+    eWalletNumber.value = "";
+    cardNumber.value = "";
+    cardExpiration.value = "";
+    cardSecurityCode.value = "";
+    cardholderName.value = "";
+  }
+
   return {
     linkEWallet,
     linkCard,
@@ -92,5 +100,6 @@ export default function usePaymentMethod() {
     cardSecurityCode,
     cardholderName,
     selectedPaymentMethod,
+    reset,
   };
 }

package/composables/usePromoCode.ts

@@ -0,0 +1,34 @@
+export default function usePromoCode() {
+  function add(value: TPromoCode) {
+    return useNuxtApp().$api<Record<string, any>>("/api/promo-codes", {
+      method: "POST",
+      body: value,
+    });
+  }
+
+  function getPromoCodes({ search = "", page = 1, status = "active" } = {}) {
+    return useNuxtApp().$api<Record<string, any>>("/api/promo-codes", {
+      method: "GET",
+      query: {
+        search,
+        page,
+        status,
+      },
+    });
+  }
+
+  function getByCode(code: string) {
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/promo-codes/code/${code}`,
+      {
+        method: "GET",
+      }
+    );
+  }
+
+  return {
+    add,
+    getPromoCodes,
+    getByCode,
+  };
+}

package/composables/useSubscription.ts

@@ -13,6 +13,18 @@ export default function useSubscription() {
     return useNuxtApp().$api<TSubscription>(`/api/subscriptions/id/${id}`);
   }
 
+  function getByAffiliateId(id: string) {
+    return useNuxtApp().$api<TSubscription>(
+      `/api/subscriptions/affiliate/${id}`
+    );
+  }
+
+  function getByOrgId(id: string) {
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/subscriptions/org/${id}`
+    );
+  }
+
   function getSubscriptions() {
     return useNuxtApp().$api("/api/subscriptions");
   }
@@ -34,61 +46,84 @@ export default function useSubscription() {
     () => "inactive"
   );
 
-  async function checkSubscription() {
+  async function affSubscriptionStatus() {
     const { currentUser } = useLocalAuth();
 
     if (currentUser.value && currentUser.value._id) {
       try {
-        const result = await getSubscriptionStatusById(currentUser.value._id);
-        affiliateSubscription.value = result.status;
+        const result = await getByAffiliateId(currentUser.value._id);
+        affiliateSubscription.value = result.status as string;
       } catch (error) {
         console.error("failed to get the subscription", error);
       }
     }
   }
 
-  function initAffiliateSubscription(
-    customer_id: string,
-    amount: number,
-    payment_method_id: string,
-    currency?: string
-  ) {
-    return useNuxtApp().$api("/api/subscriptions/affiliate", {
-      method: "POST",
-      body: {
-        customer_id,
-        amount,
-        payment_method_id,
-        currency,
-      },
-    });
+  const orgSubscription = useState("orgSubscription", () => "inactive");
+
+  async function orgSubscriptionStatus() {
+    const { currentOrg } = useOrg();
+
+    if (currentOrg.value) {
+      try {
+        const result = await getByOrgId(currentOrg.value);
+        orgSubscription.value = result.status as string;
+      } catch (error) {
+        console.error("failed to get the subscription", error);
+      }
+    }
   }
 
-  type TOrgSubscription = {
+  type TSub = {
     customer_id: string;
     amount: number;
     payment_method_id: string;
+    payment_method_type: string;
+    payment_method_channel: string;
+    payment_method_number: string;
+    payment_method_expiry_month?: string;
+    payment_method_expiry_year?: string;
+    payment_method_cvv?: string;
+    payment_method_cardholder_name?: string;
     currency?: string;
-    organization: TOrg;
+    seats?: number;
+    organization?: TOrg;
     billingAddress: TAddress;
   };
 
-  function initOrgSubscription(value: TOrgSubscription) {
-    return useNuxtApp().$api("/api/subscriptions/organization", {
-      method: "POST",
-      body: value,
-    });
+  function initOrgSubscription(value: TSub) {
+    return useNuxtApp().$api<Record<string, any>>(
+      "/api/subscriptions/organization",
+      {
+        method: "POST",
+        body: value,
+      }
+    );
+  }
+
+  function initAffiliateSubscription(value: TSub) {
+    return useNuxtApp().$api<Record<string, any>>(
+      "/api/subscriptions/affiliate",
+      {
+        method: "POST",
+        body: value,
+      }
+    );
   }
 
   return {
     add,
     getById,
+    getByOrgId,
     getSubscriptions,
+    affSubscriptionStatus,
     affiliateSubscription,
-    checkSubscription,
+    orgSubscriptionStatus,
+    orgSubscription,
     getSubscriptionStatusById,
     cancelSubscription,
     initAffiliateSubscription,
     initOrgSubscription,
+    getByAffiliateId,
   };
 }

package/composables/useUtils.ts

@@ -6,6 +6,31 @@ export default function useUtils() {
     return regex.test(v) || "Please enter a valid email address";
   };
 
+  const validateDate = (value: string): boolean | string => {
+    const dateRegex = /^(0[1-9]|1[0-2])\/(0[1-9]|[12][0-9]|3[01])\/\d{4}$/;
+
+    if (!dateRegex.test(value)) return "Invalid date format (MM/DD/YYYY)";
+
+    return true;
+  };
+
+  const minOneMonthAdvance = (value: string): boolean | string => {
+    if (!/^(0[1-9]|1[0-2])\/(0[1-9]|[12][0-9]|3[01])\/\d{4}$/.test(value)) {
+      return "Invalid date format (MM/DD/YYYY)";
+    }
+
+    const [month, day, year] = value.split("/").map(Number);
+    const selectedDate = new Date(year, month - 1, day);
+
+    const currentDate = new Date();
+    const minDate = new Date();
+    minDate.setMonth(currentDate.getMonth() + 1); // 1 month in advance
+
+    return (
+      selectedDate >= minDate || "Date must be at least 1 month in advance"
+    );
+  };
+
   const passwordRule = (v: string) =>
     v.length >= 8 || "Password must be at least 8 characters long";
 
@@ -131,6 +156,39 @@ export default function useUtils() {
     maximumFractionDigits: 2,
   });
 
+  function formatNumber(
+    amount: number,
+    options: {
+      currency?: string;
+      locale?: string;
+      useSymbol?: boolean;
+      decimalPlaces?: number;
+    } = {}
+  ): string {
+    const {
+      currency,
+      locale = "en-US",
+      useSymbol = false,
+      decimalPlaces = 2,
+    } = options;
+
+    return new Intl.NumberFormat(locale, {
+      style: useSymbol && currency ? "currency" : "decimal",
+      currency: currency || "USD", // Default currency (ignored if `useSymbol` is false)
+      minimumFractionDigits: decimalPlaces,
+      maximumFractionDigits: decimalPlaces,
+    }).format(amount);
+  }
+
+  // 🔹 Examples:
+  // console.log(formatNumber(1234.56)); // "1,234.56" (comma separator, 2 decimals)
+  // console.log(formatNumber(1234.56, { decimalPlaces: 0 })); // "1,234" (no decimals)
+  // console.log(formatNumber(1234.56, { useSymbol: true, currency: "USD" })); // "$1,234.56"
+  // console.log(formatNumber(1234.56, { useSymbol: true, currency: "PHP", decimalPlaces: 0 })); // "₱1,234"
+  // console.log(formatNumber(1234.56, { useSymbol: false, decimalPlaces: 0 })); // "1,234"
+  // console.log(formatNumber(1234.56, { useSymbol: true, currency: "EUR", locale: "de-DE" })); // "1.234,56 €"
+  // console.log(formatNumber(1234.56, { useSymbol: true, currency: "EUR", locale: "de-DE", decimalPlaces: 0 })); // "1.234 €"
+
   return {
     requiredRule,
     emailRule,
@@ -146,5 +204,8 @@ export default function useUtils() {
     validateWord,
     getCountries,
     formatter,
+    formatNumber,
+    validateDate,
+    minOneMonthAdvance,
   };
 }

package/error.vue

@@ -0,0 +1,41 @@
+<script setup lang="ts">
+import type { NuxtError } from "#app";
+
+const props = defineProps({
+  error: Object as () => NuxtError,
+});
+</script>
+
+<template>
+  <v-app>
+    <v-main>
+      <v-row
+        class="fill-height"
+        no-gutters
+        justify="center"
+        align-content="center"
+      >
+        <v-col cols="9">
+          <v-row>
+            <v-col cols="12" class="text-center text-h2">
+              <span class="font-weight-bold">{{ props.error?.message }}</span>
+            </v-col>
+            <v-col cols="12">
+              <v-row no-gutters justify="center">
+                <v-btn
+                  rounded="xl"
+                  size="large"
+                  class="text-none"
+                  variant="tonal"
+                  :to="{ name: 'index' }"
+                >
+                  Go to home page
+                </v-btn>
+              </v-row>
+            </v-col>
+          </v-row>
+        </v-col>
+      </v-row>
+    </v-main>
+  </v-app>
+</template>

package/layouts/plain.vue

@@ -0,0 +1,7 @@
+<template>
+    <v-app>
+        <v-main>
+            <slot />
+        </v-main>
+    </v-app>
+</template>

package/middleware/auth.ts

@@ -0,0 +1,25 @@
+export default defineNuxtRouteMiddleware(async () => {
+  // Ensure middleware runs only on the client side
+  if (import.meta.server) return;
+
+  const { cookieConfig } = useRuntimeConfig().public;
+
+  // Get access token from cookies
+  const accessToken = useCookie("accessToken", cookieConfig).value;
+
+  if (!accessToken) {
+    // Redirect to login page if no access token
+    return navigateTo({ name: "index" });
+  }
+
+  const { getCurrentUser } = useLocalAuth();
+
+  try {
+    await getCurrentUser();
+  } catch (error) {
+    console.log(error);
+
+    // Redirect to login page if user authentication fails
+    return navigateTo({ name: "index" });
+  }
+});

package/middleware/org.ts

@@ -0,0 +1,16 @@
+import { z } from "zod";
+
+const hexSchema = z
+  .string()
+  .regex(/^[0-9a-fA-F]{24}$/, "Invalid organization ID");
+
+export default defineNuxtRouteMiddleware((to) => {
+  const { organization } = to.params;
+
+  if (organization && !hexSchema.safeParse(organization).success) {
+    return navigateTo(
+      { name: "require-organization-membership" },
+      { replace: true }
+    );
+  }
+});

package/package.json

@@ -2,7 +2,7 @@
   "name": "@goweekdays/layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "0.0.4",
+  "version": "0.0.7",
   "main": "./nuxt.config.ts",
   "publishConfig": {
     "access": "public"
@@ -28,6 +28,7 @@
   "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e",
   "dependencies": {
     "@mdi/font": "^7.4.47",
-    "sass": "^1.80.6"
+    "sass": "^1.80.6",
+    "zod": "^3.24.2"
   }
 }

package/pages/index.vue

@@ -0,0 +1,3 @@
+<template>
+  <h1>index</h1>
+</template>

package/pages/payment-method-linked.vue

@@ -0,0 +1,31 @@
+<template>
+  <v-row no-gutters class="fill-height" justify="center" align-content="center">
+    <v-card class="pa-4" elevation="4" color="success lighten-1">
+      <v-card-title class="text-white d-flex align-center">
+        <v-icon class="mr-2">mdi-check-circle</v-icon>
+        Successfully Linked Payment Method
+      </v-card-title>
+
+      <v-card-actions class="d-flex justify-center">
+        <v-btn
+          color="white"
+          variant="tonal"
+          rounded="xl"
+          size="large"
+          @click="closeWindow"
+          >Close</v-btn
+        >
+      </v-card-actions>
+    </v-card>
+  </v-row>
+</template>
+
+<script setup>
+definePageMeta({
+  layout: "plain",
+});
+
+const closeWindow = () => {
+  window.close();
+};
+</script>

package/pages/require-organization-membership.vue

@@ -0,0 +1,47 @@
+<template>
+  <v-row no-gutters class="fill-height" align="center" justify="center">
+    <v-col cols="12" lg="6" md="6" sm="6" class="text-center text-subtitle-1">
+      You must be a member of an organization to view this page. Please join or
+      contact your administrator for access.
+      <v-row no-gutters justify="center" align="center" class="mt-2">
+        <v-btn
+          @click="goToAccount"
+          rounded="xl"
+          variant="tonal"
+          class="text-none text-subtitle-2"
+        >
+          Go to Account Page
+        </v-btn>
+        <span class="mx-2">or</span>
+        <v-btn
+          @click="createOrg"
+          rounded="xl"
+          variant="tonal"
+          class="text-none text-subtitle-2"
+        >
+          Create an Organization
+        </v-btn>
+      </v-row>
+    </v-col>
+  </v-row>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  layout: "plain",
+});
+
+const { APP_ACCOUNT, APP_NAME, APP_ORG } = useRuntimeConfig().public;
+
+function goToAccount() {
+  window.location.href = `${APP_ACCOUNT}/home`;
+}
+
+function createOrg() {
+  if (APP_NAME.toLowerCase() === "org") {
+    navigateTo({ name: "organizations-create" });
+  } else {
+    window.location.href = `${APP_ORG}/organizations/create`;
+  }
+}
+</script>

package/pages/unauthorized.vue

@@ -0,0 +1,29 @@
+<template>
+  <v-row no-gutters class="fill-height" align="center" justify="center">
+    <v-col cols="12" lg="6" md="6" sm="6" class="text-center text-subtitle-1">
+      You must be a member of an organization to view this page. Please join or
+      contact your administrator for access.
+      <v-row no-gutters justify="center" class="mt-2">
+        <v-btn
+          @click="goToAccount"
+          rounded="xl"
+          variant="tonal"
+          class="text-none text-subtitle-2"
+        >
+          Go to Account Page
+        </v-btn>
+      </v-row>
+    </v-col>
+  </v-row>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  layout: "plain",
+});
+
+function goToAccount() {
+  const { APP_ACCOUNT } = useRuntimeConfig().public;
+  window.location.href = `${APP_ACCOUNT}/home`;
+}
+</script>

package/types/promo-code.d.ts

@@ -0,0 +1,19 @@
+declare type TPromoTier = {
+  min: number;
+  max: number;
+  price: number;
+};
+
+declare type TPromoCode = {
+  _id?: ObjectId;
+  code: string;
+  description?: string;
+  type: "tiered" | "fixed";
+  tiers?: TPromoTier[];
+  fixed_rate?: number;
+  appliesTo?: string; // "subscription" | "order"
+  createdAt?: string; // Date of creation
+  expiresAt?: string; // Optional expiry
+  assignedTo?: string | ObjectId; // Store the only ape who used it
+  status?: "active" | "expired" | "disabled";
+};