fixed total number of suppliers

client/next.config.js

@@ -8,12 +8,22 @@ const nextConfig = {
     return [
       {
         source: '/',
-        destination: '/analysis/map',
+        destination: '/eurd',
         permanent: false,
       },
       {
         source: '/analysis',
-        destination: '/analysis/map',
+        destination: '/eudr',
+        permanent: false,
+      },
+      {
+        source: '/analysis/:id',
+        destination: '/eudr',
+        permanent: false,
+      },
+      {
+        source: '/data',
+        destination: '/eurd',
         permanent: false,
       },
       {

client/src/containers/analysis-eudr/supplier-list-table/table/index.tsx

@@ -22,8 +22,8 @@ import {
   TableCell,
 } from '@/components/ui/table';
 import { useEUDRData } from '@/hooks/eudr';
-import { useAppSelector } from '@/store/hooks';
-import { eudr } from '@/store/features/eudr';
+import { useAppSelector, useAppDispatch } from '@/store/hooks';
+import { eudr, setTotalSuppliers } from '@/store/features/eudr';
 
 import type {
   // ColumnFiltersState,
@@ -50,6 +50,7 @@ export interface Supplier {
 }
 
 const SuppliersListTable = (): JSX.Element => {
+  const dispatch = useAppDispatch();
   // const [rowSelection, setRowSelection] = useState({});
   // const [columnVisibility, setColumnVisibility] = useState<VisibilityState>({});
   // const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([]);
@@ -68,6 +69,9 @@ const SuppliersListTable = (): JSX.Element => {
     },
     {
       select: (data) => data?.table,
+      onSuccess: (data) => {
+        dispatch(setTotalSuppliers(data?.length || 0));
+      },
     },
   );
 

client/src/containers/analysis-eudr/suppliers-stacked-bar/component.tsx

@@ -38,6 +38,7 @@ const TOOLTIP_LABELS = {
 const SuppliersStackedBar = () => {
   const {
     viewBy,
+    totalSuppliers,
     filters: { dates, suppliers, origins, materials },
   } = useAppSelector(eudr);
   const dispatch = useAppDispatch();
@@ -92,7 +93,7 @@ const SuppliersStackedBar = () => {
     <div className="space-y-4">
       <div>
         <div className="text-xs text-gray-400">
-          Total numbers of suppliers: <span className="font-mono">{parsedData?.length || '-'}</span>
+          Total numbers of suppliers: <span>{totalSuppliers}</span>
         </div>
         <div className="flex items-center justify-between">
           <h3>Suppliers by category</h3>

client/src/store/features/eudr/index.ts

@@ -19,6 +19,7 @@ type LayerConfiguration = {
 
 export type EUDRState = {
   viewBy: (typeof VIEW_BY_OPTIONS)[number]['value'];
+  totalSuppliers: number;
   filters: {
     materials: Option[];
     origins: Option[];
@@ -39,6 +40,7 @@ export type EUDRState = {
 
 export const initialState: EUDRState = {
   viewBy: 'materials',
+  totalSuppliers: 0,
   filters: {
     materials: [],
     origins: [],
@@ -91,6 +93,10 @@ export const EUDRSlice = createSlice({
       ...state,
       viewBy: action.payload,
     }),
+    setTotalSuppliers: (state, action: PayloadAction<EUDRState['totalSuppliers']>) => ({
+      ...state,
+      totalSuppliers: action.payload,
+    }),
     setFilters: (state, action: PayloadAction<Partial<EUDRState['filters']>>) => ({
       ...state,
       filters: {
@@ -141,6 +147,7 @@ export const EUDRSlice = createSlice({
 
 export const {
   setViewBy,
+  setTotalSuppliers,
   setFilters,
   setBasemap,
   setSupplierLayer,