rez-table-listing-mui 1.3.10 → 1.3.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rez-table-listing-mui",
-  "version": "1.3.10",
+  "version": "1.3.12",
   "type": "module",
   "description": "A rez table listing component built on TanStack Table",
   "main": "dist/index.js",

package/src/listing/components/filter/components/saved-filter.tsx

@@ -39,22 +39,20 @@ const SavedFilter = ({
     return () => {
       const editModeFromTabOptions =
         filterComponentOptions?.tabOptions?.savedFilter?.editMode;
-
-      setFilterMaster(
-        (prev) =>
-          ({
-            ...prev,
-            saved_filters: {
-              ...prev?.attributes,
-              selectedId: "",
-              selectedName: "",
-              selectedCode: "",
-            },
-          } as FilterMasterStateProps)
-      );
-
       if (!editModeFromTabOptions) {
         setEditMode && setEditMode(false);
+        setFilterMaster(
+          (prev) =>
+            ({
+              ...prev,
+              saved_filters: {
+                ...prev?.attributes,
+                selectedId: "",
+                selectedName: "",
+                selectedCode: "",
+              },
+            } as FilterMasterStateProps)
+        );
       }
     };
   }, []);

package/src/listing/components/filter/index.tsx

@@ -446,7 +446,9 @@ export function TableFilter({
 
                   onUpdateFilter && onUpdateFilter(inputValue || "");
                   setSaveFilterModalOpen(false);
-                  setEditMode(false);
+                  let isSingleSavedFilterEditMode =
+                    filterComponentOptions?.tabOptions?.savedFilter?.editMode;
+                  if (!isSingleSavedFilterEditMode) setEditMode(false);
                   return;
                 }
 
@@ -500,7 +502,11 @@ export function TableFilter({
               onClick: () => {
                 onDeleteFilter && onDeleteFilter();
                 setDeleteFilterModalOpen(false);
-                setEditMode && setEditMode(false);
+                let isSingleSavedFilterEditMode =
+                  filterComponentOptions?.tabOptions?.savedFilter?.editMode;
+                if (!isSingleSavedFilterEditMode) {
+                  setEditMode && setEditMode(false);
+                }
               },
               variant: "contained",
               sx: {

package/src/listing/libs/hooks/useEntityTableAPI.tsx

@@ -21,6 +21,7 @@ import {
   saveSettingsData,
   updateSavedFilter,
   viewSettingsDropDown,
+  getOperationList,
 } from "../utils/apiColumn";
 import {
   FilterDataMainFilterEntityListProps,
@@ -355,3 +356,13 @@ export const useGetFilterEntityListAndCriteria = ({
 
   return { filterEntityList, filterEntityWiseCriteria };
 };
+
+export const useGetOperationList = () => {
+  // First query to get meta data
+  const operationList = useQuery({
+    queryKey: ["operationList"],
+    queryFn: () => getOperationList(),
+  });
+
+  return { operationList };
+};

package/src/listing/libs/utils/apiColumn.ts

@@ -185,3 +185,8 @@ export const getFilterCriteriaByEntity = async (
 
   return response.data;
 };
+
+export const getOperationList = async () => {
+  const response = await api.post(`/meta/operation-list`);
+  return response.data;
+};

package/src/listing/libs/utils/hydrate-saved-filters.ts

@@ -0,0 +1,26 @@
+import { FilterStateProps, OperationList } from "../../types/filter";
+
+export const hydrateSavedFilters = async (
+  savedFilters: FilterStateProps[],
+  operationList: OperationList
+) => {
+  return savedFilters.map((filter) => {
+    // const attribute = tableStates..find(
+    //   (attr) => attr.attribute_key === filter.filter_attribute
+    // );
+    if (typeof filter.filter_attribute_data_type === "undefined") {
+      return {
+        ...filter,
+        dropdown_list: [],
+      };
+    }
+
+    const matchingDropdownList =
+      operationList[filter.filter_attribute_data_type] || [];
+
+    return {
+      ...filter,
+      dropdown_list: matchingDropdownList,
+    };
+  });
+};

package/src/listing/types/filter.ts

@@ -194,6 +194,20 @@ export interface FilterStateProps {
   datasource_list?: string | null;
 }
 
+export interface OperationOption {
+  label: string;
+  value: string;
+}
+
+export interface OperationList {
+  text: OperationOption[];
+  number: OperationOption[];
+  date: OperationOption[];
+  select: OperationOption[];
+  multiselect: OperationOption[];
+  year: OperationOption[];
+}
+
 export interface createSavedFilterPayload {
   name: string;
   organization_id?: number;

package/src/view/ListingView.tsx

@@ -10,6 +10,7 @@ import { ENTITY_TYPE, MAPPED_ENTITY_TYPE } from "../listing/libs/utils/common";
 import {
   useCommonFilterDropdownAPI,
   useEntityTableAPI,
+  useGetOperationList,
   useGetSettingsDataAPI,
   useSaveSettingsDataAPI,
   useSettingsDropDownAPI,
@@ -22,6 +23,7 @@ import { TableTabs } from "../listing/components/tabs";
 import { QuickFilterSettings } from "../listing/components/table-settings";
 import CraftTableFilterWrapper from "./FIlterWrapper";
 import { saveLayoutAPI } from "../listing/libs/services/saveLayoutAPI";
+import { hydrateSavedFilters } from "../listing/libs/utils/hydrate-saved-filters";
 
 function ListingView() {
   // const [mockLoading, setMockLoading] = useState<boolean>(true);
@@ -49,6 +51,7 @@ function ListingView() {
       : metaQuery?.data?.default_filter?.value
   );
   const { saveSettingsDataMutation } = useSaveSettingsDataAPI(ENTITY_TYPE);
+  const { operationList } = useGetOperationList();
 
   // const { dropdownData } = useCommonDropdownAPI(
   //   dropdownColumnList || metaQuery.data.column_list
@@ -139,8 +142,23 @@ function ListingView() {
     fetchMeta();
   }, [selectedTab]);
 
+  // useEffect(() => {
+  //   setFilters(detailsQuery.data ?? []);
+  // }, [detailsQuery.data]);
+
   useEffect(() => {
-    setFilters(detailsQuery.data ?? []);
+    const setFilterDropdown = async () => {
+      if (Array.isArray(detailsQuery.data)) {
+        const hydrated = await hydrateSavedFilters(
+          detailsQuery.data,
+          operationList.data
+        );
+        setFilters(hydrated);
+      } else {
+        setFilters([]);
+      }
+    };
+    setFilterDropdown();
   }, [detailsQuery.data]);
 
   useEffect(() => {
@@ -307,7 +325,7 @@ function ListingView() {
             onChangeFunction={handleChangeFunction}
             filterComponentOptions={{
               showMainHeader: false,
-              showTabs: false,
+              showTabs: true,
               isRuleEngine: true,
               tabOptions: {
                 mainFilter: {