@applica-software-guru/react-admin 1.5.356 → 1.5.357

package/package.json

@@ -108,5 +108,5 @@
   "type": "module",
   "types": "dist/index.d.ts",
   "typings": "dist/index.d.ts",
-  "version": "1.5.356"
+  "version": "1.5.357"
 }

package/src/components/ra-lists/ListTabsToolbar.tsx

@@ -20,7 +20,7 @@ interface ListTabsToolbarProps {
 
 function ListTabsToolbar(props: ListTabsToolbarProps) {
   const { tabs = [] } = props;
-  const { setFilters, filterValues } = useListContext();
+  const { setFilters, filterValues, displayedFilters } = useListContext();
   const defaultTabIndex = useMemo(() => tabs.findIndex((tab) => tab.default) ?? 0, [tabs]);
   const { setCurrentTabKey } = useListViewContext();
   const resource = useResourceContext();
@@ -33,22 +33,59 @@ function ListTabsToolbar(props: ListTabsToolbarProps) {
   }
 
   const tabGroupKey = useMemo(() => `${resource.replace(/^entities\//, '')}-tab-group`, [resource]);
+  const tabFiltersKey = useMemo(() => `${resource.replace(/^entities\//, '')}-tab-filters`, [resource]);
 
   const [currentTab, setCurrentTab] = useSessionStorage(tabGroupKey, defaultTabIndex);
+  const [tabFilterStates, setTabFilterStates] = useSessionStorage(tabFiltersKey, {});
   const initialized = useRef(false);
 
+  const saveCurrentTabFilters = useCallback(
+    (tabKey: string) => {
+      const currentState = {
+        filterValues: { ...filterValues },
+        displayedFilters: { ...displayedFilters }
+      };
+
+      setTabFilterStates((prev: any) => ({
+        ...prev,
+        [tabKey]: currentState
+      }));
+    },
+    [filterValues, displayedFilters, setTabFilterStates]
+  );
+
+  const restoreTabFilters = useCallback(
+    (tabKey: string, tabFilter: Record<string, any>, debounce: boolean) => {
+      const savedState = (tabFilterStates as any)?.[tabKey];
+
+      if (savedState) {
+        setFilters(savedState.filterValues, savedState.displayedFilters || {}, debounce);
+      } else {
+        const defaultFilters = {
+          ...tabFilter
+        };
+        setFilters(defaultFilters, {}, debounce);
+      }
+    },
+    [tabFilterStates, setFilters]
+  );
+
   const buildFilters = useCallback(
-    (index: number, debounce: boolean) => {
+    (index: number, debounce: boolean, saveCurrentFilters: boolean = true) => {
+      const currentTabKey = tabs[Number(currentTab)]?.key;
+      const newTabKey = tabs[index].key;
+
+      if (saveCurrentFilters && currentTabKey && currentTabKey !== newTabKey) {
+        saveCurrentTabFilters(currentTabKey);
+      }
+
       if (setCurrentTabKey) {
-        setCurrentTabKey(tabs[index].key);
+        setCurrentTabKey(newTabKey);
       }
-      const newFilters = {
-        ...filterValues,
-        ...tabs[index].filter
-      };
-      setFilters(newFilters, {}, debounce);
+
+      restoreTabFilters(newTabKey, tabs[index].filter, debounce);
     },
-    [filterValues, setFilters, setCurrentTabKey, tabs]
+    [tabs, currentTab, saveCurrentTabFilters, setCurrentTabKey, restoreTabFilters]
   );
 
   const updateUrlParam = useCallback(
@@ -77,7 +114,7 @@ function ListTabsToolbar(props: ListTabsToolbarProps) {
         setCurrentTab(initialIndex);
       }
 
-      buildFilters(initialIndex, false);
+      buildFilters(initialIndex, false, false);
       initialized.current = true;
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -86,7 +123,7 @@ function ListTabsToolbar(props: ListTabsToolbarProps) {
   const handleChange = useCallback(
     (_: any, newIndex: number) => {
       setCurrentTab(newIndex);
-      buildFilters(newIndex, true);
+      buildFilters(newIndex, true, true);
     },
     [buildFilters, setCurrentTab]
   );