Merge pull request #273 from AkshataKatwal16/admin

Issue feat: add caching for get read form API
tekdi · Oct 22, 2024 · 0ffa8cd · 0ffa8cd
2 parents 75ede28 + 770ad08
commit 0ffa8cd
Show file tree

Hide file tree

Showing 3 changed files with 42 additions and 17 deletions.
diff --git a/src/components/AddNewCenters.tsx b/src/components/AddNewCenters.tsx
@@ -5,7 +5,7 @@ import {
 } from "@/components/GeneratedSchemas";
 import SimpleModal from "@/components/SimpleModal";
 import { getFormRead } from "@/services/CreateUserService";
-import { CohortTypes, FormContextType } from "@/utils/app.constant";
+import { CohortTypes, FormContext, FormContextType, apiCatchingDuration } from "@/utils/app.constant";
 import { useLocationState } from "@/utils/useLocationState";
 import { Box, Button, Typography } from "@mui/material";
 import { IChangeEvent } from "@rjsf/core";
@@ -18,6 +18,7 @@ import { showToastMessage } from "./Toastify";
 import { createCohort } from "@/services/CohortService/cohortService";
 import useSubmittedButtonStore from "@/utils/useSharedState";
 import FrameworkCategories from "./FrameworkCategories";
+import { useQuery } from "@tanstack/react-query";
 
 interface CustomField {
   fieldId: string;
@@ -84,6 +85,14 @@ const AddNewCenters: React.FC<AddLearnerModalProps> = ({
   const setSubmittedButtonStatus = useSubmittedButtonStore(
     (state: any) => state.setSubmittedButtonStatus
   );
+
+
+  const { data:cohortFormData ,isLoading: cohortFormDataLoading, error :cohortFormDataError } = useQuery<any[]>({
+    queryKey: ["cohortFormData"],  
+    queryFn: () => Promise.resolve([]), 
+    staleTime: apiCatchingDuration.GETREADFORM,
+    enabled: false, 
+  });
   const [stateDefaultValueForCenter, setStateDefaultValueForCenter] =
     useState<string>("");
     const createCenterStatus = useSubmittedButtonStore(
@@ -121,27 +130,28 @@ const AddNewCenters: React.FC<AddLearnerModalProps> = ({
         }
       }
       try {
-        const response = await getFormRead("cohorts", "cohort");
-        console.log("sortedFields", response);
+    //    const response = await getFormRead("cohorts", "cohort");
+
+
 
-        if (response) {
-          const updatedFormResponse = removeHiddenFields(response);
+        if (cohortFormData) {
+          const updatedFormResponse = removeHiddenFields(cohortFormData);
           if (updatedFormResponse) {
             let { schema, uiSchema } = GenerateSchemaAndUiSchema(
               updatedFormResponse,
               t
             );
             setSchema(schema);
             setUiSchema(uiSchema);
-            setCustomFormData(response);
+            setCustomFormData(cohortFormData);
           }
         }
       } catch (error) {
         console.error("Error fetching form data:", error);
       }
     };
     getAddLearnerFormData();
-  }, []);
+  }, [cohortFormData]);
 
   const handleDependentFieldsChange = () => {
     setShowForm(true);

diff --git a/src/pages/centers.tsx b/src/pages/centers.tsx
@@ -13,12 +13,15 @@ import {
 } from "@/services/CohortService/cohortService";
 import {
   CohortTypes,
+  FormContext,
+  FormContextType,
   Numbers,
   QueryKeys,
   Role,
   SORT,
   Status,
   Storage,
+  apiCatchingDuration,
 } from "@/utils/app.constant";
 import EditIcon from "@mui/icons-material/Edit";
 import DeleteIcon from "@mui/icons-material/Delete";
@@ -41,7 +44,7 @@ import { IChangeEvent } from "@rjsf/core";
 import { RJSFSchema } from "@rjsf/utils";
 import DynamicForm from "@/components/DynamicForm";
 import useSubmittedButtonStore from "@/utils/useSharedState";
-import { useQueryClient } from "@tanstack/react-query";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { useRouter } from "next/router";
 type cohortFilterDetails = {
   type?: string;
@@ -118,6 +121,15 @@ const Center: React.FC = () => {
   const [isEditForm, setIsEditForm] = useState(false);
   const [statesInformation, setStatesInformation] = useState<any>([]);
   const [selectedRowData, setSelectedRowData] = useState<any>("");
+  const {
+    data: cohortFormData,
+    isLoading: cohortFormDataLoading,
+    error: cohortFormDataError,
+  } = useQuery<any>({
+    queryKey: ["cohortFormData"],
+    queryFn: () => getFormRead( FormContext.COHORTS, FormContextType.COHORT),
+    staleTime: apiCatchingDuration.GETREADFORM,
+  });
   const selectedBlockStore = useSubmittedButtonStore(
     (state: any) => state.selectedBlockStore
   );
@@ -303,10 +315,10 @@ finalResult?.forEach((item: any, index: number) => {
 
   const getFormData = async () => {
     try {
-      const res = await getFormRead("cohorts", "cohort");
-      if (res && res?.fields) {
-        const formDatas = res?.fields;
-        setFormData(formDatas);
+     // const res = await getFormRead("cohorts", "cohort");
+      if (cohortFormData && cohortFormData?.fields) {
+        const formData = cohortFormData?.fields;
+        setFormData(formData);
       } else {
         console.log("No response Data");
       }
@@ -359,9 +371,9 @@ const response=  await fetchCohortMemberList(data);
 
   const getAddCenterFormData = async () => {
     try {
-      const response = await getFormRead("cohorts", "cohort");
-      if (response) {
-        const { schema, uiSchema } = GenerateSchemaAndUiSchema(response, t);
+      //const response = await getFormRead("cohorts", "cohort");
+      if (cohortFormData) {
+        const { schema, uiSchema } = GenerateSchemaAndUiSchema(cohortFormData, t);
 
         setSchema(schema);
         setUiSchema(uiSchema);
@@ -738,11 +750,11 @@ const response=  await fetchCohortMemberList(data);
         offset: 0,
       };
       const resp = await getCohortList(data);
-      const formFields = await getFormRead("cohorts", "cohort");
+      //const formFields = await getFormRead("cohorts", "cohort");
 
       const cohortDetails = resp?.results?.cohortDetails?.[0] || {};
 
-      setEditFormData(mapFields(formFields, cohortDetails));
+      setEditFormData(mapFields(cohortFormData, cohortDetails));
       setLoading(false);
       setIsEditForm(true);
     }

diff --git a/src/utils/app.constant.ts b/src/utils/app.constant.ts
@@ -28,6 +28,8 @@ export enum Storage {
 }
 export enum FormContext {
   USERS = "USERS",
+  COHORTS="cohorts"
+
 }
 
 export enum FormContextType {
@@ -36,6 +38,7 @@ export enum FormContextType {
   TEAM_LEADER = "TEAM LEADER",
   ADMIN = "ADMIN",
   ADMIN_CENTER = "ADMIN_CENTER",
+  COHORT="cohort"
 }
 
 export enum RoleId {