refactor(FE): Refactor tab store to use a unified ReportTabStore

src/stores/report/finance-tab/finance-tab.store.ts

@@ -1,51 +0,0 @@
-'use client';
-
-import { ReactNode } from 'react';
-import { create } from 'zustand';
-import { devtools } from 'zustand/middleware';
-
-export type FinanceTabActionsSlice = {
-  // State - actions per tab ID
-  tabActions: Record<string, ReactNode>;
-
-  // Actions
-  setTabActions: (tabId: string, actions: ReactNode) => void;
-  clearTabActions: (tabId: string) => void;
-  clearAllTabActions: () => void;
-};
-
-export const useFinanceTabStore = create<FinanceTabActionsSlice>()(
-  devtools(
-    (set) => ({
-      tabActions: {},
-
-      setTabActions: (tabId, actions) =>
-        set(
-          (state) => ({
-            tabActions: {
-              ...state.tabActions,
-              [tabId]: actions,
-            },
-          }),
-          false,
-          'setTabActions'
-        ),
-
-      clearTabActions: (tabId) =>
-        set(
-          (state) => {
-            const { [tabId]: _, ...rest } = state.tabActions;
-            return { tabActions: rest };
-          },
-          false,
-          'clearTabActions'
-        ),
-
-      clearAllTabActions: () =>
-        set({ tabActions: {} }, false, 'clearAllTabActions'),
-    }),
-    {
-      name: 'FinanceTabStore',
-    }
-  )
-);

src/stores/report/logistic-stock-tab/logistic-stock-tab.store.ts

@@ -1,51 +0,0 @@
-'use client';
-
-import { ReactNode } from 'react';
-import { create } from 'zustand';
-import { devtools } from 'zustand/middleware';
-
-export type LogisticStockTabActionsSlice = {
-  // State - actions per tab ID
-  tabActions: Record<string, ReactNode>;
-
-  // Actions
-  setTabActions: (tabId: string, actions: ReactNode) => void;
-  clearTabActions: (tabId: string) => void;
-  clearAllTabActions: () => void;
-};
-
-export const useLogisticStockTabStore = create<LogisticStockTabActionsSlice>()(
-  devtools(
-    (set) => ({
-      tabActions: {},
-
-      setTabActions: (tabId, actions) =>
-        set(
-          (state) => ({
-            tabActions: {
-              ...state.tabActions,
-              [tabId]: actions,
-            },
-          }),
-          false,
-          'setTabActions'
-        ),
-
-      clearTabActions: (tabId) =>
-        set(
-          (state) => {
-            const { [tabId]: _, ...rest } = state.tabActions;
-            return { tabActions: rest };
-          },
-          false,
-          'clearTabActions'
-        ),
-
-      clearAllTabActions: () =>
-        set({ tabActions: {} }, false, 'clearAllTabActions'),
-    }),
-    {
-      name: 'LogisticStockTabStore',
-    }
-  )
-);

src/stores/report/marketing-tab/marketing-tab.store.ts

@@ -1,51 +0,0 @@
-'use client';
-
-import { ReactNode } from 'react';
-import { create } from 'zustand';
-import { devtools } from 'zustand/middleware';
-
-export type MarketingTabActionsSlice = {
-  // State - actions per tab ID
-  tabActions: Record<string, ReactNode>;
-
-  // Actions
-  setTabActions: (tabId: string, actions: ReactNode) => void;
-  clearTabActions: (tabId: string) => void;
-  clearAllTabActions: () => void;
-};
-
-export const useMarketingTabStore = create<MarketingTabActionsSlice>()(
-  devtools(
-    (set) => ({
-      tabActions: {},
-
-      setTabActions: (tabId, actions) =>
-        set(
-          (state) => ({
-            tabActions: {
-              ...state.tabActions,
-              [tabId]: actions,
-            },
-          }),
-          false,
-          'setTabActions'
-        ),
-
-      clearTabActions: (tabId) =>
-        set(
-          (state) => {
-            const { [tabId]: _, ...rest } = state.tabActions;
-            return { tabActions: rest };
-          },
-          false,
-          'clearTabActions'
-        ),
-
-      clearAllTabActions: () =>
-        set({ tabActions: {} }, false, 'clearAllTabActions'),
-    }),
-    {
-      name: 'MarketingTabStore',
-    }
-  )
-);

src/stores/report/report-tab.store.ts

@@ -0,0 +1,18 @@
+'use client';
+
+import { create } from 'zustand';
+import { devtools } from 'zustand/middleware';
+import { createReportTabSlice, ReportTabSlice } from '@/stores/report/slices/report-tab.slice';
+
+export type ReportTabStore = ReportTabSlice;
+
+export const useReportTabStore = create<ReportTabStore>()(
+  devtools(
+    (...args) => ({
+      ...createReportTabSlice(...args),
+    }),
+    {
+      name: 'ReportTabStore',
+    }
+  )
+);

src/stores/report/slices/report-tab.slice.ts

@@ -0,0 +1,37 @@
+import { ReactNode } from 'react';
+import { StateCreator } from 'zustand';
+
+export type ReportTabSlice = {
+  // State - actions per tab ID
+  tabActions: Record<string, ReactNode>;
+
+  // Actions
+  setTabActions: (tabId: string, actions: ReactNode) => void;
+  clearTabActions: (tabId: string) => void;
+  clearAllTabActions: () => void;
+};
+
+export const createReportTabSlice: StateCreator<
+  ReportTabSlice,
+  [],
+  [],
+  ReportTabSlice
+> = (set) => ({
+  tabActions: {},
+
+  setTabActions: (tabId, actions) =>
+    set((state) => ({
+      tabActions: {
+        ...state.tabActions,
+        [tabId]: actions,
+      },
+    })),
+
+  clearTabActions: (tabId) =>
+    set((state) => {
+      const { [tabId]: _, ...rest } = state.tabActions;
+      return { tabActions: rest };
+    }),
+
+  clearAllTabActions: () => set({ tabActions: {} }),
+});