organization code

src/app/(dashboard)/layout.tsx

@@ -24,7 +24,7 @@ export default function DashboardLayout({children}:{children: React.ReactNode})
     const pathname = usePathname();
     const dispatch = useAppDispatch();
     const filter = useAppSelector((state) => state.filter.filter);
-    const {data: orgMap } = useGetOrganizationsMapQuery();
+    const {data: orgMap, isLoading: isLoadingOrgMap } = useGetOrganizationsMapQuery();
     const {data: filterOptions } = useGetFilterOptionsQuery(filter);
     const [region, setRegion] = React.useState("");
     const { t } = useLocale();
@@ -61,6 +61,12 @@ export default function DashboardLayout({children}:{children: React.ReactNode})
             dispatch(setFilter({...filter, end_date: newEndDate}));
         }
     };
+
+    if (isLoadingOrgMap) return (
+        <div className="flex justify-center items-center h-screen">
+            <RefreshCcw className="animate-spin h-12 w-12 text-white" />
+        </div>
+    )
     
     return (
         <NeedLoginRoute role="Dashboard">

src/services/api.ts

@@ -3,58 +3,82 @@ import { AttendanceRange, AttendanceSummary, CostData, EmployeeMovement, Employe
 import { Response , Filter} from './types'
 import { config } from '@/config';
 
+
+let valueToSap: Record<string, string> = {}
+let sapToValue: Record<string, string> = {}
+
+const deepClone = (obj: any) => JSON.parse(JSON.stringify(obj))
 const rawBaseQuery = fetchBaseQuery({ baseUrl: config.api.baseApiUrl });
-const baseQuery = async (args:any, api:any, extraOptions:any) => {
-  const result = await rawBaseQuery(args, api, extraOptions)
+const translatedBaseQuery: typeof rawBaseQuery = async (args, api, extraOptions) => {
+  const request =
+    typeof args === 'string'
+      ? { url: args }
+      : { ...(args as any), params: args.params ? { ...args.params } : undefined }
 
-  if (result.data && typeof args === 'object' && typeof args.url === 'string') {
-    const url = args.url
+  const url = request.url
+  const isDashboard = url?.startsWith('/dashboard') && url !== '/dashboard/filter-options'
 
-    // Match /dashboard/* but exclude /dashboard/filter-options
-    const shouldTranslate =
-      url.startsWith('/dashboard') && !url.startsWith('/dashboard/filter-options')
+  // Build mapping dictionaries from organizations map in state
+  const orgMapPre = (api.getState() as any).api.queries['getOrganizationsMap(undefined)']?.data ?? []
+  if (Array.isArray(orgMapPre) && orgMapPre.length) {
+    valueToSap = {}
+    sapToValue = {}
+    orgMapPre.forEach((org: OrganizationMap) => {
+      valueToSap[org.value] = org.sap_code
+      sapToValue[org.sap_code] = org.value
+    })
+  }
 
-    if (shouldTranslate) {
-      // Get cached organization map data
-      const orgMap =
-        api.getState().api.queries['getOrganizationsMap(undefined)']?.data ?? []
+  // === Translate REQUEST (value -> sap_code) ===
+  if (isDashboard) {
+    // ✅ Case 1: params object exists
+    if (request.params?.organization_code) {
+      const mapped = String(request.params.organization_code)
+        .split(',')
+        .map((o) => valueToSap[o] ?? o)
+        .join(',')
+      request.params = { ...request.params, organization_code: mapped }
+    } else if (url.includes('organization_code=')) {
+      const u = new URL(url, 'http://dummy')
+      const orgs = u.searchParams.get('organization_code')?.split(',') ?? []
+      const mapped = orgs.map((o) => valueToSap[o] ?? o)
+      u.searchParams.set('organization_code', mapped.join(','))
+      request.url = u.pathname + '?' + u.searchParams.toString()
+    }
+  }
 
-      if (orgMap.length > 0) {
-        // Build a fast lookup table for translation
-        const orgLookup = Object.fromEntries(
-          orgMap.map((org: OrganizationMap) => [org.value, org.sap_code || org.value])
-        )
 
-        // Helper: recursively find and translate organization_code
-        const translateOrgCode = (obj: any): any => {
-            if (Array.isArray(obj)) return obj.map(translateOrgCode)
-            if (obj && typeof obj === 'object') {
-                const newObj: Record<string, any> = {}
-                for (const [key, val] of Object.entries(obj)) {
-                if (key === 'organization_code' && typeof val === 'string') {
-                    // ✅ Find by sap_code and replace with its value
-                    const mappedOrg = orgMap.find((org: any) => org.sap_code === val)
-                    newObj[key] = mappedOrg?.value || val
-                } else {
-                    newObj[key] = translateOrgCode(val)
-                }
-                }
-                return newObj
+  // 2️⃣ Do the request
+  const result = await rawBaseQuery(request, api, extraOptions)
+  const orgMap = (api.getState() as any).api.queries['getOrganizationsMap(undefined)']?.data ?? []
+  const translateOrgCode = (obj: any): any => {
+          if (Array.isArray(obj)) return obj.map(translateOrgCode)
+          if (obj && typeof obj === 'object') {
+            const newObj: Record<string, any> = {}
+            for (const [key, val] of Object.entries(obj)) {
+              if (key === 'organization_code' && typeof val === 'string') {
+                const mappedOrg = orgMap.find((org: any) => org.sap_code === val)
+                newObj[key] = mappedOrg?.value || val
+              } else {
+                newObj[key] = translateOrgCode(val)
+              }
             }
-            return obj
+            return newObj
+          }
+          return obj
         }
 
 
-        result.data = translateOrgCode(result.data)
-      }
-    }
+  // 3️⃣ Translate RESPONSE (sap_code -> value)
+  if (isDashboard && result.data) {
+    result.data = translateOrgCode(result.data)
   }
 
   return result
 }
 
 export const api = createApi({
-    baseQuery,
+    baseQuery: translatedBaseQuery,
     endpoints: (builder) => ({
         login: builder.mutation<{
             user: User;