@appcorp/fusion-storybook 0.1.4

package/base-modules/discount-code/page.js

@@ -0,0 +1,120 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Discount Code Page Component
+ *
+ * Thin wrapper around GenericModulePage. All handlers, header actions, and row
+ * actions live in context.tsx — this file only owns:
+ *   - tableBodyCols  (static, module-level constant)
+ *   - discountCodeConfig (memoised on locale change only; size fixed so the
+ *     component type produced by createGenericModulePage never changes at
+ *     runtime, preventing the infinite-remount re-render loop)
+ *   - permission guard
+ */
+import { useMemo } from "react";
+import { COMPONENT_TYPE } from "@appcorp/shadcn/components/enhanced-table";
+import { createGenericModulePage, } from "@react-pakistan/util-functions/factory/generic-component-factory";
+import { useDiscountCodeModule, DiscountCodeProvider, DISCOUNT_CODE_DRAWER, DISCOUNT_CODE_ACTION_TYPES, } from "./context";
+import { DiscountCodeFilter } from "./filter";
+import { DiscountCodeForm } from "./form";
+import { DiscountCodeMoreActions } from "./more-actions";
+import { DiscountCodeView } from "./view";
+// import { useAuthStateContext } from "@/contexts/auth-context";
+import { resolveRbacPermissions } from "@/utils/resolve-rbac-permissions";
+import { RbacNoAccess } from "@/components/rbac-no-access";
+import { useTranslations } from "next-intl";
+// ============================================================================
+// TABLE COLUMN CONFIGURATION (static — no runtime deps)
+// ============================================================================
+const tableBodyCols = [
+    { componentType: COMPONENT_TYPE.ID, key: "id" },
+    { componentType: COMPONENT_TYPE.BOLD_TEXT, key: "code" },
+    { componentType: COMPONENT_TYPE.TEXT, key: "description" },
+    { componentType: COMPONENT_TYPE.TEXT, key: "discountType" },
+    { componentType: COMPONENT_TYPE.TEXT, key: "discountValue" },
+    { componentType: COMPONENT_TYPE.BOOLEAN, key: "enabled" },
+    { componentType: COMPONENT_TYPE.ACTIONS },
+];
+const tableColumns = [
+    { label: "id", width: "5%" },
+    { label: "code", width: "15%" },
+    { label: "description", width: "25%" },
+    { label: "discountType", width: "15%" },
+    { label: "discountValue", width: "15%" },
+    { label: "status", width: "15%" },
+    { label: "actions", width: "10%" },
+];
+// ============================================================================
+// TRANSLATED COLUMNS HELPER
+// ============================================================================
+const getTranslatedColumns = (t) => tableColumns.map((col) => (Object.assign(Object.assign({}, col), { label: t(col.label) })));
+// ============================================================================
+// COMPONENT FACTORY (creates JSX elements when config is created, not during render)
+// ============================================================================
+const createComponentInstances = () => ({
+    filter: _jsx(DiscountCodeFilter, {}),
+    form: _jsx(DiscountCodeForm, {}),
+    moreActions: _jsx(DiscountCodeMoreActions, {}),
+    view: _jsx(DiscountCodeView, {}),
+});
+// ============================================================================
+// CONFIG CREATION HELPER
+// ============================================================================
+const createDiscountCodeConfig = (t, drawer, dispatch) => {
+    const components = createComponentInstances();
+    return {
+        moduleName: "discountCode",
+        tableColumns: getTranslatedColumns(t),
+        cancelLabel: t("cancel"),
+        drawerTitle: t("drawerTitle"),
+        filterContent: components.filter,
+        formContent: components.form,
+        moreActionsContent: components.moreActions,
+        saveLabel: t("save"),
+        searchPlaceholder: t("tableSearchPlaceholder"),
+        tableDescription: t("tableDescription"),
+        tableTitle: t("tableTitle"),
+        viewContent: components.view,
+        size: drawer === DISCOUNT_CODE_DRAWER.FORM_DRAWER ? "full" : "small",
+        onClearFilters: () => {
+            dispatch({ type: DISCOUNT_CODE_ACTION_TYPES.RESET_FORM });
+        },
+    };
+};
+// ============================================================================
+// STABLE PAGE COMPONENT (created once, outside render)
+// ============================================================================
+const GenericDiscountCodePage = createGenericModulePage({
+    moduleName: "discountCode",
+    tableColumns: [],
+    cancelLabel: "",
+    drawerTitle: "",
+    filterContent: _jsx(DiscountCodeFilter, {}),
+    formContent: _jsx(DiscountCodeForm, {}),
+    moreActionsContent: _jsx(DiscountCodeMoreActions, {}),
+    saveLabel: "",
+    searchPlaceholder: "",
+    tableDescription: "",
+    tableTitle: "",
+    viewContent: _jsx(DiscountCodeView, {}),
+    size: "small",
+    onClearFilters: () => { },
+});
+// ============================================================================
+// INNER PAGE (requires DiscountCodeProvider context)
+// ============================================================================
+const DiscountCodePageInner = ({ userRole }) => {
+    const t = useTranslations("discountCode");
+    const context = useDiscountCodeModule();
+    const hasPermission = useMemo(() => resolveRbacPermissions({
+        userRole,
+        moduleName: "DiscountCode",
+    }), [userRole]);
+    // Memoize config creation
+    const discountCodeConfig = useMemo(() => createDiscountCodeConfig(t, context.state.drawer, context.dispatch), [t, context.state.drawer, context.dispatch]);
+    if (!hasPermission) {
+        return _jsx(RbacNoAccess, { moduleName: "DiscountCode" });
+    }
+    return (_jsx("div", { className: "p-4", children: _jsx(GenericDiscountCodePage, { config: discountCodeConfig, context: context, tableBodyCols: tableBodyCols }) }));
+};
+export const DiscountCodePage = ({ userRole }) => (_jsx(DiscountCodeProvider, { children: _jsx(DiscountCodePageInner, { userRole: userRole }) }));

package/base-modules/discount-code/validate.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Discount Code Validation Schema
+ *
+ * Zod validation schemas for discount code form data. The validation
+ * enforces field presence and type-specific constraints for `discountValue`:
+ * - Percentage values must be between 0 and 100
+ * - Fixed values must be a positive currency amount (example upper bound: 1000)
+ *
+ * Keep messages human-friendly as they are surfaced directly to the UI.
+ */
+import { z } from "zod";
+import { DISCOUNT_TYPE } from "@/type";
+export declare const accountDiscountCodeFormValidation: z.ZodObject<{
+    code: z.ZodString;
+    description: z.ZodOptional<z.ZodString>;
+    discountType: z.ZodEnum<typeof DISCOUNT_TYPE>;
+    discountValue: z.ZodNumber;
+    enabled: z.ZodOptional<z.ZodBoolean>;
+}, z.core.$strip>;

package/base-modules/discount-code/validate.js

@@ -0,0 +1,38 @@
+/**
+ * Discount Code Validation Schema
+ *
+ * Zod validation schemas for discount code form data. The validation
+ * enforces field presence and type-specific constraints for `discountValue`:
+ * - Percentage values must be between 0 and 100
+ * - Fixed values must be a positive currency amount (example upper bound: 1000)
+ *
+ * Keep messages human-friendly as they are surfaced directly to the UI.
+ */
+import { z } from "zod";
+import { DISCOUNT_TYPE } from "@/type";
+// ============================================================================
+// VALIDATION SCHEMA
+// ============================================================================
+export const accountDiscountCodeFormValidation = z
+    .object({
+    code: z
+        .string()
+        .min(1, "Discount code is required")
+        .max(50, "Code must be less than 50 characters"),
+    description: z.string().optional(),
+    discountType: z.nativeEnum(DISCOUNT_TYPE),
+    discountValue: z.number(),
+    enabled: z.boolean().optional(),
+})
+    .refine((data) => {
+    if (data.discountType === DISCOUNT_TYPE.PERCENTAGE) {
+        return data.discountValue >= 0 && data.discountValue <= 100;
+    }
+    else if (data.discountType === DISCOUNT_TYPE.FIXED) {
+        return data.discountValue > 0 && data.discountValue < 1000;
+    }
+    return true;
+}, {
+    message: "Invalid discount value for the selected discount type",
+    path: ["discountValue"],
+});

package/base-modules/discount-code/view.d.ts

@@ -0,0 +1 @@
+export declare const DiscountCodeView: () => import("react/jsx-runtime").JSX.Element;

package/base-modules/discount-code/view.js

@@ -0,0 +1,26 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * Discount Code View — read-only details
+ *
+ * Rendered inside the module's view-drawer. The component reads the
+ * current form state from `useDiscountCodeModule()` and presents
+ * user-friendly labels and badges. Avoid side-effects here; fetching
+ * is handled by the context hook when opening details.
+ */
+import { useDiscountCodeModule } from "./context";
+import { useTranslations } from "next-intl";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle, } from "@appcorp/shadcn/components/ui/card";
+import { Badge } from "@appcorp/shadcn/components/ui/badge";
+import { Separator } from "@appcorp/shadcn/components/ui/separator";
+import { CheckCircle2, XCircle } from "lucide-react";
+import { DISCOUNT_TYPE } from "@/type";
+import { formatValue } from "@/utils/format-value";
+export const DiscountCodeView = () => {
+    const { state } = useDiscountCodeModule();
+    const t = useTranslations("discountCode");
+    const { code, description, discountType, enabled } = state;
+    return (_jsx("div", { className: "space-y-6", children: _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { className: "flex items-center gap-2", children: t("viewTitle") }), _jsx(CardDescription, { children: t("viewDescription") })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [_jsxs("div", { children: [_jsx("label", { className: "text-sm font-medium text-gray-700", children: t("viewLabelsDiscountCode") }), _jsx("p", { className: "mt-1 text-lg font-mono font-semibold", children: formatValue(code) })] }), _jsxs("div", { children: [_jsx("label", { className: "text-sm font-medium text-gray-700", children: t("viewLabelsStatus") }), _jsx("div", { className: "mt-1", children: _jsx(Badge, { variant: enabled ? "default" : "secondary", children: enabled ? (_jsxs(_Fragment, { children: [_jsx(CheckCircle2, { className: "h-3 w-3 mr-1" }), t("viewStatusEnabled")] })) : (_jsxs(_Fragment, { children: [_jsx(XCircle, { className: "h-3 w-3 mr-1" }), t("viewStatusDisabled")] })) }) })] }), _jsxs("div", { children: [_jsx("label", { className: "text-sm font-medium text-gray-700", children: t("viewLabelsDiscountType") }), _jsx("p", { className: "mt-1 text-gray-900 font-medium", children: discountType === DISCOUNT_TYPE.PERCENTAGE
+                                                ? t("formDiscountTypeOptionsPercentage")
+                                                : t("formDiscountTypeOptionsFixed") })] }), _jsxs("div", { children: [_jsx("label", { className: "text-sm font-medium text-gray-700", children: t("viewLabelsDiscountValue") }), _jsx("p", { className: "mt-1 text-xl font-semibold text-primary" })] })] }), _jsx(Separator, {}), _jsxs("div", { children: [_jsx("label", { className: "text-sm font-medium text-gray-700", children: t("viewLabelsDescription") }), _jsx("p", { className: "mt-1 text-gray-900", children: formatValue(description) })] })] })] }) }));
+};

package/base-modules/family/cache.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Family Module Cache Utilities
+ *
+ * Provides localStorage-based caching for families using generic cache system.
+ */
+import { FamilyBE } from "@/type";
+export declare const getCachedFamiliesSync: () => import("@react-pakistan/util-functions").ListResponse<FamilyBE>;
+export declare const getCachedFamilies: ({ params, }: {
+    params?: Record<string, unknown>;
+}) => Promise<import("@react-pakistan/util-functions").ListResponse<FamilyBE>>;
+export declare const getCachedFamilyById: (familyId: string) => FamilyBE | null;
+export declare const invalidateFamiliesCache: () => void;
+export declare const preloadFamilies: () => Promise<import("@react-pakistan/util-functions").ListResponse<FamilyBE>>;
+export declare const isFamiliesCacheStale: () => boolean;

package/base-modules/family/cache.js

@@ -0,0 +1,31 @@
+/**
+ * Family Module Cache Utilities
+ *
+ * Provides localStorage-based caching for families using generic cache system.
+ */
+import { LS_KEYS } from "@/constants";
+import { FAMILY_API_ROUTES } from "./constants";
+import { getCachedData, getCachedDataSync, getCachedItemById, invalidateCache, isCacheStale, preloadCache, } from "@react-pakistan/util-functions";
+// ============================================================================
+// CACHE CONFIGURATION
+// ============================================================================
+const FAMILY_CACHE_CONFIG = {
+    cacheKey: LS_KEYS.FAMILIES,
+    apiUrl: FAMILY_API_ROUTES.UNIT,
+};
+// ============================================================================
+// FAMILY-SPECIFIC CACHE FUNCTIONS
+// ============================================================================
+export const getCachedFamiliesSync = () => getCachedDataSync(LS_KEYS.FAMILIES);
+export const getCachedFamilies = ({ params, }) => getCachedData({
+    config: FAMILY_CACHE_CONFIG,
+    params,
+    headers: {
+        "Content-Type": "application/json",
+        "x-api-token": process.env.NEXT_PUBLIC_API_KEY,
+    },
+});
+export const getCachedFamilyById = (familyId) => getCachedItemById(LS_KEYS.FAMILIES, familyId);
+export const invalidateFamiliesCache = () => invalidateCache(LS_KEYS.FAMILIES);
+export const preloadFamilies = () => preloadCache(FAMILY_CACHE_CONFIG);
+export const isFamiliesCacheStale = () => isCacheStale(LS_KEYS.FAMILIES);

package/base-modules/family/constants.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Family Constants
+ *
+ * Organization:
+ * - Page Configuration
+ * - API Routes
+ * - Table Configuration
+ */
+export declare const pageLimit: number;
+export declare const FAMILY_API_ROUTES: {
+    readonly UNIT: "/api/v1/family";
+};
+export declare const ENABLED_OPTIONS: readonly [{
+    readonly label: "All";
+    readonly value: "";
+}, {
+    readonly label: "Enabled";
+    readonly value: "true";
+}, {
+    readonly label: "Disabled";
+    readonly value: "false";
+}];

package/base-modules/family/constants.js

@@ -0,0 +1,26 @@
+/**
+ * Family Constants
+ *
+ * Organization:
+ * - Page Configuration
+ * - API Routes
+ * - Table Configuration
+ */
+// ============================================================================
+// PAGE CONFIGURATION
+// ============================================================================
+export const pageLimit = Number(process.env.NEXT_PUBLIC_PAGE_LIMIT) || 10;
+// ============================================================================
+// API ROUTES
+// ============================================================================
+export const FAMILY_API_ROUTES = {
+    UNIT: "/api/v1/family",
+};
+// ============================================================================
+// ENABLED OPTIONS
+// ============================================================================
+export const ENABLED_OPTIONS = [
+    { label: "All", value: "" },
+    { label: "Enabled", value: "true" },
+    { label: "Disabled", value: "false" },
+];

package/base-modules/family/context.d.ts

@@ -0,0 +1,173 @@
+import { FamilyBE } from "@/type";
+import { TableRow, type RowAction } from "@appcorp/shadcn/components/enhanced-table";
+export declare const FAMILY_DRAWER: {
+    readonly FILTER_DRAWER: string;
+    readonly FORM_DRAWER: string;
+    readonly MORE_ACTIONS_DRAWER: string;
+    readonly VIEW_DRAWER: string;
+};
+export declare const FAMILY_ACTION_TYPES: {
+    readonly RESET_FORM: "RESET_FORM";
+    readonly SET_CURRENT_PAGE: "SET_CURRENT_PAGE";
+    readonly SET_PAGE_LIMIT: "SET_PAGE_LIMIT";
+    readonly SET_SEARCH_QUERY: "SET_SEARCH_QUERY";
+    readonly SET_DRAWER: "SET_DRAWER";
+    readonly SET_ITEMS: "SET_ITEMS";
+    readonly SET_FORM_DATA: "SET_FORM_DATA";
+    readonly SET_DISABLE_SAVE_BUTTON: "SET_DISABLE_SAVE_BUTTON";
+    readonly SET_INPUT_FIELD: "SET_INPUT_FIELD";
+    readonly SET_ERRORS: "SET_ERRORS";
+    readonly SET_FILTERS: "SET_FILTERS";
+}, familyModuleConfig: import("@react-pakistan/util-functions/factory/generic-module-factory").ModuleConfig<{
+    items: FamilyBE[];
+    count: number;
+    currentPage: number;
+    pageLimit: number;
+    searchQuery: string;
+    disableSaveButton: boolean;
+    drawer: string | null;
+    address: string;
+    city: string;
+    country: string;
+    enabled: boolean;
+    errors: Record<string, string>;
+    familyCode: string;
+    filterEnabled: boolean | undefined;
+    id: string;
+    postalCode: string;
+    stateProvince: string;
+    userId: string;
+}>, initialFamilyState: {
+    items: FamilyBE[];
+    count: number;
+    currentPage: number;
+    pageLimit: number;
+    searchQuery: string;
+    disableSaveButton: boolean;
+    drawer: string | null;
+    address: string;
+    city: string;
+    country: string;
+    enabled: boolean;
+    errors: Record<string, string>;
+    familyCode: string;
+    filterEnabled: boolean | undefined;
+    id: string;
+    postalCode: string;
+    stateProvince: string;
+    userId: string;
+}, FamilyProvider: import("react").FC<{
+    children: React.ReactNode;
+}>, familyReducer: (state: {
+    items: FamilyBE[];
+    count: number;
+    currentPage: number;
+    pageLimit: number;
+    searchQuery: string;
+    disableSaveButton: boolean;
+    drawer: string | null;
+    address: string;
+    city: string;
+    country: string;
+    enabled: boolean;
+    errors: Record<string, string>;
+    familyCode: string;
+    filterEnabled: boolean | undefined;
+    id: string;
+    postalCode: string;
+    stateProvince: string;
+    userId: string;
+}, action: any) => {
+    items: FamilyBE[];
+    count: number;
+    currentPage: number;
+    pageLimit: number;
+    searchQuery: string;
+    disableSaveButton: boolean;
+    drawer: string | null;
+    address: string;
+    city: string;
+    country: string;
+    enabled: boolean;
+    errors: Record<string, string>;
+    familyCode: string;
+    filterEnabled: boolean | undefined;
+    id: string;
+    postalCode: string;
+    stateProvince: string;
+    userId: string;
+}, useFamilyContext: () => import("@react-pakistan/util-functions/factory/generic-module-factory").GenericModuleContext<{
+    items: FamilyBE[];
+    count: number;
+    currentPage: number;
+    pageLimit: number;
+    searchQuery: string;
+    disableSaveButton: boolean;
+    drawer: string | null;
+    address: string;
+    city: string;
+    country: string;
+    enabled: boolean;
+    errors: Record<string, string>;
+    familyCode: string;
+    filterEnabled: boolean | undefined;
+    id: string;
+    postalCode: string;
+    stateProvince: string;
+    userId: string;
+}>;
+/**
+ * Backward-compatible alias used by dashboard-providers.tsx
+ */
+export declare const FamilyStateContextProvider: import("react").FC<{
+    children: React.ReactNode;
+}>;
+export declare const useFamilyModule: () => {
+    applyFilters: () => void;
+    byIdLoading: boolean;
+    clearFilters: () => void;
+    deleteLoading: boolean;
+    handleChange: (field: string, value: string | number | boolean | undefined | null) => void;
+    handleCloseDrawer: () => void;
+    handleCreate: () => void;
+    handleDelete: (row?: TableRow) => void;
+    handleEdit: (row?: TableRow) => void;
+    handleFilters: () => void;
+    handleMoreActions: () => void;
+    handlePageChange: (page: number) => void;
+    handlePageLimitChange: (limit: number) => void;
+    handleSearch: (query: string) => void;
+    handleSubmit: () => void;
+    handleView: (row?: TableRow) => void;
+    headerActions: {
+        enabled: boolean;
+        handleOnClick: () => void;
+        label: string;
+        order: number;
+        icon: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+    }[];
+    listLoading: boolean;
+    rowActions: RowAction[];
+    updateLoading: boolean;
+    state: {
+        items: FamilyBE[];
+        count: number;
+        currentPage: number;
+        pageLimit: number;
+        searchQuery: string;
+        disableSaveButton: boolean;
+        drawer: string | null;
+        address: string;
+        city: string;
+        country: string;
+        enabled: boolean;
+        errors: Record<string, string>;
+        familyCode: string;
+        filterEnabled: boolean | undefined;
+        id: string;
+        postalCode: string;
+        stateProvince: string;
+        userId: string;
+    };
+    dispatch: React.Dispatch<any>;
+};