@iservice365/layer-common 0.0.1

package/composables/useOrg.ts

@@ -0,0 +1,127 @@
+import useUtils from "./useUtils";
+
+export default function useOrg() {
+  const org = useState("organization", (): TOrg => {
+    return {
+      _id: "",
+      name: "",
+      email: "",
+      busInst: "",
+      owner: "",
+      type: "",
+      createdAt: "",
+      updatedAt: "",
+      status: "",
+      deletedAt: "",
+    };
+  });
+
+  function setOrg(value?: Partial<TOrg>) {
+    if (!value) {
+      value = {
+        _id: "",
+        name: "",
+        email: "",
+        busInst: "",
+        owner: "",
+        type: "",
+        createdAt: "",
+        updatedAt: "",
+        status: "",
+        deletedAt: "",
+      };
+    }
+
+    org.value._id = value._id;
+    org.value.name = value.name ?? "";
+    org.value.email = value.email ?? "";
+    org.value.busInst = value.busInst ?? "";
+    org.value.owner = value.owner ?? "";
+    org.value.type = value.type ?? "";
+    org.value.createdAt = value.createdAt;
+    org.value.updatedAt = value.updatedAt;
+    org.value.status = value.status ?? "";
+    org.value.deletedAt = value.deletedAt ?? "";
+  }
+
+  function createOrg(value: Partial<TOrg>) {
+    delete value.createdAt;
+    delete value.updatedAt;
+    delete value._id;
+    delete value.status;
+
+    return useNuxtApp().$api("/api/orgs", {
+      method: "POST",
+      body: JSON.stringify(value),
+    });
+  }
+
+  function getOrgs({ search = "", page = 1 } = {}) {
+    return useNuxtApp().$api<TKeyValuePair>("/api/orgs", {
+      method: "GET",
+      query: { search, page },
+    });
+  }
+
+  function updateOrgField(_id = "", field = "", value = "") {
+    return useNuxtApp().$api<TKeyValuePair>(`/api/orgs/field/${_id}`, {
+      method: "PATCH",
+      body: { field, value },
+    });
+  }
+
+  const page = useState("orgPage", () => 1);
+  const pages = useState("orgPages", () => 0);
+  const pageRange = useState("orgPageRange", () => "0-0 of 0");
+
+  function getOrgById(id = "") {
+    return useNuxtApp().$api<TOrg>(`/api/orgs/id/${id}`, {
+      method: "GET",
+    });
+  }
+
+  const selectedOrg = useState("selectedOrg", () => "");
+
+  const myOrgs = useState("myOrgs", (): Array<TOrgsAsOption> => []);
+
+  const { debounce } = useUtils();
+
+  const getOrgsByUser = debounce(async (user = "") => {
+    try {
+      const res = await useNuxtApp().$api<Array<TOrgsAsOption>>(
+        `/api/orgs/user/${user}`,
+        {
+          method: "GET",
+        }
+      );
+      myOrgs.value = res;
+    } catch (error) {
+      throw error;
+    }
+  }, 1000);
+
+  const theOrg = computed(() => {
+    return myOrgs.value.find((i) => i.value === selectedOrg.value);
+  });
+
+  const otherOrgs = computed(() => {
+    return myOrgs.value.filter((i) => i.value !== selectedOrg.value);
+  });
+
+  return {
+    org,
+    setOrg,
+    createOrg,
+    getOrgs,
+    page,
+    pages,
+    pageRange,
+    getOrgById,
+    selectedOrg,
+    myOrgs,
+    getOrgsByUser,
+    theOrg,
+    otherOrgs,
+    updateOrgField,
+  };
+}

package/composables/usePermission.ts

@@ -0,0 +1,54 @@
+export default function usePermission() {
+  // Permission-Based Access Control with Dynamic Role Creation
+
+  // Utility to list all resources and their actions
+  function listPermissions(permissions: TPermissions): {
+    resource: string;
+    actions: { title: string; description: string }[];
+  }[] {
+    return Object.entries(permissions).map(([resource, actions]) => ({
+      resource,
+      actions: Object.entries(actions).map(([action, { description }]) => ({
+        title: action,
+        description,
+      })),
+    }));
+  }
+
+  // Utility to check if a user has permission
+  function hasPermission(
+    user: TRole,
+    permissions: TPermissions,
+    resource: string,
+    action: string,
+    data?: any
+  ): boolean {
+    const permissionKey = `${resource}:${action}`;
+
+    // Check if the permission exists in the user's permission array
+    if (!user.permissions?.includes(permissionKey)) {
+      return false;
+    }
+
+    const resourcePermissions = permissions[resource];
+    if (!resourcePermissions || !resourcePermissions[action]) {
+      return false;
+    }
+
+    const permissionCheck = resourcePermissions[action].check;
+
+    // Evaluate the permission check
+    if (typeof permissionCheck === "boolean") {
+      return permissionCheck;
+    } else if (typeof permissionCheck === "function") {
+      return permissionCheck(user, data);
+    }
+
+    return false;
+  }
+
+  return {
+    listPermissions,
+    hasPermission,
+  };
+}

package/composables/useRecapPermission.ts

@@ -0,0 +1,26 @@
+export default function useRecapPermission() {
+  const permissions: TPermissions = {
+    request: {
+      "create-request": {
+        check: true,
+        description: "Create a new request.",
+      },
+      "review-request": {
+        check: true,
+        description: "Review a request.",
+      },
+      "approve-request": {
+        check: true,
+        description: "Approve a request.",
+      },
+      "delete-request": {
+        check: true,
+        description: "Delete authored request.",
+      },
+    },
+  };
+
+  return {
+    permissions,
+  };
+}

package/composables/useRole.ts

@@ -0,0 +1,73 @@
+export default function useRole() {
+  function createRole(
+    { name, permissions, type } = {} as {
+      name: string;
+      permissions: Array<string>;
+      type: string;
+    }
+  ) {
+    return useNuxtApp().$api("/api/roles", {
+      method: "POST",
+      body: { name, permissions, type },
+    });
+  }
+
+  function getRoles({ search = "", page = 1, limit = 20, type = "" } = {}) {
+    return useNuxtApp().$api<TKeyValuePair>("/api/roles", {
+      method: "GET",
+      query: { search, page, limit, type },
+    });
+  }
+
+  function getRoleById(id: string) {
+    return useNuxtApp().$api<TKeyValuePair>(`/api/roles/id/${id}`, {
+      method: "GET",
+    });
+  }
+
+  function updateRoleById(
+    _id: string,
+    name?: string,
+    permissions?: Array<string>
+  ) {
+    return useNuxtApp().$api(`/api/roles/id/${_id}`, {
+      method: "PATCH",
+      body: { name, permissions },
+    });
+  }
+
+  function updateRoleFieldById(_id: string, field: string, value: string) {
+    return useNuxtApp().$api(`/api/roles/${_id}`, {
+      method: "PATCH",
+      body: { field, value },
+    });
+  }
+
+  function deleteRole(_id: string) {
+    return useNuxtApp().$api(`/api/roles/${_id}`, {
+      method: "DELETE",
+    });
+  }
+
+  const role = useState<TRole>("userRole", () => {
+    return {
+      _id: "",
+      name: "",
+      permissions: [],
+      description: "",
+      createdAt: "",
+      updatedAt: "",
+      deletedAt: "",
+    };
+  });
+
+  return {
+    role,
+    createRole,
+    getRoles,
+    getRoleById,
+    updateRoleById,
+    updateRoleFieldById,
+    deleteRole,
+  };
+}

package/composables/useUser.ts

@@ -0,0 +1,93 @@
+export default function useUser() {
+  function inviteUser({ email = "", app = "", role = "", name = "" } = {}) {
+    return useNuxtApp().$api<TKeyValuePair>("/api/auth/invite", {
+      method: "POST",
+      body: { email, app, role, name },
+    });
+  }
+
+  function updateName({ firstName = "", lastName = "" } = {}) {
+    return useNuxtApp().$api<TKeyValuePair>("/api/users/name", {
+      method: "PUT",
+      body: { firstName, lastName },
+    });
+  }
+
+  function updateBirthday({ month = "", day = 0, year = 0 } = {}) {
+    return useNuxtApp().$api<TKeyValuePair>("/api/users/birthday", {
+      method: "PUT",
+      body: { month, day, year },
+    });
+  }
+
+  function updateGender(gender = "") {
+    return useNuxtApp().$api<TKeyValuePair>("/api/users/gender", {
+      method: "PUT",
+      body: { gender },
+    });
+  }
+
+  function updateEmail(email = "") {
+    return useNuxtApp().$api<TKeyValuePair>("/api/users/email", {
+      method: "PUT",
+      body: { email },
+    });
+  }
+
+  function updateContact(contact = "") {
+    return useNuxtApp().$api<TKeyValuePair>("/api/users/contact", {
+      method: "PUT",
+      body: { contact },
+    });
+  }
+
+  function updateUserFieldById(id = "", field = "", value = "") {
+    return useNuxtApp().$api<TKeyValuePair>(`/api/users/field/${id}`, {
+      method: "PATCH",
+      body: { field, value },
+    });
+  }
+
+  function getUsers({
+    status = "active",
+    type = "",
+    search = "",
+    page = 1,
+  } = {}) {
+    return useNuxtApp().$api<TKeyValuePair>("/api/users", {
+      method: "GET",
+      query: { status, search, page, type },
+    });
+  }
+
+  function getById(id = "") {
+    return useNuxtApp().$api<TKeyValuePair>(`/api/users/id/${id}`, {
+      method: "GET",
+    });
+  }
+
+  function createUserByInvite({
+    firstName = "",
+    lastName = "",
+    password = "",
+    id = "",
+  } = {}) {
+    return useNuxtApp().$api<TKeyValuePair>(`/api/users/invite/${id}`, {
+      method: "POST",
+      body: { firstName, lastName, password },
+    });
+  }
+
+  return {
+    inviteUser,
+    updateName,
+    updateBirthday,
+    updateGender,
+    updateEmail,
+    updateContact,
+    updateUserFieldById,
+    getUsers,
+    createUserByInvite,
+    getById,
+  };
+}

package/composables/useUtils.ts

@@ -0,0 +1,109 @@
+export default function useUtils() {
+  const requiredRule = (v: string) => !!v || "Required";
+
+  const emailRule = (v: string): true | string => {
+    const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+    return regex.test(v) || "Please enter a valid email address";
+  };
+
+  const passwordRule = (v: string) =>
+    v.length >= 8 || "Password must be at least 8 characters long";
+
+  const confirmPasswordRule =
+    (newPassword: Ref<string>, confirmPassword: Ref<string>) => () =>
+      confirmPassword.value === newPassword.value || "Passwords must match";
+
+  const validateEmail = (email: Ref<string>, emailErrors: Ref<string[]>) => {
+    emailErrors.value = [];
+
+    if (!email.value) {
+      emailErrors.value.push("Please input your email");
+    } else {
+      const result = emailRule(email.value);
+      if (result !== true) {
+        emailErrors.value.push(result);
+      }
+    }
+  };
+
+  const validatePassword = (
+    password: Ref<string>,
+    passwordErrors: Ref<string[]>
+  ) => {
+    passwordErrors.value = [];
+
+    if (!password.value) {
+      passwordErrors.value.push("Please input your password");
+    } else if (!passwordRule(password.value)) {
+      passwordErrors.value.push("Password must be at least 8 characters long");
+    }
+  };
+
+  function back() {
+    useRouter().back();
+  }
+
+  function debounce<T extends (...args: any[]) => void>(
+    func: T,
+    wait: number
+  ): (...args: Parameters<T>) => void {
+    let timeoutId: ReturnType<typeof setTimeout>;
+
+    return function (...args: Parameters<T>) {
+      clearTimeout(timeoutId);
+      timeoutId = setTimeout(() => func(...args), wait);
+    };
+  }
+
+  function insertBetween(arr: any, elementToInsert: any) {
+    return arr.flatMap((item: any, index: number, array: any) =>
+      index < array.length - 1 ? [item, elementToInsert] : [item]
+    );
+  }
+
+  function getNameInitials(name: string) {
+    if (typeof name !== "string" || name.trim() === "") {
+      return ""; // Default fallback for invalid input
+    }
+
+    const initials = name
+      .trim()
+      .split(/\s+/) // Split by spaces
+      .map((word) => word[0]?.toUpperCase()) // Take the first letter of each word and capitalize
+      .join(""); // Combine all initials
+
+    return initials.slice(0, 2); // Limit to 2 characters
+  }
+
+  function getDimensions(
+    file: File
+  ): Promise<{ width: number; height: number }> {
+    const img = new Image();
+    img.src = URL.createObjectURL(file);
+    return new Promise((resolve, reject) => {
+      img.onload = () => {
+        const width = img.width;
+        const height = img.height;
+        resolve({ width, height });
+      };
+
+      img.onerror = () => {
+        reject(new Error("Failed to read image dimensions"));
+      };
+    });
+  }
+
+  return {
+    requiredRule,
+    emailRule,
+    passwordRule,
+    confirmPasswordRule,
+    validateEmail,
+    validatePassword,
+    back,
+    debounce,
+    insertBetween,
+    getNameInitials,
+    getDimensions,
+  };
+}

package/nuxt.config.ts

@@ -0,0 +1,60 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
+import vuetify, { transformAssetUrls } from "vite-plugin-vuetify";
+export default defineNuxtConfig({
+  devtools: { enabled: true },
+  build: {
+    transpile: ["vuetify"],
+  },
+
+  runtimeConfig: {
+    public: {
+      cookieConfig: {
+        domain: (process.env.DOMAIN as string) ?? "localhost",
+        secure: true,
+        maxAge: 30 * 24 * 60 * 60,
+      },
+      APP_NAME: (process.env.APP_NAME as string) ?? "App",
+      APP_NAME_ROUTE: (process.env.APP_NAME_ROUTE as string) ?? "index",
+      APP_ACCOUNT: (process.env.APP_ACCOUNT as string) ?? "",
+      APP_PROJECT: (process.env.APP_PROJECT as string) ?? "",
+      APP_DEPED_HQ: (process.env.APP_DEPED_HQ as string) ?? "",
+      APP_REGION_HQ: (process.env.APP_REGION_HQ as string) ?? "",
+      APP_DIVISION_HQ: (process.env.APP_DIVISION_HQ as string) ?? "",
+      APP_SCHOOL_HQ: (process.env.APP_SCHOOL_HQ as string) ?? "",
+      APP_STUDENT_ZONE: (process.env.APP_STUDENT_ZONE as string) ?? "",
+      APP_PARENT_PORTAL: (process.env.APP_PARENT_PORTAL as string) ?? "",
+      APP_BOOK_KEEPING: (process.env.APP_BOOK_KEEPING as string) ?? "",
+      APP_ASSET_MANAGEMENT: (process.env.APP_ASSET as string) ?? "",
+      APP_EMPLOYEE_MANAGEMENT:
+        (process.env.APP_EMPLOYEE_MANAGEMENT as string) ?? "",
+      APP_PAYROLL: (process.env.APP_PAYROLL as string) ?? "",
+      APP_ATTENDANCE_KEEPING:
+        (process.env.APP_ATTENDANCE_KEEPING as string) ?? "",
+      APP_LEAVE_MANAGEMENT: (process.env.APP_LEAVE_MANAGEMENT as string) ?? "",
+      APP_PROPERTY_MANAGEMENT:
+        (process.env.APP_PROPERTY_MANAGEMENT as string) ?? "",
+      APP_RECRUITMENT: (process.env.APP_RECRUITMENT as string) ?? "",
+      API_DO_STORAGE_ENDPOINT:
+        (process.env.API_DO_STORAGE_ENDPOINT as string) ?? "",
+      APP_ADMIN: (process.env.APP_ADMIN as string) ?? "",
+      APP_RECAP: (process.env.APP_RECAP as string) ?? "",
+    },
+  },
+
+  modules: [
+    (_options, nuxt) => {
+      nuxt.hooks.hook("vite:extendConfig", (config) => {
+        // @ts-expect-error
+        config.plugins.push(vuetify({ autoImport: true }));
+      });
+    },
+  ],
+
+  vite: {
+    vue: {
+      template: {
+        transformAssetUrls,
+      },
+    },
+  },
+});

package/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "@iservice365/layer-common",
+  "license": "MIT",
+  "type": "module",
+  "version": "0.0.1",
+  "main": "./nuxt.config.ts",
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "dev": "nuxi dev .playground",
+    "dev:prepare": "nuxt prepare .playground",
+    "build": "nuxt build .playground",
+    "generate": "nuxt generate .playground",
+    "preview": "nuxt preview .playground",
+    "release": "yarn run build && changeset publish"
+  },
+  "devDependencies": {
+    "@changesets/cli": "^2.27.9",
+    "@nuxt/eslint": "latest",
+    "eslint": "^9.14.0",
+    "nuxt": "^3.13.2",
+    "typescript": "^5.6.3",
+    "vite-plugin-vuetify": "^2.0.4",
+    "vue": "latest",
+    "vuetify": "^3.7.3"
+  },
+  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e",
+  "dependencies": {
+    "@mdi/font": "^7.4.47",
+    "sass": "^1.80.6"
+  }
+}

package/plugins/API.ts

@@ -0,0 +1,44 @@
+export default defineNuxtPlugin(() => {
+  const { cookieConfig } = useRuntimeConfig().public;
+
+  const api = $fetch.create({
+    baseURL: "/",
+    retry: 1,
+    retryStatusCodes: [401],
+    retryDelay: 500,
+    onRequest({ options }) {
+      const accessToken = useCookie("accessToken", cookieConfig).value;
+      options.headers = accessToken
+        ? { Authorization: `Bearer ${accessToken}` }
+        : {};
+    },
+
+    async onResponseError({ response }) {
+      if (response.status === 401) {
+        await $fetch("/api/auth", {
+          baseURL: "/",
+          method: "PUT",
+          server: false,
+          credentials: "include",
+          body: JSON.stringify({
+            token: useCookie("refreshToken", cookieConfig).value,
+          }),
+
+          onResponse({ response }) {
+            if (response.status === 200) {
+              useCookie("accessToken", cookieConfig).value =
+                response._data.token;
+            }
+          },
+        });
+      }
+    },
+  });
+
+  // Expose to useNuxtApp().$api
+  return {
+    provide: {
+      api,
+    },
+  };
+});

package/plugins/vuetify.ts

@@ -0,0 +1,41 @@
+// import this after install `@mdi/font` package
+import "@mdi/font/css/materialdesignicons.css";
+
+import "vuetify/styles";
+import { createVuetify } from "vuetify";
+
+export default defineNuxtPlugin((app) => {
+  const vuetify = createVuetify({
+    defaults: {
+      VTextField: {
+        variant: "outlined",
+        density: "comfortable",
+      },
+      VAutocomplete: {
+        variant: "outlined",
+        density: "comfortable",
+      },
+      VSelect: {
+        variant: "outlined",
+        density: "comfortable",
+      },
+      VTextarea: {
+        variant: "outlined",
+        density: "comfortable",
+      },
+    },
+    theme: {
+      defaultTheme: "iservice365",
+      themes: {
+        iservice365: {
+          dark: false,
+          colors: {
+            primary: "#042134",
+          },
+        },
+      },
+    },
+  });
+
+  app.vueApp.use(vuetify);
+});

package/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "./.playground/.nuxt/tsconfig.json"
+}