@appcorp/fusion-storybook 0.2.40 → 0.2.42

package/base-modules/section/context.js

@@ -9,7 +9,7 @@
  * Key responsibilities:
  * - Expose `useSectionModule()` which UI components call for actions
  * - Keep module-specific `apiParams` and callbacks in one place
- * - Ensure cache invalidation and toast notifications on mutation
+ * - Ensure toast notifications on mutation
  *
  * Exported utilities:
  * - `SectionProvider` — provider component used by the page
@@ -28,7 +28,6 @@ import { DRAWER_TYPES } from "@react-pakistan/util-functions/factory/generic-com
 import { generateThemeToast, TOAST_VARIANT, } from "@appcorp/shadcn/lib/toast-utils";
 import { SECTION_API_ROUTES, pageLimit } from "./constants";
 import { sectionFormValidation } from "./validate";
-import { getCachedSections, invalidateSectionsCache } from "./cache";
 import { getCachedWorkspaceSync } from "../workspace/cache";
 // ============================================================================
 // 1.1 DRAWER TYPES
@@ -136,6 +135,30 @@ export const useSectionModule = () => {
             payload: { drawer: null },
         });
     }, [dispatch]);
+    const resetRecordFormState = useCallback(() => {
+        dispatch({
+            type: SECTION_ACTION_TYPES.SET_ERRORS,
+            payload: { errors: {} },
+        });
+        dispatch({
+            type: SECTION_ACTION_TYPES.SET_DISABLE_SAVE_BUTTON,
+            payload: { disabled: false },
+        });
+        dispatch({
+            type: SECTION_ACTION_TYPES.SET_FORM_DATA,
+            payload: {
+                form: {
+                    capacity: null,
+                    classId: "",
+                    enabled: true,
+                    filterEnabled: undefined,
+                    id: "",
+                    name: "",
+                    schoolId,
+                },
+            },
+        });
+    }, [dispatch, schoolId]);
     // ============================================================================
     // 1.4.4 API CALLBACKS
     // ============================================================================
@@ -161,7 +184,6 @@ export const useSectionModule = () => {
         }
         if (data) {
             const isCreated = isCreatedOrUpdated(data);
-            invalidateSectionsCache();
             showToast(isCreated ? t("messagesCreateSuccess") : t("messagesSaveSuccess"), TOAST_VARIANT.SUCCESS);
             resetFormAndCloseDrawer();
             (_a = listFetchNowRef.current) === null || _a === void 0 ? void 0 : _a.call(listFetchNowRef);
@@ -186,7 +208,6 @@ export const useSectionModule = () => {
             return;
         }
         if (data) {
-            invalidateSectionsCache();
             showToast(t("messagesDeleteSuccess"), TOAST_VARIANT.SUCCESS);
             (_a = listFetchNowRef.current) === null || _a === void 0 ? void 0 : _a.call(listFetchNowRef);
         }
@@ -239,19 +260,21 @@ export const useSectionModule = () => {
         });
     }, [dispatch]);
     const handleView = useCallback((row) => {
+        resetRecordFormState();
         byIdFetchNow === null || byIdFetchNow === void 0 ? void 0 : byIdFetchNow(undefined, { params: { id: row === null || row === void 0 ? void 0 : row.id } });
         dispatch({
             type: SECTION_ACTION_TYPES.SET_DRAWER,
             payload: { drawer: SECTION_DRAWER.VIEW_DRAWER },
         });
-    }, [byIdFetchNow, dispatch]);
+    }, [byIdFetchNow, dispatch, resetRecordFormState]);
     const handleEdit = useCallback((row) => {
+        resetRecordFormState();
         byIdFetchNow === null || byIdFetchNow === void 0 ? void 0 : byIdFetchNow(undefined, { params: { id: row === null || row === void 0 ? void 0 : row.id } });
         dispatch({
             type: SECTION_ACTION_TYPES.SET_DRAWER,
             payload: { drawer: SECTION_DRAWER.FORM_DRAWER },
         });
-    }, [byIdFetchNow, dispatch]);
+    }, [byIdFetchNow, dispatch, resetRecordFormState]);
     const handleDelete = useCallback((row) => {
         if (!confirm(t("messagesDeleteConfirmation")))
             return;
@@ -372,19 +395,19 @@ export const useSectionModule = () => {
         {
             enabled: true,
             handleOnClick: handleMoreActions,
-            label: t("actionHeaderMoreActions"),
+            label: t("actionsButtonMoreActions"),
             order: 0,
         },
         {
             enabled: true,
             handleOnClick: handleFilters,
-            label: t("actionHeaderFilters"),
+            label: t("actionsButtonFilters"),
             order: 1,
         },
         {
             enabled: true,
             handleOnClick: handleCreate,
-            label: t("actionHeaderAdd"),
+            label: t("actionsButtonAdd"),
             order: 2,
         },
     ], [handleCreate, handleFilters, handleMoreActions, t]);
@@ -392,70 +415,39 @@ export const useSectionModule = () => {
         {
             enabled: true,
             handleOnClick: handleView,
-            label: t("actionRowView"),
+            label: t("actionsButtonView"),
             order: 1,
         },
         {
             enabled: (row) => (row === null || row === void 0 ? void 0 : row.enabled) === true,
             handleOnClick: handleEdit,
-            label: t("actionRowEdit"),
+            label: t("actionsButtonEdit"),
             order: 2,
         },
         {
             enabled: (row) => (row === null || row === void 0 ? void 0 : row.enabled) === false,
             handleOnClick: handleDelete,
-            label: t("actionRowDelete"),
+            label: t("actionsButtonDelete"),
             order: 3,
             variant: "destructive",
         },
         {
             enabled: false,
             handleOnClick: toggleStatus,
-            label: t("actionRowToggleStatus"),
+            label: t("actionsButtonToggleStatus"),
             order: 4,
         },
     ], [handleDelete, handleEdit, handleView, t, toggleStatus]);
     // ============================================================================
     // 1.4.9 EFFECTS
     // ============================================================================
-    // Keep the latest fetch function in a ref so the fetch effect can call it
-    // without depending on listFetchNow's unstable identity.
     useEffect(() => {
         listFetchNowRef.current = listFetchNow;
-    });
-    // Initial load via cache; re-fetch directly from API on page/pageLimit/filter/search changes.
+    }, [listFetchNow]);
     useEffect(() => {
         var _a;
-        if (!schoolId)
-            return;
-        const currentPage = Number(listParams.currentPage) || 1;
-        const currentPageLimit = Number(listParams.pageLimit) || pageLimit;
-        const isDefaultLoad = currentPage === 1 &&
-            currentPageLimit === pageLimit &&
-            !listParams.searchQuery &&
-            listParams.filterEnabled === undefined;
-        if (isDefaultLoad) {
-            (async () => {
-                try {
-                    const { count, items } = await getCachedSections({
-                        params: listParams,
-                    });
-                    dispatch({
-                        type: SECTION_ACTION_TYPES.SET_ITEMS,
-                        payload: { items: items || [], count: count || 0 },
-                    });
-                }
-                catch (_a) {
-                    showToast(t("messagesFetchFailed"), TOAST_VARIANT.ERROR);
-                }
-            })();
-        }
-        else {
-            // Bypass cache for pagination, pageLimit, filter and search changes.
-            // Use ref to avoid the infinite-loop caused by listFetchNow's unstable identity.
-            (_a = listFetchNowRef.current) === null || _a === void 0 ? void 0 : _a.call(listFetchNowRef);
-        }
-    }, [dispatch, listParams, schoolId, showToast, t]);
+        (_a = listFetchNowRef.current) === null || _a === void 0 ? void 0 : _a.call(listFetchNowRef);
+    }, [listParams]);
     // ============================================================================
     // 1.4.10 RETURN
     // ============================================================================
@@ -480,6 +472,7 @@ export const useSectionModule = () => {
         headerActions,
         listFetchNow,
         listLoading,
+        resetRecordFormState,
         rowActions,
         toggleStatus,
         updateLoading });

package/base-modules/section/form.js

@@ -7,95 +7,40 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * Uses a class combobox populated from cached class data.
  */
 import { EnhancedInput } from "@appcorp/shadcn/components/enhanced-input";
-import { EnhancedCombobox } from "@appcorp/shadcn/components/enhanced-combobox";
+import { useEnhancedCombobox } from "@appcorp/shadcn/hooks/use-enhanced-combobox";
 import { EnhancedCheckbox } from "@appcorp/shadcn/components/enhanced-checkbox";
-import { useDebounce } from "@react-pakistan/util-functions/hooks/use-debounce";
-import { useEffect, useMemo, useState } from "react";
 import { useSectionModule } from "./context";
 import { useTranslations } from "next-intl";
-import { getCachedClasses, getCachedClassesSync } from "../class/cache";
 import { getCachedWorkspaceSync } from "../workspace/cache";
+import { SECTION_API_ROUTES } from "./constants";
+import { useFetch } from "@react-pakistan/util-functions/hooks/use-fetch";
+import { API_METHODS } from "@react-pakistan/util-functions";
 export const SectionForm = () => {
-    var _a;
     const { state, handleChange } = useSectionModule();
     const { capacity, classId, enabled, errors, name } = state;
     const t = useTranslations("section");
     const workspace = getCachedWorkspaceSync();
-    const schoolId = ((_a = workspace === null || workspace === void 0 ? void 0 : workspace.school) === null || _a === void 0 ? void 0 : _a.id) || "";
-    const cachedClasses = getCachedClassesSync();
-    const [classSearchQuery, setClassSearchQuery] = useState("");
-    const [remoteClassOptions, setRemoteClassOptions] = useState(() => cachedClasses.items.map((cls) => ({
-        label: `${cls.name} (${cls.code})`,
-        value: cls.id,
-    })));
-    const [classOptionsLoading, setClassOptionsLoading] = useState(false);
-    const debouncedClassSearchQuery = useDebounce(classSearchQuery, 300);
-    const trimmedClassSearchQuery = debouncedClassSearchQuery.trim();
-    const cachedClassOptions = useMemo(() => cachedClasses.items.map((cls) => ({
-        label: `${cls.name} (${cls.code})`,
-        value: cls.id,
-    })), [cachedClasses.items]);
-    const selectedClassOption = useMemo(() => {
-        const selectedClass = cachedClasses.items.find((item) => item.id === classId);
-        return selectedClass
-            ? [
-                {
-                    label: `${selectedClass.name} (${selectedClass.code})`,
-                    value: selectedClass.id,
-                },
-            ]
-            : [];
-    }, [cachedClasses.items, classId]);
-    const displayedClassOptions = useMemo(() => {
-        const sourceOptions = trimmedClassSearchQuery
-            ? remoteClassOptions
-            : cachedClassOptions;
-        const mergedOptions = [...selectedClassOption, ...sourceOptions];
-        const uniqueOptions = new Map(mergedOptions.map((option) => [option.value, option]));
-        return [...uniqueOptions.values()];
-    }, [
-        cachedClassOptions,
-        remoteClassOptions,
-        selectedClassOption,
-        trimmedClassSearchQuery,
-    ]);
-    useEffect(() => {
-        if (!trimmedClassSearchQuery || !schoolId)
-            return;
-        let isActive = true;
-        const fetchClasses = async () => {
-            setClassOptionsLoading(true);
-            try {
-                const { items } = await getCachedClasses({
-                    params: {
-                        schoolId,
-                        searchQuery: trimmedClassSearchQuery,
-                    },
-                });
-                if (!isActive)
-                    return;
-                setRemoteClassOptions((items || []).map((cls) => ({
-                    label: `${cls.name} (${cls.code})`,
-                    value: cls.id,
-                })));
-            }
-            catch (_a) {
-                if (!isActive)
-                    return;
-                setRemoteClassOptions([]);
-            }
-            finally {
-                if (isActive) {
-                    setClassOptionsLoading(false);
-                }
-            }
-        };
-        void fetchClasses();
-        return () => {
-            isActive = false;
-        };
-    }, [schoolId, trimmedClassSearchQuery]);
-    return (_jsxs("div", { className: "grid grid-cols-1 gap-4", children: [_jsx(EnhancedCombobox, { emptyText: t("formNoClassEmpty"), error: errors.classId, id: "classId", info: t("formClassInfo"), label: t("formClassLabel"), loading: classOptionsLoading && Boolean(trimmedClassSearchQuery), onSearchChange: setClassSearchQuery, onValueChange: (value) => handleChange("classId", value), options: displayedClassOptions, required: true, searchPlaceholder: t("formSearchClassesPlaceholder"), value: classId }), _jsx(EnhancedInput, { error: errors.name, id: "name", info: t("sectionNameInfo"), label: t("sectionName"), onChange: (e) => handleChange("name", e.target.value), placeholder: t("sectionNamePlaceholder"), required: true, value: name }), _jsx(EnhancedInput, { error: errors.capacity, id: "capacity", info: t("formCapacityInfo"), label: t("formCapacityLabel"), onChange: (e) => {
+    const { data: classes } = useFetch("/api/v1/class", {
+        params: { workspaceId: workspace === null || workspace === void 0 ? void 0 : workspace.id },
+        method: API_METHODS.GET,
+    });
+    const { enhancedComboboxElement: classIdCombo } = useEnhancedCombobox({
+        emptyText: t("formNoClassEmpty"),
+        id: "classId",
+        info: t("formClassInfo"),
+        label: t("formClassLabel"),
+        onValueChange: (value) => handleChange("classId", value),
+        options: (classes === null || classes === void 0 ? void 0 : classes.map((cls) => ({
+            id: cls.id,
+            name: `${cls.name} (${cls.code})`,
+        }))) || [],
+        placeholder: t("formClassPlaceholder"),
+        required: true,
+        searchEndpoint: SECTION_API_ROUTES.UNIT,
+        searchPlaceholder: t("formSearchClassesPlaceholder"),
+        value: classId,
+    });
+    return (_jsxs("div", { className: "grid grid-cols-1 gap-4", children: [classIdCombo, _jsx(EnhancedInput, { error: errors.name, id: "name", info: t("sectionNameInfo"), label: t("sectionName"), onChange: (e) => handleChange("name", e.target.value), placeholder: t("sectionNamePlaceholder"), required: true, value: name }), _jsx(EnhancedInput, { error: errors.capacity, id: "capacity", info: t("formCapacityInfo"), label: t("formCapacityLabel"), onChange: (e) => {
                     const value = e.target.value;
                     handleChange("capacity", value ? Number(value) : 0);
                 }, placeholder: t("formCapacityPlaceholder"), type: "number", value: (capacity === null || capacity === void 0 ? void 0 : capacity.toString()) || "" }), _jsx(EnhancedCheckbox, { label: t("formActiveSectionLabel"), defaultChecked: enabled, onCheckedChange: (checked) => handleChange("enabled", checked), info: t("actionToggleActivateOrDeactivateSection") })] }));

package/base-modules/section/more-actions.js

@@ -7,7 +7,6 @@ import converter from "json-2-csv";
 import { Timeline } from "../../components/timeline";
 import { useTranslations } from "next-intl";
 import { SECTION_API_ROUTES, pageLimit } from "./constants";
-import { invalidateSectionsCache } from "./cache";
 import { SECTION_ACTION_TYPES, useSectionContext } from "./context";
 import { useRef, useEffect, useCallback } from "react";
 const workspace = getCachedWorkspaceSync();
@@ -165,7 +164,6 @@ export const SectionMoreActions = () => {
                 else {
                     showSuccessToast("Bulk operation completed successfully");
                 }
-                invalidateSectionsCache();
                 const schoolId = ((_f = workspace === null || workspace === void 0 ? void 0 : workspace.school) === null || _f === void 0 ? void 0 : _f.id) || "";
                 fetch(`${SECTION_API_ROUTES.LIST}?currentPage=1&pageLimit=${pageLimit}&schoolId=${schoolId}`, {
                     headers: {

package/base-modules/section/view.js

@@ -12,17 +12,19 @@ import { GraduationCap, CheckCircle2, XCircle, Users } from "lucide-react";
 import { useSectionModule } from "./context";
 import { useTranslations } from "next-intl";
 import { formatValue } from "@react-pakistan/util-functions/general/format-value";
-import { getCachedClassesSync } from "../class/cache";
+import { getCachedWorkspaceSync } from "../workspace/cache";
+import { useFetch } from "@react-pakistan/util-functions/hooks/use-fetch";
+import { API_METHODS } from "@react-pakistan/util-functions";
 export const SectionView = () => {
     const { state } = useSectionModule();
     const { capacity, classId, enabled, name } = state;
+    const workspace = getCachedWorkspaceSync();
     const t = useTranslations("section");
-    const classes = getCachedClassesSync();
-    const selectedClass = classes.items.find((cls) => cls.id === classId);
-    const className = selectedClass
-        ? `${selectedClass.name} (${selectedClass.code})`
-        : "—";
-    return (_jsxs("div", { className: "space-y-4", children: [_jsx(Card, { children: _jsx(CardContent, { className: "pt-6", children: _jsxs("div", { className: "flex items-center gap-6", children: [_jsx("div", { className: "bg-primary/10 flex h-24 w-24 items-center justify-center rounded-full", children: _jsx(Users, { className: "text-primary h-12 w-12" }) }), _jsxs("div", { className: "flex-1", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("h2", { className: "text-2xl font-bold", children: name }), enabled ? (_jsx(CheckCircle2, { className: "h-5 w-5 text-green-500" })) : (_jsx(XCircle, { className: "h-5 w-5 text-red-500" }))] }), _jsxs("p", { className: "text-muted-foreground mt-1", children: [t("viewFieldClass"), ": ", className] })] })] }) }) }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "pb-3", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(GraduationCap, { className: "text-primary h-5 w-5" }), _jsx(CardTitle, { className: "text-lg", children: t("sectionDetails") })] }), _jsx(CardDescription, { children: t("viewSectionCompleteSectionInformation") })] }), _jsx(Separator, {}), _jsx(CardContent, { className: "pt-6", children: _jsxs("div", { className: "grid grid-cols-1 gap-6 md:grid-cols-2", children: [_jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("sectionName") }), _jsx("p", { className: "text-base", children: formatValue(name) })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("viewFieldClass") }), _jsx("p", { className: "text-base", children: className })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("viewFieldCapacity") }), _jsxs("p", { className: "text-base", children: [formatValue(capacity), " ", capacity !== null ? t("viewFieldStudents") : ""] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("viewFieldStatus") }), _jsx(Badge, { variant: enabled ? "default" : "secondary", children: enabled
+    const { data: classData } = useFetch("/api/v1/class", {
+        params: { classId, workspaceId: workspace === null || workspace === void 0 ? void 0 : workspace.id },
+        method: API_METHODS.GET,
+    });
+    return (_jsxs("div", { className: "space-y-4", children: [_jsx(Card, { children: _jsx(CardContent, { className: "pt-6", children: _jsxs("div", { className: "flex items-center gap-6", children: [_jsx("div", { className: "bg-primary/10 flex h-24 w-24 items-center justify-center rounded-full", children: _jsx(Users, { className: "text-primary h-12 w-12" }) }), _jsxs("div", { className: "flex-1", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("h2", { className: "text-2xl font-bold", children: name }), enabled ? (_jsx(CheckCircle2, { className: "h-5 w-5 text-green-500" })) : (_jsx(XCircle, { className: "h-5 w-5 text-red-500" }))] }), _jsxs("p", { className: "text-muted-foreground mt-1", children: [t("viewFieldClass"), ": ", (classData === null || classData === void 0 ? void 0 : classData.name) || "—"] })] })] }) }) }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "pb-3", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(GraduationCap, { className: "text-primary h-5 w-5" }), _jsx(CardTitle, { className: "text-lg", children: t("sectionDetails") })] }), _jsx(CardDescription, { children: t("viewSectionCompleteSectionInformation") })] }), _jsx(Separator, {}), _jsx(CardContent, { className: "pt-6", children: _jsxs("div", { className: "grid grid-cols-1 gap-6 md:grid-cols-2", children: [_jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("sectionName") }), _jsx("p", { className: "text-base", children: formatValue(name) })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("viewFieldClass") }), _jsx("p", { className: "text-base", children: (classData === null || classData === void 0 ? void 0 : classData.name) || "—" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("viewFieldCapacity") }), _jsxs("p", { className: "text-base", children: [formatValue(capacity), " ", capacity !== null ? t("viewFieldStudents") : ""] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: t("viewFieldStatus") }), _jsx(Badge, { variant: enabled ? "default" : "secondary", children: enabled
                                                 ? t("viewFieldStatusActive")
                                                 : t("viewFieldStatusInactive") })] })] }) })] })] }));
 };

package/base-modules/student-fee/context/use-student-fee-module.d.ts

@@ -26,6 +26,7 @@ export declare const useStudentFeeModule: () => {
     }[];
     listFetchNow: (url?: string, config?: import("@react-pakistan/util-functions/hooks/use-fetch").FetchConfig) => void;
     listLoading: boolean;
+    resetRecordFormState: () => void;
     rowActions: RowAction[];
     toggleStatus: (row?: TableRow) => void;
     updateLoading: boolean;

package/base-modules/student-fee/context/use-student-fee-module.js

@@ -7,9 +7,8 @@ import { useModuleEntityV2, } from "@react-pakistan/util-functions/hooks/use-mod
 import { useDebounce } from "@react-pakistan/util-functions/hooks/use-debounce";
 import { generateThemeToast, TOAST_VARIANT, } from "@appcorp/shadcn/lib/toast-utils";
 import { PAYMENT_STATUS, DISCOUNT_TYPE, } from "../../../type";
-import { STUDENT_FEE_API_ROUTES, pageLimit } from "../constants";
+import { STUDENT_FEE_API_ROUTES } from "../constants";
 import { studentFeeFormValidation } from "../validate";
-import { getCachedStudentFees, invalidateStudentFeesCache } from "../cache";
 import { getCachedWorkspaceSync } from "../../workspace/cache";
 import { getCachedFeeStructureById } from "../../fee-structure/cache";
 import { getCachedStudentProfilesSync } from "../../student-profile/cache";
@@ -71,11 +70,6 @@ export const useStudentFeeModule = () => {
     }), [state, schoolId]);
     const byIdParams = useMemo(() => ({ id: state.id }), [state.id]);
     const deleteParams = useMemo(() => ({ id: state.id }), [state.id]);
-    const isDefaultListState = state.currentPage === 1 &&
-        state.pageLimit === pageLimit &&
-        !debouncedQuery &&
-        state.filterEnabled === undefined &&
-        !state.filterStatus;
     // ============================================================================
     // 1.4.3 UTILITIES
     // ============================================================================
@@ -101,6 +95,44 @@ export const useStudentFeeModule = () => {
             payload: { drawer: null },
         });
     }, [dispatch]);
+    const resetRecordFormState = useCallback(() => {
+        dispatch({
+            type: STUDENT_FEE_ACTION_TYPES.SET_ERRORS,
+            payload: { errors: {} },
+        });
+        dispatch({
+            type: STUDENT_FEE_ACTION_TYPES.SET_DISABLE_SAVE_BUTTON,
+            payload: { disabled: false },
+        });
+        dispatch({
+            type: STUDENT_FEE_ACTION_TYPES.SET_FORM_DATA,
+            payload: {
+                form: {
+                    amount: 0,
+                    amountDue: 0,
+                    amountPaid: 0,
+                    discountAmount: 0,
+                    discountCodeId: null,
+                    dueDate: new Date().toISOString().slice(0, 10),
+                    enabled: true,
+                    familyId: "",
+                    feeStructureId: "",
+                    filterEnabled: undefined,
+                    filterStatus: "",
+                    id: "",
+                    lastRemindedAt: null,
+                    nextFollowUpAt: null,
+                    originalFee: 0,
+                    reliabilityScore: null,
+                    remarks: null,
+                    riskLevel: null,
+                    schoolId,
+                    status: PAYMENT_STATUS.PENDING,
+                    studentProfileId: "",
+                },
+            },
+        });
+    }, [dispatch, schoolId]);
     // ============================================================================
     // 1.4.4 API CALLBACKS
     // ============================================================================
@@ -126,7 +158,6 @@ export const useStudentFeeModule = () => {
         }
         if (data) {
             const isCreated = isCreatedOrUpdated(data);
-            invalidateStudentFeesCache();
             showToast(isCreated
                 ? t("messagesStudentFeeCreated")
                 : t("messagesStudentFeeUpdated"), TOAST_VARIANT.SUCCESS);
@@ -162,7 +193,6 @@ export const useStudentFeeModule = () => {
             return;
         }
         if (data) {
-            invalidateStudentFeesCache();
             showToast(t("messagesStudentFeeDeleted"), TOAST_VARIANT.SUCCESS);
             (_a = listFetchNowRef.current) === null || _a === void 0 ? void 0 : _a.call(listFetchNowRef);
         }
@@ -424,19 +454,21 @@ export const useStudentFeeModule = () => {
         });
     }, [dispatch]);
     const handleView = useCallback((row) => {
+        resetRecordFormState();
         byIdFetchNow === null || byIdFetchNow === void 0 ? void 0 : byIdFetchNow(undefined, { params: { id: row === null || row === void 0 ? void 0 : row.id } });
         dispatch({
             type: STUDENT_FEE_ACTION_TYPES.SET_DRAWER,
             payload: { drawer: STUDENT_FEE_DRAWER.VIEW_DRAWER },
         });
-    }, [dispatch, byIdFetchNow]);
+    }, [byIdFetchNow, dispatch, resetRecordFormState]);
     const handleEdit = useCallback((row) => {
+        resetRecordFormState();
         byIdFetchNow === null || byIdFetchNow === void 0 ? void 0 : byIdFetchNow(undefined, { params: { id: row === null || row === void 0 ? void 0 : row.id } });
         dispatch({
             type: STUDENT_FEE_ACTION_TYPES.SET_DRAWER,
             payload: { drawer: STUDENT_FEE_DRAWER.FORM_DRAWER },
         });
-    }, [dispatch, byIdFetchNow]);
+    }, [byIdFetchNow, dispatch, resetRecordFormState]);
     const handleDelete = useCallback((row) => {
         if (!confirm(t("messagesDeleteConfirmation")))
             return;
@@ -555,32 +587,15 @@ export const useStudentFeeModule = () => {
     // ============================================================================
     // 1.4.9 EFFECTS
     // ============================================================================
+    useEffect(() => {
+        listFetchNowRef.current = listFetchNow;
+    }, [listFetchNow]);
     useEffect(() => {
         var _a;
         if (!schoolId)
             return;
-        if (isDefaultListState) {
-            (async () => {
-                try {
-                    const { count, items } = await getCachedStudentFees({
-                        params: listParams,
-                    });
-                    dispatch({
-                        type: STUDENT_FEE_ACTION_TYPES.SET_ITEMS,
-                        payload: { items: items || [], count: count || 0 },
-                    });
-                }
-                catch (_a) {
-                    showToast(t("messagesNetworkError"), TOAST_VARIANT.ERROR);
-                }
-            })();
-            return;
-        }
         (_a = listFetchNowRef.current) === null || _a === void 0 ? void 0 : _a.call(listFetchNowRef);
-    }, [dispatch, isDefaultListState, listParams, schoolId, showToast, t]);
-    useEffect(() => {
-        listFetchNowRef.current = listFetchNow;
-    }, [listFetchNow]);
+    }, [dispatch, listParams, schoolId, showToast, t]);
     // ============================================================================
     // 1.4.10 RETURN
     // ============================================================================
@@ -604,6 +619,7 @@ export const useStudentFeeModule = () => {
         headerActions,
         listFetchNow,
         listLoading,
+        resetRecordFormState,
         rowActions,
         toggleStatus,
         updateLoading });

package/base-modules/student-fee/context.d.ts

@@ -8,7 +8,7 @@
  * Key responsibilities:
  * - expose `useStudentFeeModule()` which UI components call for actions
  * - keep module-specific `apiParams` and callbacks in one place
- * - ensure cache invalidation and toast notifications on mutation
+ * - ensure toast notifications on mutation
  *
  * Exported utilities:
  * - `StudentFeeProvider` — provider component used by the page

package/base-modules/student-fee/context.js

@@ -9,7 +9,7 @@
  * Key responsibilities:
  * - expose `useStudentFeeModule()` which UI components call for actions
  * - keep module-specific `apiParams` and callbacks in one place
- * - ensure cache invalidation and toast notifications on mutation
+ * - ensure toast notifications on mutation
  *
  * Exported utilities:
  * - `StudentFeeProvider` — provider component used by the page

package/base-modules/student-fee/filter.js

@@ -7,20 +7,40 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * filterStatus (payment status combobox).
  */
 import { EnhancedRadio } from "@appcorp/shadcn/components/enhanced-radio";
-import { EnhancedCombobox } from "@appcorp/shadcn/components/enhanced-combobox";
+import { useEnhancedCombobox } from "@appcorp/shadcn/hooks/use-enhanced-combobox";
 import { useStudentFeeModule } from "./context";
-import { PAYMENT_STATUS_OPTIONS } from "./constants";
+import { PAYMENT_STATUS_OPTIONS, STUDENT_FEE_API_ROUTES } from "./constants";
 import { useTranslations } from "next-intl";
 export const StudentFeeFilter = () => {
     const { state, handleChange } = useStudentFeeModule();
     const { filterEnabled, filterStatus } = state;
     const t = useTranslations("studentFee");
+    const paymentStatusLabelMap = {
+        PENDING: t("formOptionPending"),
+        PARTIAL: t("formOptionPartial"),
+        PAID: t("formOptionPaid"),
+        OVERDUE: t("formOptionOverdue"),
+        CANCELLED: t("formOptionCancelled"),
+        REFUNDED: t("formOptionRefunded"),
+    };
     const filterEnabledValue = filterEnabled === undefined
         ? "undefined"
         : filterEnabled
             ? "true"
             : "false";
-    return (_jsxs("div", { className: "space-y-4", children: [_jsx(EnhancedCombobox, { emptyText: t("filterNoStatusFoundLabel"), id: "filterStatus", info: t("filterByPaymentStatus"), label: t("filterPaymentStatusLabel"), onValueChange: (value) => handleChange("filterStatus", value), options: PAYMENT_STATUS_OPTIONS, placeholder: t("filterAllStatusesLabel"), searchPlaceholder: t("filterSearchStatusLabel"), value: filterStatus || "" }), _jsx(EnhancedRadio, { label: t("filterOptionEnabled"), name: "filterEnabled", value: filterEnabledValue, options: [
+    const { enhancedComboboxElement: filterStatusCombo } = useEnhancedCombobox({
+        emptyText: t("filterNoStatusFoundLabel"),
+        id: "filterStatus",
+        info: t("filterByPaymentStatus"),
+        label: t("filterPaymentStatusLabel"),
+        onValueChange: (value) => handleChange("filterStatus", value),
+        options: PAYMENT_STATUS_OPTIONS.map((opt) => ({ id: opt.value, name: paymentStatusLabelMap[opt.value] || opt.label })),
+        placeholder: t("filterAllStatusesLabel"),
+        searchEndpoint: STUDENT_FEE_API_ROUTES.UNIT,
+        searchPlaceholder: t("filterSearchStatusLabel"),
+        value: filterStatus || "",
+    });
+    return (_jsxs("div", { className: "space-y-4", children: [filterStatusCombo, _jsx(EnhancedRadio, { label: t("filterOptionEnabled"), name: "filterEnabled", value: filterEnabledValue, options: [
                     { label: t("filterOptionAll"), value: "undefined" },
                     { label: t("filterOptionEnabled"), value: "true" },
                     { label: t("filterOptionDisabled"), value: "false" },