@goweekdays/layer-common 1.4.6 → 1.5.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @goweekdays/layer-common
 
+## 1.5.0
+
+### Minor Changes
+
+- fab8c5c: Add promo code support and input components
+
 ## 1.4.6
 
 ### Patch Changes

package/components/Input/Currency.vue

@@ -0,0 +1,60 @@
+<template>
+  <v-text-field
+    type="text"
+    inputmode="numeric"
+    :model-value="display"
+    @update:model-value="onInput"
+    @blur="format"
+    @keydown="onKeydown"
+    v-bind="$attrs"
+  >
+    <!-- forward all slots -->
+    <template v-for="(_, name) in $slots" #[name]="slotProps">
+      <slot :name="name" v-bind="slotProps" />
+    </template>
+  </v-text-field>
+</template>
+
+<script setup lang="ts">
+/**
+ * numeric v-model
+ */
+
+const localProps = defineProps({
+  step: {
+    type: Number,
+    default: 1,
+  },
+});
+const model = defineModel<number>({ default: 0 });
+
+const display = ref<string>("");
+
+const parse = (v: string) => Number(v.replace(/[^0-9]/g, "") || 0);
+
+const format = () => {
+  display.value = model.value.toLocaleString("en-US");
+};
+
+function onInput(val: string) {
+  if (!/^[0-9,]*$/.test(val)) return;
+  model.value = parse(val);
+  display.value = val;
+}
+
+function onKeydown(e: KeyboardEvent) {
+  if (e.key === "ArrowUp") {
+    e.preventDefault();
+    model.value += localProps.step;
+    format();
+  }
+
+  if (e.key === "ArrowDown") {
+    e.preventDefault();
+    model.value = Math.max(0, model.value - localProps.step);
+    format();
+  }
+}
+
+watch(() => model.value, format, { immediate: true });
+</script>

package/components/Input/Infinity.vue

@@ -0,0 +1,112 @@
+<template>
+  <v-text-field
+    type="text"
+    inputmode="numeric"
+    :model-value="display"
+    @update:model-value="onInput"
+    @update:focused="doAutoCorrect"
+    @keydown="onKeydown"
+    v-bind="$attrs"
+  >
+    <!-- forward all slots -->
+    <template v-for="(_, name) in $slots" #[name]="slotProps">
+      <slot :name="name" v-bind="slotProps" />
+    </template>
+  </v-text-field>
+</template>
+
+<script setup lang="ts">
+/**
+ * Numeric input that displays ∞ when value is 0
+ */
+
+const localProps = defineProps({
+  step: {
+    type: Number,
+    default: 1,
+  },
+  minValue: {
+    type: Number,
+    default: 0,
+  },
+  autoCorrect: {
+    type: Boolean,
+    default: false,
+  },
+});
+
+const model = defineModel<number>({ default: 0 });
+
+const display = ref<string>("");
+
+const INFINITY_SYMBOL = "∞";
+
+const parse = (v: string) => {
+  if (v === INFINITY_SYMBOL || v === "") return 0;
+  return Number(v.replace(/[^0-9]/g, "") || 0);
+};
+
+const format = () => {
+  display.value =
+    model.value === 0 ? INFINITY_SYMBOL : model.value.toLocaleString("en-US");
+};
+
+function doAutoCorrect() {
+  if (!localProps.autoCorrect) return;
+
+  // Auto-correct if value is invalid (> 0 but <= minValue)
+  if (model.value > 0 && model.value <= localProps.minValue) {
+    model.value = localProps.minValue + 1;
+    format();
+  }
+}
+
+function onInput(val: string) {
+  // Allow infinity symbol, empty, or numeric input
+  if (val === INFINITY_SYMBOL || val === "") {
+    model.value = 0;
+    display.value = val;
+    return;
+  }
+
+  // If current display is infinity and user types a number, replace entirely
+  if (display.value === INFINITY_SYMBOL) {
+    const numericOnly = val.replace(/[^0-9]/g, "");
+    if (numericOnly) {
+      model.value = Number(numericOnly);
+      display.value = numericOnly;
+      return;
+    }
+  }
+
+  if (!/^[0-9,]*$/.test(val)) return;
+  model.value = parse(val);
+  display.value = val;
+}
+
+function onKeydown(e: KeyboardEvent) {
+  if (e.key === "Enter") {
+    doAutoCorrect();
+  }
+
+  if (e.key === "ArrowUp") {
+    e.preventDefault();
+    // If value is 0 (infinity), start from minValue + 1
+    if (model.value === 0) {
+      model.value = localProps.minValue + 1;
+    } else {
+      model.value += localProps.step;
+    }
+    format();
+  }
+
+  if (e.key === "ArrowDown") {
+    e.preventDefault();
+    // Don't go below 0
+    model.value = Math.max(0, model.value - localProps.step);
+    format();
+  }
+}
+
+watch(() => model.value, format, { immediate: true });
+</script>

package/components/Input/Slug.vue

@@ -0,0 +1,50 @@
+<template>
+  <v-text-field
+    type="text"
+    :model-value="display"
+    @update:model-value="onInput"
+    @blur="format"
+    @keydown="onKeydown"
+    v-bind="$attrs"
+  >
+    <!-- forward all slots -->
+    <template v-for="(_, name) in $slots" #[name]="slotProps">
+      <slot :name="name" v-bind="slotProps" />
+    </template>
+  </v-text-field>
+</template>
+
+<script setup lang="ts">
+/**
+ * Input that converts spaces to hyphens and forces lowercase, useful for slugs, codes, or identifiers
+ */
+
+const model = defineModel<string>({ default: "" });
+
+const display = ref<string>("");
+
+const transform = (v: string) => {
+  return v.replace(/\s+/g, "-").toLowerCase();
+};
+
+const format = () => {
+  display.value = transform(model.value);
+  model.value = display.value;
+};
+
+function onInput(val: string) {
+  const transformed = transform(val);
+  model.value = transformed;
+  display.value = transformed;
+}
+
+function onKeydown(e: KeyboardEvent) {
+  if (e.key === " ") {
+    e.preventDefault();
+    model.value = transform(display.value + "-");
+    display.value = model.value;
+  }
+}
+
+watch(() => model.value, format, { immediate: true });
+</script>

package/components/InvitationMain.vue

@@ -66,7 +66,6 @@
     <v-dialog v-model="dialogView" width="450" persistent>
       <MemberInvite
         title="Invite Details"
-        :app="props.app"
         v-model="invitation"
         @close="setInvite({ dialog: false })"
         @cancel:invite="handleOpenCancelInvite()"
@@ -141,6 +140,8 @@ const pageRange = ref("-- - -- of --");
 const items = ref<Array<Record<string, any>>>([]);
 const { headerSearch } = useLocal();
 
+const isOrg = computed(() => props.app === "org");
+
 const {
   data: getInviteReq,
   refresh: getInvitations,
@@ -154,6 +155,7 @@ const {
       status: props.status,
       type: "user-invite,member-invite",
       org: props.org,
+      app: isOrg.value ? "" : props.app,
     })
 );
 
@@ -179,9 +181,7 @@ function setInvite({
 } = {}) {
   Object.assign(invitation.value, JSON.parse(JSON.stringify(data)));
 
-  if (dialog) {
-    dialogView.value = dialog;
-  }
+  dialogView.value = dialog;
 }
 
 function tableRowClickHandler(_: any, data: any) {

package/components/MemberInvite.vue

@@ -26,6 +26,7 @@
                   item-value="code"
                   :rules="isMutable ? [requiredRule] : []"
                   :loading="loadingApps"
+                  :readonly="!isMutable"
                 ></v-select>
               </v-col>
             </v-row>
@@ -189,7 +190,9 @@ const invite = defineModel<TMemberInvitation>({
   default: () => useMember().invitation.value,
 });
 
-invite.value.app = localProps.app;
+if (localProps.mode === "add") {
+  invite.value.app = localProps.app;
+}
 
 const message = defineModel("message", { default: "" });
 

package/composables/useOrg.ts

@@ -54,6 +54,7 @@ export default function useOrg() {
     contact: "",
     email: "",
     createdBy: "",
+    promoCode: "",
   });
 
   return {

package/composables/usePromo.ts

@@ -0,0 +1,78 @@
+export default function usePromo() {
+  const promo = ref<TPromo>({
+    _id: "",
+    code: "",
+    type: "fixed",
+    flatRate: 0,
+    fixedRate: 0,
+    tiers: [],
+    currency: "",
+    startDate: "",
+    endDate: "",
+    seats: 0,
+    usage: 0,
+    apps: [],
+  });
+
+  function add(value: TPromo) {
+    return $fetch<Record<string, any>>("/api/promos", {
+      method: "POST",
+      body: value,
+    });
+  }
+
+  async function getAll({
+    page = 1,
+    limit = 10,
+    search = "",
+    status = "",
+  } = {}) {
+    return $fetch<Record<string, any>>("/api/promos", {
+      method: "GET",
+      query: { page, limit, search, status },
+    });
+  }
+
+  async function getByCode(code: string) {
+    return $fetch<Record<string, any>>(`/api/promos/code/${code}`, {
+      method: "GET",
+    });
+  }
+
+  async function getById(id: string) {
+    return $fetch<Record<string, any>>(`/api/promos/id/${id}`, {
+      method: "GET",
+    });
+  }
+
+  async function updateById(
+    id: string,
+    value: Pick<
+      TPromo,
+      | "code"
+      | "apps"
+      | "type"
+      | "flatRate"
+      | "fixedRate"
+      | "tiers"
+      | "currency"
+      | "startDate"
+      | "endDate"
+      | "seats"
+      | "usage"
+    >
+  ) {
+    return $fetch<Record<string, any>>(`/api/promos/id/${id}`, {
+      method: "PATCH",
+      body: value,
+    });
+  }
+
+  async function deleteById(id: string) {
+    return $fetch<Record<string, any>>(`/api/promos/${id}`, {
+      method: "DELETE",
+    });
+  }
+
+  return { promo, add, getAll, getByCode, getById, updateById, deleteById };
+}

package/composables/useSubscription.ts

@@ -42,8 +42,21 @@ export default function useSubscription() {
     });
   }
 
+  function getAll({ page = 1, limit = 20, search = "", status = "" } = {}) {
+    return $fetch<Record<string, any>>(`/api/subscriptions`, {
+      method: "GET",
+      query: {
+        page,
+        limit,
+        search,
+        status,
+      },
+    });
+  }
+
   return {
     subscription,
+    getAll,
     getByOrg,
     getTransactionsById,
     updateSeatById,

package/nuxt.config.ts

@@ -69,8 +69,8 @@ export default defineNuxtConfig({
     "/api/entities/**": { proxy: `${process.env.API_CORE}/api/entities/**` },
     "/api/workflows/**": { proxy: `${process.env.API_CORE}/api/workflows/**` },
     "/api/roles/**": { proxy: `${process.env.API_CORE}/api/roles/**` },
-    "/api/promo-codes/**": {
-      proxy: `${process.env.API_CORE}/api/promo-codes/**`,
+    "/api/promos/**": {
+      proxy: `${process.env.API_CORE}/api/promos/**`,
     },
     "/api/verifications/**": {
       proxy: `${process.env.API_CORE}/api/verifications/**`,

package/package.json

@@ -2,7 +2,7 @@
   "name": "@goweekdays/layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "1.4.6",
+  "version": "1.5.0",
   "main": "./nuxt.config.ts",
   "publishConfig": {
     "access": "public"

package/pages/member-suspended.vue

@@ -21,7 +21,7 @@
           rounded
           @click="navigateTo({ name: 'index' })"
         >
-          Return to Landing Page
+          Return
         </v-btn>
       </v-row>
     </v-col>

package/types/org.d.ts

@@ -5,6 +5,7 @@ declare type TOrg = {
   email?: string;
   contact?: string;
   createdBy: string;
+  promoCode?: string;
   status?: string;
   createdAt?: string;
   updatedAt?: string;

package/types/promo.d.ts

@@ -0,0 +1,22 @@
+declare type TPromo = {
+  _id?: string;
+  code: string;
+  type: "flat" | "fixed" | "volume";
+  flatRate?: number; // regardless of seats
+  fixedRate?: number; // per seat
+  tiers?: Array<{
+    minSeats: number;
+    maxSeats: number;
+    rate: number;
+  }>;
+  currency: string;
+  startDate?: Date | string;
+  endDate?: Date | string;
+  seats?: number;
+  usage?: number;
+  apps?: string[];
+  status?: "active" | "inactive" | "expired";
+  createdAt?: Date | string;
+  updatedAt?: Date | string;
+  deletedAt?: Date | string;
+};