From bd2a4ff233e492f199b06a2fcc38e3ed7198ef2c Mon Sep 17 00:00:00 2001
From: Raja Oktafrianto <rajaoktafrianto3.com>
Date: Mon, 17 Mar 2025 06:18:43 +0700
Subject: [PATCH 01/19] search aldeias sucos master

---
 src/pages/master/sucos/SucosMaster.tsx        |   2 +
 src/pages/master/sucos/blocks/ListToolbar.tsx |   2 +-
 .../master/sucos/blocks/SearchDialog.tsx      | 183 ++++++++
 .../master/sucos/hooks/ManageSucosContext.tsx |  70 ++-
 .../sucos/hooks/useManageSucosContext.tsx     |   3 +-
 yarn.lock                                     | 402 +++++++++++++-----
 6 files changed, 536 insertions(+), 126 deletions(-)
 create mode 100644 src/pages/master/sucos/blocks/SearchDialog.tsx

diff --git a/src/pages/master/sucos/SucosMaster.tsx b/src/pages/master/sucos/SucosMaster.tsx
index 9accaf9..15043dc 100644
--- a/src/pages/master/sucos/SucosMaster.tsx
+++ b/src/pages/master/sucos/SucosMaster.tsx
@@ -3,6 +3,7 @@ import { ManageSucosContextProvider } from './hooks/ManageSucosContext';
 import AddDialog from './blocks/AddDialog';
 import EditDialog from './blocks/EditDialog';
 import DeleteDialog from './blocks/DeleteDialog';
+import SearchDialog from './blocks/SearchDialog';
 
 const SucosMaster = () => {
   return (
@@ -15,6 +16,7 @@ const SucosMaster = () => {
         <AddDialog />
         <EditDialog />
         <DeleteDialog />
+        <SearchDialog />
       </Container>
     </ManageSucosContextProvider>
   );
diff --git a/src/pages/master/sucos/blocks/ListToolbar.tsx b/src/pages/master/sucos/blocks/ListToolbar.tsx
index f0a23b8..2c359c6 100644
--- a/src/pages/master/sucos/blocks/ListToolbar.tsx
+++ b/src/pages/master/sucos/blocks/ListToolbar.tsx
@@ -38,7 +38,7 @@ const ListToolbar = () => {
               className="h-7.5 text-[0.8rem]"
               onClick={() => handleSearchDialog(true)}
             >
-              Search Sucos
+              Search Aldeias
             </Button>
           </div>
           <div className="flex gap-3 items-center">
diff --git a/src/pages/master/sucos/blocks/SearchDialog.tsx b/src/pages/master/sucos/blocks/SearchDialog.tsx
new file mode 100644
index 0000000..138cbec
--- /dev/null
+++ b/src/pages/master/sucos/blocks/SearchDialog.tsx
@@ -0,0 +1,183 @@
+import { useContext, useEffect, useRef, useState } from 'react';
+import {
+  Dialog,
+  DialogBody,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle
+} from '@/components/ui/dialog';
+import { Alert, KeenIcon } from '@/components';
+import { Input } from '@/components/ui/input';
+import { Button } from '@/components/ui/button';
+import { apiConfig } from '@/config/api.config';
+import axios from 'axios';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from '@/components/ui/select';
+import { useManageSucosContext } from '../hooks/useManageSucosContext';
+
+interface AldeiasProps {
+  id: number;
+  name: string;
+}
+
+const API_URL = apiConfig.service_master_data;
+
+const SearchDialog = () => {
+  const parentRef = useRef<any | null>(null);
+  const { showSearchDialog, handleSearchDialog, sucos } = useManageSucosContext();
+  console.log('Sucos:', sucos);
+  // const { sucos, getSucosLists } = useContext(ManageSucosContext);
+
+  // useEffect(() => {
+  //   getSucosLists(1, 1000, [], []); // Memuat semua sucos
+  // }, []);
+
+  const [alert, setAlert] = useState({
+    show: false,
+    message: ''
+  });
+  const initialState = {
+    id: 0,
+    name: ''
+  };
+
+  const [formField, setFormField] = useState(initialState);
+  const resetForm = () => {
+    setFormField(initialState);
+  };
+  const [aldeias, setAldeias] = useState<AldeiasProps[]>([]);
+  const [isFound, setIsFound] = useState(false);
+
+  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    const id = Number(formField.id);
+
+    if (formField.id === 0) {
+      setAlert({ show: true, message: 'Please fill name field.' });
+      return;
+    }
+
+    try {
+      const response = await axios.get(`${API_URL}/sucos/aldeias/${id}`);
+
+      if (response.data.status) {
+        setAldeias(response.data.data);
+        setIsFound(true);
+        console.log('Found aldeias: ', response.data.data);
+      } else {
+        setAldeias([]);
+        setIsFound(false);
+        setAlert({ show: true, message: 'No aldeias found.' });
+      }
+    } catch (error) {
+      console.error('Error fetching aldeias', error);
+      setAlert({ show: true, message: 'Failed to fetch aldeias. Please try again.' });
+    }
+    setAlert({ show: false, message: '' });
+  };
+
+  const handleReset = () => {
+    setFormField(initialState);
+    setIsFound(false);
+    setAldeias([]);
+  };
+  // console.log(aldeias);
+  return (
+    <Dialog open={showSearchDialog} onOpenChange={(open) => handleSearchDialog(open)}>
+      <DialogContent className="container-fixed max-w-[700px] flex flex-col p-5 overflow-hidden [&>button]:hidden">
+        <DialogTitle></DialogTitle>
+        <DialogDescription></DialogDescription>
+        <DialogHeader className="p-2 border-0">
+          <div className="flex items-center justify-between flex-wrap grow">
+            <div className="flex flex-col justify-center">
+              <h1 className="text-xl font-semibold leading-none text-gray-900">Search Aldeias</h1>
+              <div className="flex items-center gap-2 text-sm font-normal text-gray-700"></div>
+            </div>
+            <div
+              className="cursor-pointer hover:opacity-100 opacity-50"
+              onClick={() => {
+                handleSearchDialog(false);
+                resetForm();
+              }}
+            >
+              <KeenIcon icon="cross" className="text-1.5xl" />
+            </div>
+          </div>
+        </DialogHeader>
+        <DialogBody className="scrollable-y px-0 pb-0" ref={parentRef}>
+          <div className="flex flex-col px-0">
+            {alert.show && (
+              <Alert variant="danger" className="mb-5">
+                {alert.message}
+              </Alert>
+            )}
+            <form action="" onSubmit={handleSubmit}>
+              <div className="card-body grid-cols-6 gap-5 p-0">
+                <div className="grid grid-cols-8 gap-2 w-full items-center">
+                  <label className="form-label flex items-center gap-1 col-span-2">
+                    Sucos Name<span className="text-red-500">*</span>
+                  </label>
+
+                  <Select
+                    value={formField.id?.toString() ?? ''}
+                    onValueChange={(target) => {
+                      const selectedSuco = sucos.find((m) => m.id.toString() === target);
+                      if (selectedSuco) {
+                        setFormField({
+                          ...formField,
+                          id: selectedSuco.id,
+                          name: selectedSuco.name
+                        });
+                      }
+                    }}
+                  >
+                    <SelectTrigger className="col-span-6">
+                      <SelectValue placeholder="Select Sucos" />
+                    </SelectTrigger>
+
+                    <SelectContent>
+                      {sucos?.map((suco) => (
+                        <SelectItem key={suco.id} value={suco.id}>
+                          {suco.name}
+                        </SelectItem>
+                      ))}
+                    </SelectContent>
+                  </Select>
+                </div>
+
+                {isFound && aldeias.length > 0 && (
+                  <div className="mt-4 border-t pt-4">
+                    <h2 className="text-md font-semibold">Aldeias: </h2>
+                    <br />
+                    <div className="flex flex-col">
+                      <span className="text-sm form-hint">
+                        {aldeias.map((aldeiasID) => aldeiasID.name).join(', ')}
+                      </span>
+                    </div>
+                  </div>
+                )}
+
+                <div className="flex justify-end pt-2.5 gap-5 col-span-6">
+                  <Button variant={'outline'} type="reset" onClick={handleReset}>
+                    Reset
+                  </Button>
+                  <Button variant={'default'} type="submit">
+                    Search
+                  </Button>
+                </div>
+              </div>
+            </form>
+          </div>
+        </DialogBody>
+      </DialogContent>
+    </Dialog>
+  );
+};
+
+export default SearchDialog;
diff --git a/src/pages/master/sucos/hooks/ManageSucosContext.tsx b/src/pages/master/sucos/hooks/ManageSucosContext.tsx
index 5151803..682eb78 100644
--- a/src/pages/master/sucos/hooks/ManageSucosContext.tsx
+++ b/src/pages/master/sucos/hooks/ManageSucosContext.tsx
@@ -5,6 +5,8 @@ import { useCallApi } from '@/hooks';
 import { ColumnDef } from '@tanstack/react-table';
 import React, { createContext, useCallback, useMemo, useState } from 'react';
 import ListToolbar from '../blocks/ListToolbar';
+import { useNavigate } from 'react-router';
+import axios from 'axios';
 
 interface SucosProps {
   id: number;
@@ -34,15 +36,15 @@ interface ContextProps {
 const initialProps: ContextProps = {
   sucos: [],
   showSearchDialog: false,
-  handleSearchDialog: () => {},
+  handleSearchDialog: (show: boolean) => {},
   showEditDialog: false,
-  handleEditDialog: () => {},
+  handleEditDialog: (show: boolean, selected_sucos: string | null) => {},
   showAddDialog: false,
-  handleAddDialog: () => {},
+  handleAddDialog: (show: boolean) => {},
   showDeleteDialog: false,
-  handleDeleteDialog: () => {},
+  handleDeleteDialog: (show: boolean, selected_sucos: string | null) => {},
   selectedSucos: null,
-  getSucosLists: async () => undefined
+  getSucosLists: async () => ({ data: [], totalCount: 0 })
 };
 
 const ManageSucosContext = createContext<ContextProps>(initialProps);
@@ -56,6 +58,7 @@ const ManageSucosContextProvider = ({ children }: { children: React.ReactNode })
   const [showDeleteDialog, setShowDeleteDialog] = useState(false);
   const [selectedSucos, setSelectedSucos] = useState<string | null>(null);
   const { GetData } = useCallApi();
+  const navigate = useNavigate();
 
   const handleSearchDialog = useCallback((show: boolean) => {
     setShowSearchDialog(show);
@@ -75,6 +78,10 @@ const ManageSucosContextProvider = ({ children }: { children: React.ReactNode })
     setShowDeleteDialog(show);
   }, []);
 
+  const handleNavigate = (path: string) => {
+    const url = navigate(`${API_URL}/sucos/aldeias/${path}`);
+  };
+
   const columns = useMemo<ColumnDef<any>[]>(
     () => [
       {
@@ -145,22 +152,67 @@ const ManageSucosContextProvider = ({ children }: { children: React.ReactNode })
       sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
       filter = filter.length == 0 ? {} : { any: filter[0].value?.toLowerCase() };
       const response = await GetData(`${API_URL}/sucos/list`, {
-        limit,
+        limit: limit,
         page: page + 1,
         with_deleted: true,
         order_field: sorting[0].id,
         order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
         filter: JSON.stringify(filter)
       });
-      console.log(response?.data);
-      setSucos(response?.data.list);
-      // console.log(sucos);
+      console.log('Sucos List Response:', response?.data);
+      setSucos(response?.data.list || []); // Pastikan default value adalah array kosong
       return { data: response?.data.list, totalCount: response?.data.total_count };
     } catch (error) {
       console.error('Error fetching Sucos', error);
     }
   };
 
+  const getAldeiasBySucos = async (name: string) => {
+    try {
+      const response = await axios.get(`${API_URL}/sucos/aldeias/${name}`);
+      const data = response.data;
+      console.log(data);
+    } catch (error) {
+      console.log(`Error fetching sucos by ${name}`, error);
+    }
+  };
+
+  const createSucos = async (data: Partial<SucosProps>) => {
+    try {
+      await axios.post(`${API_URL}/sucos/create`, data);
+      // getMunicipiosLists(10, 1, false, 'name', 'ASC');
+    } catch (error) {
+      console.error('Error creating municipios', error);
+    }
+  };
+
+  const updateSucos = async (id: number, data: Partial<SucosProps>) => {
+    try {
+      await axios.put(`${API_URL}/sucos/update/${id}`, data);
+      // getSucosLists(10, 1, false, 'name', 'ASC');
+    } catch (error) {
+      console.error('Error updating sucos', error);
+    }
+  };
+
+  const deleteSucos = async (id: number, hardDelete?: boolean) => {
+    try {
+      await axios.delete(`${API_URL}/sucos/delete/${id}/${hardDelete}`);
+      // getSucosLists(10, 1, false, 'name', 'ASC');
+    } catch (error) {
+      console.error('Error deleting sucos', error);
+    }
+  };
+
+  const restoreSucos = async (id: number) => {
+    try {
+      await axios.put(`${API_URL}/sucos/restore/${id}`);
+      // getSucosLists(10, 1, false, 'name', 'ASC');
+    } catch (error) {
+      console.error('Error restoring sucos', error);
+    }
+  };
+
   return (
     <ManageSucosContext.Provider
       value={{
diff --git a/src/pages/master/sucos/hooks/useManageSucosContext.tsx b/src/pages/master/sucos/hooks/useManageSucosContext.tsx
index 194575a..8a956c8 100644
--- a/src/pages/master/sucos/hooks/useManageSucosContext.tsx
+++ b/src/pages/master/sucos/hooks/useManageSucosContext.tsx
@@ -4,7 +4,8 @@ import { ManageSucosContext } from './ManageSucosContext';
 const useManageSucosContext = () => {
   const context = useContext(ManageSucosContext);
 
-  if (!context) throw new Error('useManageSucosContext must be used within AuthProvider');
+  if (!context)
+    throw new Error('useManageSucosContext must be used within ManageSucosContextProvider');
 
   return context;
 };
diff --git a/yarn.lock b/yarn.lock
index 644ce57..f128329 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -39,7 +39,7 @@
   resolved "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.26.0.tgz"
   integrity sha512-qETICbZSLe7uXv9VE8T/RWOdIE5qqyTucOt4zLYMafj2MRO271VGgLd4RACJMeBO37UPWhXiKMBk7YlJ0fOzQA==
 
-"@babel/core@^7.0.0", "@babel/core@^7.0.0-0", "@babel/core@^7.25.2":
+"@babel/core@^7.25.2":
   version "7.26.0"
   resolved "https://registry.npmjs.org/@babel/core/-/core-7.26.0.tgz"
   integrity sha512-i1SLeK+DzNnQ3LL/CswPCa/E5u4lh1k6IAEphON8F+cXt0t9euTshDru0q7/IqMa1PMPz5RnHuHscF8/ZJsStg==
@@ -540,13 +540,6 @@
   resolved "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz"
   integrity sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==
 
-"@emotion/is-prop-valid@^1.3.0":
-  version "1.3.1"
-  resolved "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.3.1.tgz"
-  integrity sha512-/ACwoqx7XQi9knQs/G0qKvv5teDMhD7bXYns9N/wM8ah8iNb8jZ2uNO0YOgiq2o2poIvVtJS2YALasQuMSQ7Kw==
-  dependencies:
-    "@emotion/memoize" "^0.9.0"
-
 "@emotion/is-prop-valid@1.2.2":
   version "1.2.2"
   resolved "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.2.tgz"
@@ -554,6 +547,13 @@
   dependencies:
     "@emotion/memoize" "^0.8.1"
 
+"@emotion/is-prop-valid@^1.3.0":
+  version "1.3.1"
+  resolved "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.3.1.tgz"
+  integrity sha512-/ACwoqx7XQi9knQs/G0qKvv5teDMhD7bXYns9N/wM8ah8iNb8jZ2uNO0YOgiq2o2poIvVtJS2YALasQuMSQ7Kw==
+  dependencies:
+    "@emotion/memoize" "^0.9.0"
+
 "@emotion/memoize@^0.8.1":
   version "0.8.1"
   resolved "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.1.tgz"
@@ -564,7 +564,7 @@
   resolved "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz"
   integrity sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==
 
-"@emotion/react@^11.0.0-rc.0", "@emotion/react@^11.13.3", "@emotion/react@^11.4.1", "@emotion/react@^11.5.0":
+"@emotion/react@^11.13.3":
   version "11.13.3"
   resolved "https://registry.npmjs.org/@emotion/react/-/react-11.13.3.tgz"
   integrity sha512-lIsdU6JNrmYfJ5EbUCf4xW1ovy5wKQ2CkPRM4xogziOxH1nXxBSjpC9YqbFAP7circxMfYp+6x676BqWcEiixg==
@@ -594,7 +594,7 @@
   resolved "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.4.0.tgz"
   integrity sha512-fTBW9/8r2w3dXWYM4HCB1Rdp8NLibOw2+XELH5m5+AkWiL/KqYX6dc0kKYlaYyKjrQ6ds33MCdMPEwgs2z1rqg==
 
-"@emotion/styled@^11.13.0", "@emotion/styled@^11.3.0":
+"@emotion/styled@^11.13.0":
   version "11.13.0"
   resolved "https://registry.npmjs.org/@emotion/styled/-/styled-11.13.0.tgz"
   integrity sha512-tkzkY7nQhW/zC4hztlwucpT8QEZ6eUzpXDRhww/Eej4tFfO0FxQYWRyg/c5CCXa4d/f174kqeXYjuQRnhzf6dA==
@@ -606,16 +606,16 @@
     "@emotion/use-insertion-effect-with-fallbacks" "^1.1.0"
     "@emotion/utils" "^1.4.0"
 
-"@emotion/unitless@^0.10.0":
-  version "0.10.0"
-  resolved "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.10.0.tgz"
-  integrity sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==
-
 "@emotion/unitless@0.8.1":
   version "0.8.1"
   resolved "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.1.tgz"
   integrity sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==
 
+"@emotion/unitless@^0.10.0":
+  version "0.10.0"
+  resolved "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.10.0.tgz"
+  integrity sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==
+
 "@emotion/use-insertion-effect-with-fallbacks@^1.1.0":
   version "1.1.0"
   resolved "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.1.0.tgz"
@@ -631,11 +631,121 @@
   resolved "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.4.0.tgz"
   integrity sha512-snKqtPW01tN0ui7yu9rGv69aJXr/a/Ywvl11sUjNtEcRc+ng/mQriFL0wLXMef74iHa/EkftbDzU9F8iFbH+zg==
 
+"@esbuild/aix-ppc64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz#c7184a326533fcdf1b8ee0733e21c713b975575f"
+  integrity sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==
+
+"@esbuild/android-arm64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.21.5.tgz#09d9b4357780da9ea3a7dfb833a1f1ff439b4052"
+  integrity sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==
+
+"@esbuild/android-arm@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.21.5.tgz#9b04384fb771926dfa6d7ad04324ecb2ab9b2e28"
+  integrity sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==
+
+"@esbuild/android-x64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.21.5.tgz#29918ec2db754cedcb6c1b04de8cd6547af6461e"
+  integrity sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==
+
 "@esbuild/darwin-arm64@0.21.5":
   version "0.21.5"
   resolved "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.21.5.tgz"
   integrity sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==
 
+"@esbuild/darwin-x64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.21.5.tgz#c13838fa57372839abdddc91d71542ceea2e1e22"
+  integrity sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==
+
+"@esbuild/freebsd-arm64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.21.5.tgz#646b989aa20bf89fd071dd5dbfad69a3542e550e"
+  integrity sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==
+
+"@esbuild/freebsd-x64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.21.5.tgz#aa615cfc80af954d3458906e38ca22c18cf5c261"
+  integrity sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==
+
+"@esbuild/linux-arm64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.21.5.tgz#70ac6fa14f5cb7e1f7f887bcffb680ad09922b5b"
+  integrity sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==
+
+"@esbuild/linux-arm@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.21.5.tgz#fc6fd11a8aca56c1f6f3894f2bea0479f8f626b9"
+  integrity sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==
+
+"@esbuild/linux-ia32@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.21.5.tgz#3271f53b3f93e3d093d518d1649d6d68d346ede2"
+  integrity sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==
+
+"@esbuild/linux-loong64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.21.5.tgz#ed62e04238c57026aea831c5a130b73c0f9f26df"
+  integrity sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==
+
+"@esbuild/linux-mips64el@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.21.5.tgz#e79b8eb48bf3b106fadec1ac8240fb97b4e64cbe"
+  integrity sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==
+
+"@esbuild/linux-ppc64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.21.5.tgz#5f2203860a143b9919d383ef7573521fb154c3e4"
+  integrity sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==
+
+"@esbuild/linux-riscv64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.21.5.tgz#07bcafd99322d5af62f618cb9e6a9b7f4bb825dc"
+  integrity sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==
+
+"@esbuild/linux-s390x@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.21.5.tgz#b7ccf686751d6a3e44b8627ababc8be3ef62d8de"
+  integrity sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==
+
+"@esbuild/linux-x64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.21.5.tgz#6d8f0c768e070e64309af8004bb94e68ab2bb3b0"
+  integrity sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==
+
+"@esbuild/netbsd-x64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.21.5.tgz#bbe430f60d378ecb88decb219c602667387a6047"
+  integrity sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==
+
+"@esbuild/openbsd-x64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.21.5.tgz#99d1cf2937279560d2104821f5ccce220cb2af70"
+  integrity sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==
+
+"@esbuild/sunos-x64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.21.5.tgz#08741512c10d529566baba837b4fe052c8f3487b"
+  integrity sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==
+
+"@esbuild/win32-arm64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.21.5.tgz#675b7385398411240735016144ab2e99a60fc75d"
+  integrity sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==
+
+"@esbuild/win32-ia32@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.21.5.tgz#1bfc3ce98aa6ca9a0969e4d2af72144c59c1193b"
+  integrity sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==
+
+"@esbuild/win32-x64@0.21.5":
+  version "0.21.5"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.21.5.tgz#acad351d582d157bb145535db2a6ff53dd514b5c"
+  integrity sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==
+
 "@eslint-community/eslint-utils@^4.2.0", "@eslint-community/eslint-utils@^4.4.0":
   version "4.4.1"
   resolved "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.1.tgz"
@@ -677,16 +787,16 @@
     minimatch "^3.1.2"
     strip-json-comments "^3.1.1"
 
-"@eslint/js@^9.14.0":
-  version "9.14.0"
-  resolved "https://registry.npmjs.org/@eslint/js/-/js-9.14.0.tgz"
-  integrity sha512-pFoEtFWCPyDOl+C6Ift+wC7Ro89otjigCf5vcuWqWgqNSQbRrpjSvdeE6ofLz4dHmyxD5f7gIdGT4+p36L6Twg==
-
 "@eslint/js@9.13.0":
   version "9.13.0"
   resolved "https://registry.npmjs.org/@eslint/js/-/js-9.13.0.tgz"
   integrity sha512-IFLyoY4d72Z5y/6o/BazFBezupzI/taV8sGumxTAVw3lXG9A6md1Dc34T9s1FoD/an9pJH8RHbAxsaEbBed9lA==
 
+"@eslint/js@^9.14.0":
+  version "9.14.0"
+  resolved "https://registry.npmjs.org/@eslint/js/-/js-9.14.0.tgz"
+  integrity sha512-pFoEtFWCPyDOl+C6Ift+wC7Ro89otjigCf5vcuWqWgqNSQbRrpjSvdeE6ofLz4dHmyxD5f7gIdGT4+p36L6Twg==
+
 "@eslint/object-schema@^2.1.4":
   version "2.1.4"
   resolved "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-2.1.4.tgz"
@@ -704,7 +814,7 @@
   resolved "https://registry.npmjs.org/@faker-js/faker/-/faker-9.1.0.tgz"
   integrity sha512-GJvX9iM9PBtKScJVlXQ0tWpihK3i0pha/XAhzQa1hPK/ILLa1Wq3I63Ij7lRtqTwmdTxRCyrUhLC5Sly9SLbug==
 
-"@firebase/app@^0.10.15", "@firebase/app@0.x":
+"@firebase/app@^0.10.15":
   version "0.10.15"
   resolved "https://registry.npmjs.org/@firebase/app/-/app-0.10.15.tgz"
   integrity sha512-he6qlG3pmwL+LHdG/BrSMBQeJzzutciq4fpXN3lGa1uSwYSijJ24VtakS/bP2X9SiDf8jGywJ4u+OgXAenJsNg==
@@ -984,6 +1094,13 @@
   resolved "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-6.1.6.tgz"
   integrity sha512-nz1SlR9TdBYYPz4qKoNasMPRiGb4PaIHFkzLzhju0YVYS5QSuFF2+n7CsiHMIDcHv3piPu/xDWI53ruhOqvZwQ==
 
+"@mui/icons-material@^6.4.6":
+  version "6.4.7"
+  resolved "https://registry.yarnpkg.com/@mui/icons-material/-/icons-material-6.4.7.tgz#078406b61c7d17230b8633643dbb458f89e02059"
+  integrity sha512-Rk8cs9ufQoLBw582Rdqq7fnSXXZTqhYRbpe1Y5SAz9lJKZP3CIdrj0PfG8HJLGw1hrsHFN/rkkm70IDzhJsG1g==
+  dependencies:
+    "@babel/runtime" "^7.26.0"
+
 "@mui/material@^6.1.6":
   version "6.1.6"
   resolved "https://registry.npmjs.org/@mui/material/-/material-6.1.6.tgz"
@@ -1074,7 +1191,7 @@
     "@nodelib/fs.stat" "2.0.5"
     run-parallel "^1.1.9"
 
-"@nodelib/fs.stat@^2.0.2", "@nodelib/fs.stat@2.0.5":
+"@nodelib/fs.stat@2.0.5", "@nodelib/fs.stat@^2.0.2":
   version "2.0.5"
   resolved "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz"
   integrity sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==
@@ -1298,7 +1415,7 @@
     "@radix-ui/react-primitive" "2.0.0"
     "@radix-ui/react-use-callback-ref" "1.1.0"
 
-"@radix-ui/react-id@^1.1.0", "@radix-ui/react-id@1.1.0":
+"@radix-ui/react-id@1.1.0", "@radix-ui/react-id@^1.1.0":
   version "1.1.0"
   resolved "https://registry.npmjs.org/@radix-ui/react-id/-/react-id-1.1.0.tgz"
   integrity sha512-EJUrI8yYh7WOjNOqpoJaf1jlFIH2LvtgAl+YcFqNCa+4hj64ZXmPkAKOFs/ukjz3byN6bdb/AVUqHkI8/uWWMA==
@@ -1382,7 +1499,7 @@
     "@radix-ui/react-compose-refs" "1.1.0"
     "@radix-ui/react-use-layout-effect" "1.1.0"
 
-"@radix-ui/react-primitive@^2.0.0", "@radix-ui/react-primitive@2.0.0":
+"@radix-ui/react-primitive@2.0.0", "@radix-ui/react-primitive@^2.0.0":
   version "2.0.0"
   resolved "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-2.0.0.tgz"
   integrity sha512-ZSpFm0/uHa8zTvKBDjLFWLo8dkr4MBsiDLz0g3gMUwqgLHz9rTaRRGYDgvZPtBJgYCBKXkS9fzmoySgr8CO6Cw==
@@ -1470,7 +1587,7 @@
     "@radix-ui/react-use-previous" "1.1.0"
     "@radix-ui/react-use-size" "1.1.0"
 
-"@radix-ui/react-slot@^1.1.0", "@radix-ui/react-slot@1.1.0":
+"@radix-ui/react-slot@1.1.0", "@radix-ui/react-slot@^1.1.0":
   version "1.1.0"
   resolved "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.1.0.tgz"
   integrity sha512-FUCf5XMfmW4dtYl69pdS4DbxKy8nj4M7SafBgPllysxmdachynNflAdp/gCsnYWNDnge6tI9onzMp5ARYc1KNw==
@@ -1573,11 +1690,96 @@
   resolved "https://registry.npmjs.org/@remix-run/router/-/router-1.21.0.tgz"
   integrity sha512-xfSkCAchbdG5PnbrKqFWwia4Bi61nH+wm8wLEqfHDyp7Y3dZzgqS2itV8i4gAq9pC2HsTpwyBC6Ds8VHZ96JlA==
 
+"@rollup/rollup-android-arm-eabi@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.24.2.tgz#07db37fcd9d401aae165f662c0069efd61d4ffcc"
+  integrity sha512-ufoveNTKDg9t/b7nqI3lwbCG/9IJMhADBNjjz/Jn6LxIZxD7T5L8l2uO/wD99945F1Oo8FvgbbZJRguyk/BdzA==
+
+"@rollup/rollup-android-arm64@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.24.2.tgz#160975402adf85ecd58a0721ad60ae1779a68147"
+  integrity sha512-iZoYCiJz3Uek4NI0J06/ZxUgwAfNzqltK0MptPDO4OR0a88R4h0DSELMsflS6ibMCJ4PnLvq8f7O1d7WexUvIA==
+
 "@rollup/rollup-darwin-arm64@4.24.2":
   version "4.24.2"
   resolved "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.24.2.tgz"
   integrity sha512-/UhrIxobHYCBfhi5paTkUDQ0w+jckjRZDZ1kcBL132WeHZQ6+S5v9jQPVGLVrLbNUebdIRpIt00lQ+4Z7ys4Rg==
 
+"@rollup/rollup-darwin-x64@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.24.2.tgz#3f4987eff6195532037c50b8db92736e326b5bb2"
+  integrity sha512-1F/jrfhxJtWILusgx63WeTvGTwE4vmsT9+e/z7cZLKU8sBMddwqw3UV5ERfOV+H1FuRK3YREZ46J4Gy0aP3qDA==
+
+"@rollup/rollup-freebsd-arm64@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.24.2.tgz#15fe184ecfafc635879500f6985c954e57697c44"
+  integrity sha512-1YWOpFcGuC6iGAS4EI+o3BV2/6S0H+m9kFOIlyFtp4xIX5rjSnL3AwbTBxROX0c8yWtiWM7ZI6mEPTI7VkSpZw==
+
+"@rollup/rollup-freebsd-x64@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.24.2.tgz#c72d37315d36b6e0763b7aabb6ae53c361b45e05"
+  integrity sha512-3qAqTewYrCdnOD9Gl9yvPoAoFAVmPJsBvleabvx4bnu1Kt6DrB2OALeRVag7BdWGWLhP1yooeMLEi6r2nYSOjg==
+
+"@rollup/rollup-linux-arm-gnueabihf@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.24.2.tgz#f274f81abf845dcca5f1f40d434a09a79a3a73a0"
+  integrity sha512-ArdGtPHjLqWkqQuoVQ6a5UC5ebdX8INPuJuJNWRe0RGa/YNhVvxeWmCTFQ7LdmNCSUzVZzxAvUznKaYx645Rig==
+
+"@rollup/rollup-linux-arm-musleabihf@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.24.2.tgz#9edaeb1a9fa7d4469917cb0614f665f1cf050625"
+  integrity sha512-B6UHHeNnnih8xH6wRKB0mOcJGvjZTww1FV59HqJoTJ5da9LCG6R4SEBt6uPqzlawv1LoEXSS0d4fBlHNWl6iYw==
+
+"@rollup/rollup-linux-arm64-gnu@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.24.2.tgz#6eb6851f594336bfa00f074f58a00a61e9751493"
+  integrity sha512-kr3gqzczJjSAncwOS6i7fpb4dlqcvLidqrX5hpGBIM1wtt0QEVtf4wFaAwVv8QygFU8iWUMYEoJZWuWxyua4GQ==
+
+"@rollup/rollup-linux-arm64-musl@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.24.2.tgz#9d8dc8e80df8f156d2888ecb8d6c96d653580731"
+  integrity sha512-TDdHLKCWgPuq9vQcmyLrhg/bgbOvIQ8rtWQK7MRxJ9nvaxKx38NvY7/Lo6cYuEnNHqf6rMqnivOIPIQt6H2AoA==
+
+"@rollup/rollup-linux-powerpc64le-gnu@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.24.2.tgz#358e3e7dda2d60c46ff7c74f7075045736df5b50"
+  integrity sha512-xv9vS648T3X4AxFFZGWeB5Dou8ilsv4VVqJ0+loOIgDO20zIhYfDLkk5xoQiej2RiSQkld9ijF/fhLeonrz2mw==
+
+"@rollup/rollup-linux-riscv64-gnu@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.24.2.tgz#b08461ace599c3f0b5f27051f1756b6cf1c78259"
+  integrity sha512-tbtXwnofRoTt223WUZYiUnbxhGAOVul/3StZ947U4A5NNjnQJV5irKMm76G0LGItWs6y+SCjUn/Q0WaMLkEskg==
+
+"@rollup/rollup-linux-s390x-gnu@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.24.2.tgz#daab36c9b5c8ac4bfe5a9c4c39ad711464b7dfee"
+  integrity sha512-gc97UebApwdsSNT3q79glOSPdfwgwj5ELuiyuiMY3pEWMxeVqLGKfpDFoum4ujivzxn6veUPzkGuSYoh5deQ2Q==
+
+"@rollup/rollup-linux-x64-gnu@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.24.2.tgz#4cc3a4f31920bdb028dbfd7ce0e972a17424a63c"
+  integrity sha512-jOG/0nXb3z+EM6SioY8RofqqmZ+9NKYvJ6QQaa9Mvd3RQxlH68/jcB/lpyVt4lCiqr04IyaC34NzhUqcXbB5FQ==
+
+"@rollup/rollup-linux-x64-musl@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.24.2.tgz#59800e26c538517ee05f4645315d9e1aded93200"
+  integrity sha512-XAo7cJec80NWx9LlZFEJQxqKOMz/lX3geWs2iNT5CHIERLFfd90f3RYLLjiCBm1IMaQ4VOX/lTC9lWfzzQm14Q==
+
+"@rollup/rollup-win32-arm64-msvc@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.24.2.tgz#c80e2c33c952b6b171fa6ad9a97dfbb2e4ebee44"
+  integrity sha512-A+JAs4+EhsTjnPQvo9XY/DC0ztaws3vfqzrMNMKlwQXuniBKOIIvAAI8M0fBYiTCxQnElYu7mLk7JrhlQ+HeOw==
+
+"@rollup/rollup-win32-ia32-msvc@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.24.2.tgz#a1e9d275cb16f6d5feb9c20aee7e897b1e193359"
+  integrity sha512-ZhcrakbqA1SCiJRMKSU64AZcYzlZ/9M5LaYil9QWxx9vLnkQ9Vnkve17Qn4SjlipqIIBFKjBES6Zxhnvh0EAEw==
+
+"@rollup/rollup-win32-x64-msvc@4.24.2":
+  version "4.24.2"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.24.2.tgz#0610af0fb8fec52be779d5b163bbbd6930150467"
+  integrity sha512-2mLH46K1u3r6uwc95hU+OR9q/ggYMpnS7pSp83Ece1HUQgF9Nh/QwTK5rcgbFnV9j+08yBrU5sA/P0RK2MSBNA==
+
 "@tanstack/query-core@5.59.20":
   version "5.59.20"
   resolved "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.59.20.tgz"
@@ -1635,7 +1837,7 @@
   dependencies:
     "@babel/types" "^7.20.7"
 
-"@types/estree@^1.0.6", "@types/estree@1.0.6":
+"@types/estree@1.0.6", "@types/estree@^1.0.6":
   version "1.0.6"
   resolved "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz"
   integrity sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==
@@ -1645,7 +1847,7 @@
   resolved "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.14.tgz"
   integrity sha512-WCfD5Ht3ZesJUsONdhvm84dmzWOiOzOAqOncN0++w0lBw1o8OuDNJF2McvvCef/yBqb/HYRahp1BYtODFQ8bRg==
 
-"@types/hoist-non-react-statics@*", "@types/hoist-non-react-statics@^3.3.1", "@types/hoist-non-react-statics@3":
+"@types/hoist-non-react-statics@*", "@types/hoist-non-react-statics@3", "@types/hoist-non-react-statics@^3.3.1":
   version "3.3.5"
   resolved "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.5.tgz"
   integrity sha512-SbcrWzkKBw2cdwRTwQAswfpB9g9LJWfjtUeW/jvNwbhC8cpmmNYVePa+ncbUe0rGTQ7G3Ff6mYUN2VMfLVr+Sg==
@@ -1665,7 +1867,7 @@
   dependencies:
     "@types/geojson" "*"
 
-"@types/node@^18.0.0 || >=20.0.0", "@types/node@^22.9.0", "@types/node@>=12.12.47", "@types/node@>=13.7.0":
+"@types/node@>=12.12.47", "@types/node@>=13.7.0", "@types/node@^22.9.0":
   version "22.9.0"
   resolved "https://registry.npmjs.org/@types/node/-/node-22.9.0.tgz"
   integrity sha512-vuyHg81vvWA1Z1ELfvLko2c8f34gyA0zaic0+Rllc5lbCnbSyuvb2Oxpm6TAUAC/2xZN3QGqxBNggD1nNR2AfQ==
@@ -1682,7 +1884,7 @@
   resolved "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.13.tgz"
   integrity sha512-hCZTSvwbzWGvhqxp/RqVqwU999pBf2vp7hzIjiYOsl8wqOmUxkQ6ddw1cV3l8811+kdUFus/q4d1Y3E3SyEifA==
 
-"@types/react-dom@*", "@types/react-dom@^18.3.1":
+"@types/react-dom@^18.3.1":
   version "18.3.1"
   resolved "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.1.tgz"
   integrity sha512-qW1Mfv8taImTthu4KoXgDfLuk4bydU6Q/TkADnDWWHwi4NX4BR+LWfTp2sVmTqRrsHvyDDTelgelxJ+SsejKKQ==
@@ -1703,7 +1905,7 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react@*", "@types/react@^16.8.0 || ^17.0.0 || ^18.0.0", "@types/react@^16.9.0 || ^17.0.0 || ^18.0.0", "@types/react@^17.0.0 || ^18.0.0", "@types/react@^17.0.0 || ^18.0.0 || ^19.0.0", "@types/react@^18.3.12", "@types/react@16 || 17 || 18":
+"@types/react@*", "@types/react@16 || 17 || 18", "@types/react@^18.3.12":
   version "18.3.12"
   resolved "https://registry.npmjs.org/@types/react/-/react-18.3.12.tgz"
   integrity sha512-D2wOSq/d6Agt28q7rSI3jhU7G6aiuzljDGZ2hTZHIkrTLUI+AF3WMeKkEZ9nN2fkBAlcktT6vcZjDFiIhMYEQw==
@@ -1720,17 +1922,17 @@
     "@types/react" "*"
     csstype "^3.0.2"
 
-"@types/stylis@^4.2.6":
-  version "4.2.6"
-  resolved "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.6.tgz"
-  integrity sha512-4nebF2ZJGzQk0ka0O6+FZUWceyFv4vWq/0dXBMmrSeAwzOuOd/GxE5Pa64d/ndeNLG73dXoBsRzvtsVsYUv6Uw==
-
 "@types/stylis@4.2.5":
   version "4.2.5"
   resolved "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.5.tgz"
   integrity sha512-1Xve+NMN7FWjY14vLoY5tL3BVEQ/n42YLwaqJIPYhotZ9uBHt87VceMwWQpzmdEt2TNXIorIFG+YeCUUW7RInw==
 
-"@typescript-eslint/eslint-plugin@^8.14.0", "@typescript-eslint/eslint-plugin@8.14.0":
+"@types/stylis@^4.2.6":
+  version "4.2.6"
+  resolved "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.6.tgz"
+  integrity sha512-4nebF2ZJGzQk0ka0O6+FZUWceyFv4vWq/0dXBMmrSeAwzOuOd/GxE5Pa64d/ndeNLG73dXoBsRzvtsVsYUv6Uw==
+
+"@typescript-eslint/eslint-plugin@8.14.0", "@typescript-eslint/eslint-plugin@^8.14.0":
   version "8.14.0"
   resolved "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.14.0.tgz"
   integrity sha512-tqp8H7UWFaZj0yNO6bycd5YjMwxa6wIHOLZvWPkidwbgLCsBMetQoGj7DPuAlWa2yGO3H48xmPwjhsSPPCGU5w==
@@ -1745,7 +1947,7 @@
     natural-compare "^1.4.0"
     ts-api-utils "^1.3.0"
 
-"@typescript-eslint/parser@^8.0.0 || ^8.0.0-alpha.0", "@typescript-eslint/parser@^8.14.0", "@typescript-eslint/parser@8.14.0":
+"@typescript-eslint/parser@8.14.0", "@typescript-eslint/parser@^8.14.0":
   version "8.14.0"
   resolved "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.14.0.tgz"
   integrity sha512-2p82Yn9juUJq0XynBXtFCyrBDb6/dJombnz6vbo6mgQEtWHfvHbQuEa9kAOVIt1c9YFwi7H6WxtPj1kg+80+RA==
@@ -1854,7 +2056,7 @@ acorn-jsx@^5.3.2:
   resolved "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz"
   integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
 
-"acorn@^6.0.0 || ^7.0.0 || ^8.0.0", acorn@^8.12.0:
+acorn@^8.12.0:
   version "8.14.0"
   resolved "https://registry.npmjs.org/acorn/-/acorn-8.14.0.tgz"
   integrity sha512-cl669nCJTZBsL97OF4kUQm5g5hC2uihk0NxY3WENAC0TYdILVkAyHymAntgxGkl7K+t0cXIrH5siy5S4XkFycA==
@@ -1904,7 +2106,7 @@ anymatch@~3.1.2:
     normalize-path "^3.0.0"
     picomatch "^2.0.4"
 
-apexcharts@^3.41.0, apexcharts@3.52.0:
+apexcharts@3.52.0:
   version "3.52.0"
   resolved "https://registry.npmjs.org/apexcharts/-/apexcharts-3.52.0.tgz"
   integrity sha512-7dg0ADKs8AA89iYMZMe2sFDG0XK5PfqllKV9N+i3hKHm3vEtdhwz8AlXGm+/b0nJ6jKiaXsqci5LfVxNhtB+dA==
@@ -2020,7 +2222,7 @@ broadcast-channel@^3.4.1:
     rimraf "3.0.2"
     unload "2.2.0"
 
-browserslist@^4.23.1, browserslist@^4.23.3, browserslist@^4.24.0, "browserslist@>= 4.21.0":
+browserslist@^4.23.1, browserslist@^4.23.3, browserslist@^4.24.0:
   version "4.24.2"
   resolved "https://registry.npmjs.org/browserslist/-/browserslist-4.24.2.tgz"
   integrity sha512-ZIc+Q62revdMcqC6aChtW4jz3My3klmCO1fEmINZY/8J3EpBg5/A/D0AKmBveUh6pgoeycoMkVMko84tuYS+Gg==
@@ -2100,6 +2302,11 @@ cliui@^8.0.1:
     strip-ansi "^6.0.1"
     wrap-ansi "^7.0.0"
 
+clsx@2.0.0:
+  version "2.0.0"
+  resolved "https://registry.npmjs.org/clsx/-/clsx-2.0.0.tgz"
+  integrity sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==
+
 clsx@^1.1.0:
   version "1.2.1"
   resolved "https://registry.npmjs.org/clsx/-/clsx-1.2.1.tgz"
@@ -2110,11 +2317,6 @@ clsx@^2.1.0, clsx@^2.1.1:
   resolved "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz"
   integrity sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==
 
-clsx@2.0.0:
-  version "2.0.0"
-  resolved "https://registry.npmjs.org/clsx/-/clsx-2.0.0.tgz"
-  integrity sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==
-
 cmdk@^1.0.4:
   version "1.0.4"
   resolved "https://registry.npmjs.org/cmdk/-/cmdk-1.0.4.tgz"
@@ -2234,12 +2436,12 @@ cssjanus@^2.0.1:
   resolved "https://registry.npmjs.org/cssjanus/-/cssjanus-2.3.0.tgz"
   integrity sha512-ZZXXn51SnxRxAZ6fdY7mBDPmA4OZd83q/J9Gdqz3YmE9TUq+9tZl+tdOnCi7PpNygI6PEkehj9rgifv5+W8a5A==
 
-csstype@^3.0.10, csstype@^3.0.2, csstype@^3.1.3, csstype@3.1.3:
+csstype@3.1.3, csstype@^3.0.2, csstype@^3.1.3:
   version "3.1.3"
   resolved "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz"
   integrity sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==
 
-"date-fns@^2.28.0 || ^3.0.0", date-fns@^3.0.0:
+date-fns@^3.0.0:
   version "3.6.0"
   resolved "https://registry.npmjs.org/date-fns/-/date-fns-3.6.0.tgz"
   integrity sha512-fRHTG8g/Gif+kSh50gaGEdToemgfj74aRX3swtiouboip5JDLAyDE9F11nHMIcvOaXeOC6D7SpNhi7uFyB7Uww==
@@ -2381,7 +2583,7 @@ escape-string-regexp@^4.0.0:
   resolved "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz"
   integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==
 
-eslint-config-prettier@*, eslint-config-prettier@^9.1.0:
+eslint-config-prettier@^9.1.0:
   version "9.1.0"
   resolved "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.1.0.tgz"
   integrity sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==
@@ -2422,7 +2624,7 @@ eslint-visitor-keys@^4.1.0:
   resolved "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.1.0.tgz"
   integrity sha512-Q7lok0mqMUSf5a/AdAZkA5a/gHcO6snwQClVNNvFKCAVlxXucdU8pKydU5ZVZjBx5xr37vGbFFWtLQYreLzrZg==
 
-"eslint@^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0 || ^9.0.0", "eslint@^6.0.0 || ^7.0.0 || >=8.0.0", "eslint@^8.57.0 || ^9.0.0", eslint@^9.13.0, eslint@>=7, eslint@>=7.0.0, eslint@>=8.0.0:
+eslint@^9.13.0:
   version "9.13.0"
   resolved "https://registry.npmjs.org/eslint/-/eslint-9.13.0.tgz"
   integrity sha512-EYZK6SX6zjFHST/HRytOdA/zE72Cq/bfw45LSyuwrdvcclb/gqV8RRQxywOBEWO2+WDpva6UZa4CcDeJKzUCFA==
@@ -2622,10 +2824,12 @@ fs.realpath@^1.0.0:
 
 fsevents@~2.3.2, fsevents@~2.3.3:
   version "2.3.3"
-  resolved "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz"
+  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.3.tgz#cac6407785d03675a2a5e1a5305c697b347d90d6"
   integrity sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==
+
+function-bind@^1.1.2:
   version "1.1.2"
-  resolved "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz"
+  resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.2.tgz#2c02d864d97f3ea6c8830c464cbd11ab6eab7a1c"
   integrity sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==
 
 gensync@^1.0.0-beta.2:
@@ -2654,7 +2858,7 @@ get-nonce@^1.0.0:
   resolved "https://registry.npmjs.org/get-nonce/-/get-nonce-1.0.1.tgz"
   integrity sha512-FJhYRoDaiatfEkUK8HKlicmu/3SGFD51q3itKDGoSTysQJBnfOcxU5GxnhE1E6soB76MbT0MBtnKJuXyAx+96Q==
 
-glob-parent@^5.1.2:
+glob-parent@^5.1.2, glob-parent@~5.1.2:
   version "5.1.2"
   resolved "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz"
   integrity sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==
@@ -2668,13 +2872,6 @@ glob-parent@^6.0.2:
   dependencies:
     is-glob "^4.0.3"
 
-glob-parent@~5.1.2:
-  version "5.1.2"
-  resolved "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz"
-  integrity sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==
-  dependencies:
-    is-glob "^4.0.1"
-
 glob@^10.3.10:
   version "10.4.5"
   resolved "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz"
@@ -2755,7 +2952,7 @@ hasown@^2.0.0, hasown@^2.0.2:
   dependencies:
     function-bind "^1.1.2"
 
-hoist-non-react-statics@^3.3.0, hoist-non-react-statics@^3.3.1, hoist-non-react-statics@3:
+hoist-non-react-statics@3, hoist-non-react-statics@^3.3.0, hoist-non-react-statics@^3.3.1:
   version "3.3.2"
   resolved "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz"
   integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
@@ -2875,7 +3072,7 @@ jackspeak@^3.1.2:
   optionalDependencies:
     "@pkgjs/parseargs" "^0.11.0"
 
-jiti@*, jiti@^1.18.2, jiti@^1.21.0:
+jiti@^1.18.2, jiti@^1.21.0:
   version "1.21.6"
   resolved "https://registry.npmjs.org/jiti/-/jiti-1.21.6.tgz"
   integrity sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w==
@@ -2939,7 +3136,7 @@ kolorist@^1.8.0:
   resolved "https://registry.npmjs.org/kolorist/-/kolorist-1.8.0.tgz"
   integrity sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==
 
-leaflet@^1.9.0, leaflet@^1.9.4:
+leaflet@^1.9.4:
   version "1.9.4"
   resolved "https://registry.npmjs.org/leaflet/-/leaflet-1.9.4.tgz"
   integrity sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA==
@@ -3073,14 +3270,7 @@ mini-svg-data-uri@^1.4.4:
   resolved "https://registry.npmjs.org/mini-svg-data-uri/-/mini-svg-data-uri-1.4.4.tgz"
   integrity sha512-r9deDe9p5FJUPZAk3A59wGH7Ii9YrjjWw0jmw/liSbHl2CHiyXj6FcDXDu2K3TjVAXqiJdaw3xxwlZZr9E6nHg==
 
-minimatch@^3.1.1:
-  version "3.1.2"
-  resolved "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz"
-  integrity sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==
-  dependencies:
-    brace-expansion "^1.1.7"
-
-minimatch@^3.1.2:
+minimatch@^3.1.1, minimatch@^3.1.2:
   version "3.1.2"
   resolved "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz"
   integrity sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==
@@ -3581,15 +3771,7 @@ postcss-selector-not@^8.0.1:
   dependencies:
     postcss-selector-parser "^7.0.0"
 
-postcss-selector-parser@^6.0.11:
-  version "6.1.2"
-  resolved "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz"
-  integrity sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==
-  dependencies:
-    cssesc "^3.0.0"
-    util-deprecate "^1.0.2"
-
-postcss-selector-parser@^6.1.1:
+postcss-selector-parser@^6.0.11, postcss-selector-parser@^6.1.1:
   version "6.1.2"
   resolved "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz"
   integrity sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==
@@ -3610,15 +3792,6 @@ postcss-value-parser@^4.0.0, postcss-value-parser@^4.0.2, postcss-value-parser@^
   resolved "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz"
   integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==
 
-postcss@^8, postcss@^8.0.0, postcss@^8.0.3, postcss@^8.1.0, postcss@^8.2.14, postcss@^8.4, postcss@^8.4.21, postcss@^8.4.23, postcss@^8.4.43, postcss@^8.4.49, postcss@^8.4.6, postcss@>=8.0.9:
-  version "8.4.49"
-  resolved "https://registry.npmjs.org/postcss/-/postcss-8.4.49.tgz"
-  integrity sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==
-  dependencies:
-    nanoid "^3.3.7"
-    picocolors "^1.1.1"
-    source-map-js "^1.2.1"
-
 postcss@8.4.38:
   version "8.4.38"
   resolved "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz"
@@ -3628,6 +3801,15 @@ postcss@8.4.38:
     picocolors "^1.0.0"
     source-map-js "^1.2.0"
 
+postcss@^8.4.23, postcss@^8.4.43, postcss@^8.4.49:
+  version "8.4.49"
+  resolved "https://registry.npmjs.org/postcss/-/postcss-8.4.49.tgz"
+  integrity sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==
+  dependencies:
+    nanoid "^3.3.7"
+    picocolors "^1.1.1"
+    source-map-js "^1.2.1"
+
 prelude-ls@^1.2.1:
   version "1.2.1"
   resolved "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz"
@@ -3640,7 +3822,7 @@ prettier-linter-helpers@^1.0.0:
   dependencies:
     fast-diff "^1.1.2"
 
-prettier@^3.3.3, prettier@>=3.0.0:
+prettier@^3.3.3:
   version "3.3.3"
   resolved "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz"
   integrity sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==
@@ -3711,7 +3893,7 @@ react-day-picker@^8.10.1:
   resolved "https://registry.npmjs.org/react-day-picker/-/react-day-picker-8.10.1.tgz"
   integrity sha512-TMx7fNbhLk15eqcMt+7Z7S2KF7mfTId/XJDjKE8f+IUcFn0l08/kI4FiYTL/0yuOLmEcbR4Fwe3GJf/NiiMnPA==
 
-"react-dom@^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc", "react-dom@^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", "react-dom@^16.8.0 || ^17.0.0 || ^18.0.0", "react-dom@^17.0.0 || ^18.0.0", "react-dom@^17.0.0 || ^18.0.0 || ^19.0.0", "react-dom@^18 || ^19 || ^19.0.0-rc", react-dom@^18.0.0, "react-dom@^18.0.0 || ^19.0.0 || ^19.0.0-rc", react-dom@^18.3.1, "react-dom@>= 16.8.0", react-dom@>=16.6.0, react-dom@>=16.8, react-dom@>=16.8.0:
+react-dom@^18.3.1:
   version "18.3.1"
   resolved "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz"
   integrity sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==
@@ -3724,12 +3906,7 @@ react-fast-compare@^2.0.1:
   resolved "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-2.0.4.tgz"
   integrity sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==
 
-react-fast-compare@^3.1.1:
-  version "3.2.2"
-  resolved "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.2.tgz"
-  integrity sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==
-
-react-fast-compare@^3.2.2:
+react-fast-compare@^3.1.1, react-fast-compare@^3.2.2:
   version "3.2.2"
   resolved "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.2.tgz"
   integrity sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==
@@ -3781,12 +3958,7 @@ react-intl@^6.8.7:
     intl-messageformat "10.7.6"
     tslib "2"
 
-react-is@^16.13.1:
-  version "16.13.1"
-  resolved "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
-  integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
-
-react-is@^16.7.0:
+react-is@^16.13.1, react-is@^16.7.0:
   version "16.13.1"
   resolved "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
   integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
@@ -3844,7 +4016,7 @@ react-router-dom@^6.28.0:
     "@remix-run/router" "1.21.0"
     react-router "6.28.0"
 
-react-router@^6.28.0, react-router@6.28.0:
+react-router@6.28.0, react-router@^6.28.0:
   version "6.28.0"
   resolved "https://registry.npmjs.org/react-router/-/react-router-6.28.0.tgz"
   integrity sha512-HrYdIFqdrnhDw0PqG/AKjAqEqM7AvxCz0DQ4h2W8k6nqmc5uRBYDag0SBxx9iYz5G8gnuNVLzUe13wl9eAsXXg==
@@ -3875,7 +4047,7 @@ react-transition-group@^4.4.5:
     loose-envify "^1.4.0"
     prop-types "^15.6.2"
 
-"react@^16.3.0 || ^17.0.0 || ^18.0.0", "react@^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0-rc", "react@^16.6.0 || ^17.0.0 || ^18.0.0", "react@^16.6.0 || 17 || 18", "react@^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc", "react@^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", "react@^16.8.0 || ^17.0.0 || ^18.0.0", "react@^17.0.0 || ^18.0.0", "react@^17.0.0 || ^18.0.0 || ^19.0.0", "react@^18 || ^19", "react@^18 || ^19 || ^19.0.0-rc", react@^18.0.0, "react@^18.0.0 || ^19.0.0 || ^19.0.0-rc", react@^18.3.1, "react@>= 16.8.0", react@>=0.13, react@>=16.3.0, react@>=16.6.0, react@>=16.8, react@>=16.8.0, "react@16.8 - 18":
+react@^18.3.1:
   version "18.3.1"
   resolved "https://registry.npmjs.org/react/-/react-18.3.1.tgz"
   integrity sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==
@@ -4000,7 +4172,7 @@ set-function-length@^1.2.1:
     gopd "^1.0.1"
     has-property-descriptors "^1.0.2"
 
-shallowequal@^1.1.0, shallowequal@1.1.0:
+shallowequal@1.1.0, shallowequal@^1.1.0:
   version "1.1.0"
   resolved "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz"
   integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
@@ -4122,11 +4294,6 @@ stylis-plugin-rtl@^2.1.1:
   dependencies:
     cssjanus "^2.0.1"
 
-stylis@^4.3.4, stylis@4.x:
-  version "4.3.4"
-  resolved "https://registry.npmjs.org/stylis/-/stylis-4.3.4.tgz"
-  integrity sha512-osIBl6BGUmSfDkyH2mB7EFvCJntXDrLhKjHTRj/rK6xLH0yuPrHULDRQzKokSOD4VoorhtKpfcfW1GAntu8now==
-
 stylis@4.2.0:
   version "4.2.0"
   resolved "https://registry.npmjs.org/stylis/-/stylis-4.2.0.tgz"
@@ -4137,6 +4304,11 @@ stylis@4.3.2:
   resolved "https://registry.npmjs.org/stylis/-/stylis-4.3.2.tgz"
   integrity sha512-bhtUjWd/z6ltJiQwg0dUfxEJ+W+jdqQd8TbWLWyeIJHlnsqmGLRFFd8e5mA0AZi/zx90smXRlN66YMTcaSFifg==
 
+stylis@^4.3.4:
+  version "4.3.4"
+  resolved "https://registry.npmjs.org/stylis/-/stylis-4.3.4.tgz"
+  integrity sha512-osIBl6BGUmSfDkyH2mB7EFvCJntXDrLhKjHTRj/rK6xLH0yuPrHULDRQzKokSOD4VoorhtKpfcfW1GAntu8now==
+
 sucrase@^3.32.0:
   version "3.35.0"
   resolved "https://registry.npmjs.org/sucrase/-/sucrase-3.35.0.tgz"
@@ -4183,7 +4355,7 @@ svg.filter.js@^2.0.2:
   dependencies:
     svg.js "^2.2.5"
 
-svg.js@^2.0.1, svg.js@^2.2.5, svg.js@^2.4.0, svg.js@^2.6.5, svg.js@>=2.3.x:
+svg.js@>=2.3.x, svg.js@^2.0.1, svg.js@^2.2.5, svg.js@^2.4.0, svg.js@^2.6.5:
   version "2.7.1"
   resolved "https://registry.npmjs.org/svg.js/-/svg.js-2.7.1.tgz"
   integrity sha512-ycbxpizEQktk3FYvn/8BH+6/EuWXg7ZpQREJvgacqn46gIddG24tNNe4Son6omdXCnSOaApnpZw6MPCBA1dODA==
@@ -4235,7 +4407,7 @@ tailwindcss-animate@^1.0.7:
   resolved "https://registry.npmjs.org/tailwindcss-animate/-/tailwindcss-animate-1.0.7.tgz"
   integrity sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA==
 
-tailwindcss@^3.4.14, "tailwindcss@>=3.0.0 || insiders":
+tailwindcss@^3.4.14:
   version "3.4.14"
   resolved "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.14.tgz"
   integrity sha512-IcSvOcTRcUtQQ7ILQL5quRDg7Xs93PdJEk1ZLbhhvJc7uj/OAhYOnruEiwnGgBvUtaUAJ8/mhSw1o8L2jCiENA==
@@ -4314,7 +4486,7 @@ ts-interface-checker@^0.1.9:
   resolved "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz"
   integrity sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==
 
-tslib@^2.0.0, tslib@^2.1.0, tslib@^2.6.2, tslib@2:
+tslib@2, tslib@^2.0.0, tslib@^2.1.0, tslib@^2.6.2:
   version "2.8.0"
   resolved "https://registry.npmjs.org/tslib/-/tslib-2.8.0.tgz"
   integrity sha512-jWVzBLplnCmoaTr13V9dYbiQ99wvZRd0vNWaDRg+aVYRcjDF3nDksxFDE/+fkXnKhpnUUkmx5pK/v8mCtLVqZA==
@@ -4345,7 +4517,7 @@ typescript-eslint@^8.14.0:
     "@typescript-eslint/parser" "8.14.0"
     "@typescript-eslint/utils" "8.14.0"
 
-"typescript@^4.7 || 5", typescript@^5.6.3, typescript@>=4.2.0:
+typescript@^5.6.3:
   version "5.6.3"
   resolved "https://registry.npmjs.org/typescript/-/typescript-5.6.3.tgz"
   integrity sha512-hjcS1mhfuyi4WW8IWtjP7brDrG2cuDZukyrYrSauoXGNgx0S7zceP07adYkJycEr56BOUTNPzbInooiN3fn1qw==
@@ -4413,7 +4585,7 @@ vite-plugin-windicss@^1.9.3:
     kolorist "^1.8.0"
     windicss "^3.5.6"
 
-"vite@^2.0.1 || ^3.0.0 || ^4.0.0 || ^5.0.0", "vite@^4.2.0 || ^5.0.0", vite@^5.4.11:
+vite@^5.4.11:
   version "5.4.11"
   resolved "https://registry.npmjs.org/vite/-/vite-5.4.11.tgz"
   integrity sha512-c7jFQRklXua0mTzneGW9QVyxFjUgwcihC4bXEtujIo2ouWCe1Ajt/amn2PCxYnhYfd5k09JX3SB7OYWFKYqj8Q==

From ed7671a8562a0560f4f3c39f297abfb17b41ee02 Mon Sep 17 00:00:00 2001
From: Raja Oktafrianto <rajaoktafrianto3.com>
Date: Mon, 17 Mar 2025 11:08:06 +0700
Subject: [PATCH 02/19] update sucos

---
 .../master/sucos/blocks/SearchDialog.tsx      | 29 ++++++++++++-------
 .../master/sucos/hooks/ManageSucosContext.tsx |  4 +--
 2 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/src/pages/master/sucos/blocks/SearchDialog.tsx b/src/pages/master/sucos/blocks/SearchDialog.tsx
index 138cbec..22ef4c9 100644
--- a/src/pages/master/sucos/blocks/SearchDialog.tsx
+++ b/src/pages/master/sucos/blocks/SearchDialog.tsx
@@ -65,6 +65,9 @@ const SearchDialog = () => {
 
     try {
       const response = await axios.get(`${API_URL}/sucos/aldeias/${id}`);
+      console.log('API Response Data:', response.data.data);
+      console.log('aldeias data:', aldeias);
+      console.log('isFound:', isFound);
 
       if (response.data.status) {
         setAldeias(response.data.data);
@@ -110,7 +113,7 @@ const SearchDialog = () => {
             </div>
           </div>
         </DialogHeader>
-        <DialogBody className="scrollable-y px-0 pb-0" ref={parentRef}>
+        <DialogBody className="scrollable-x px-0 pb-0" ref={parentRef}>
           <div className="flex flex-col px-0">
             {alert.show && (
               <Alert variant="danger" className="mb-5">
@@ -127,12 +130,12 @@ const SearchDialog = () => {
                   <Select
                     value={formField.id?.toString() ?? ''}
                     onValueChange={(target) => {
-                      const selectedSuco = sucos.find((m) => m.id.toString() === target);
+                      const selectedSuco = sucos.find((m) => m.sucos_id.toString() === target);
                       if (selectedSuco) {
                         setFormField({
                           ...formField,
-                          id: selectedSuco.id,
-                          name: selectedSuco.name
+                          id: selectedSuco.sucos_id,
+                          name: selectedSuco.sucos_name
                         });
                       }
                     }}
@@ -142,11 +145,17 @@ const SearchDialog = () => {
                     </SelectTrigger>
 
                     <SelectContent>
-                      {sucos?.map((suco) => (
-                        <SelectItem key={suco.id} value={suco.id}>
-                          {suco.name}
-                        </SelectItem>
-                      ))}
+                      {sucos?.map((suco) => {
+                        if (!suco.sucos_id) {
+                          console.error('suco.id is undefined or null', suco);
+                          return null; // Skip rendering this item if id is not valid
+                        }
+                        return (
+                          <SelectItem key={suco.sucos_id} value={suco.sucos_id.toString()}>
+                            {suco.sucos_name}
+                          </SelectItem>
+                        );
+                      })}
                     </SelectContent>
                   </Select>
                 </div>
@@ -157,7 +166,7 @@ const SearchDialog = () => {
                     <br />
                     <div className="flex flex-col">
                       <span className="text-sm form-hint">
-                        {aldeias.map((aldeiasID) => aldeiasID.name).join(', ')}
+                        {aldeias.map((aldeia) => aldeia.name).join(', ')}
                       </span>
                     </div>
                   </div>
diff --git a/src/pages/master/sucos/hooks/ManageSucosContext.tsx b/src/pages/master/sucos/hooks/ManageSucosContext.tsx
index 682eb78..d1ae6ac 100644
--- a/src/pages/master/sucos/hooks/ManageSucosContext.tsx
+++ b/src/pages/master/sucos/hooks/ManageSucosContext.tsx
@@ -9,8 +9,8 @@ import { useNavigate } from 'react-router';
 import axios from 'axios';
 
 interface SucosProps {
-  id: number;
-  name: string;
+  sucos_id: number;
+  sucos_name: string;
 }
 
 interface ContextProps {

From 19eb059354b1d369fbf96955077c715623a6e27c Mon Sep 17 00:00:00 2001
From: Raja Oktafrianto <rajaoktafrianto3.com>
Date: Mon, 17 Mar 2025 11:58:43 +0700
Subject: [PATCH 03/19] update

---
 src/config/api.config.ts                      |   4 +-
 src/pages/master/aldeias/blocks/AddDialog.tsx |  95 +++++++--
 .../master/aldeias/blocks/EditDialog.tsx      |  91 ++++++--
 .../master/aldeias/blocks/ListToolbar.tsx     |   4 +-
 .../aldeias/hooks/ManageAldeiasContext.tsx    |   2 +-
 .../master/municipios/blocks/AddDialog.tsx    |  12 +-
 .../master/municipios/blocks/ListToolbar.tsx  |  23 +-
 .../hooks/ManageMunicipiosContext.tsx         |   2 +-
 .../master/postoadms/blocks/AddDialog.tsx     |  92 ++++++--
 .../master/postoadms/blocks/EditDialog.tsx    |  96 +++++++--
 .../master/postoadms/blocks/ListToolbar.tsx   |   6 +-
 .../master/postoadms/blocks/SearchDialog.tsx  | 147 ++++++-------
 .../hooks/ManagePostoAdmsContext.tsx          |  32 +--
 .../master/products/blocks/AddDialog.tsx      |   6 +
 .../master/products/blocks/ListToolbar.tsx    |   2 +-
 .../master/profession/blocks/AddDialog.tsx    |   6 +
 .../master/provider/blocks/AddDialog.tsx      | 182 +++++++++++++---
 .../master/provider/blocks/EditDialog.tsx     | 200 +++++++++++++++---
 .../master/provider/blocks/ListToolbar.tsx    |   2 +-
 .../provider/hooks/ManageProviderContext.tsx  |   3 +-
 src/pages/master/sucos/blocks/AddDialog.tsx   |   8 +-
 src/pages/master/sucos/blocks/EditDialog.tsx  |   2 +-
 src/pages/master/sucos/blocks/ListToolbar.tsx |  29 ++-
 src/pages/members/kyc/Columns.tsx             |   1 +
 src/pages/members/kyc/Kyc.tsx                 |   7 +-
 .../manage-members/CustomerDetailModal.tsx    |   7 +
 .../members/manage-members/ManageMembers.tsx  |   1 +
 27 files changed, 826 insertions(+), 236 deletions(-)

diff --git a/src/config/api.config.ts b/src/config/api.config.ts
index 25146a3..4780676 100644
--- a/src/config/api.config.ts
+++ b/src/config/api.config.ts
@@ -2,6 +2,7 @@ interface apiConfigProps {
   service_dashboard: string;
   service_customer: string;
   service_master_data: string;
+  service_transaction: string;
 }
 
 const API_URL = import.meta.env.VITE_APP_API_URL;
@@ -10,7 +11,8 @@ const apiConfig: apiConfigProps = {
   service_dashboard: `${API_URL}/d`,
   service_customer: `${API_URL}/c`,
   // service_master_data: `${API_URL}/m`
-  service_master_data: `${API_URL}/t`
+  service_master_data: `${API_URL}/t`,
+  service_transaction: `${API_URL}/tt`
 };
 
 export { apiConfig };
diff --git a/src/pages/master/aldeias/blocks/AddDialog.tsx b/src/pages/master/aldeias/blocks/AddDialog.tsx
index 66286dd..26c53f3 100644
--- a/src/pages/master/aldeias/blocks/AddDialog.tsx
+++ b/src/pages/master/aldeias/blocks/AddDialog.tsx
@@ -15,6 +15,20 @@ import {
 } from '@/components/ui/dialog';
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList
+} from '@/components/ui/command';
+
+interface SucosProps {
+  sucos_id: number;
+  sucos_name: string;
+}
 
 const API_URL = apiConfig.service_master_data;
 
@@ -22,15 +36,17 @@ const AddDialog = () => {
   const parentRef = useRef<any | null>(null);
   const { showAddDialog, handleAddDialog } = useManageAldeiasContext();
   const { reload } = useDataGrid();
-  const { PostData } = useCallApi();
+  const { PostData, GetData } = useCallApi();
   const parsedUser = getAuth()?.user;
+  const [sucos, setSucos] = useState<SucosProps[]>([]);
+  const [open, setOpen] = useState(false);
   const [alert, setAlert] = useState({
     show: false,
     message: ''
   });
   const initialState = {
     name: '',
-    sucos: 0,
+    sucos_id: 0,
     created_by: '',
     created_at: ''
   };
@@ -65,12 +81,12 @@ const AddDialog = () => {
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '' || formField.sucos === 0) {
+    if (formField.name === '' || formField.sucos_id === 0) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
     }
 
-    // doCreateAldeias(e);
+    doCreateAldeias(e);
     console.log(formField);
     setAlert({ show: false, message: '' });
   };
@@ -85,6 +101,34 @@ const AddDialog = () => {
     }
   }, [formattedTime]);
 
+  useEffect(() => {
+    const fetchSucos = async (sorting: any) => {
+      try {
+        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+        const response = await GetData(`${API_URL}/sucos/list`, {
+          limit: 100,
+          page: 1,
+          with_deleted: false,
+          order_field: sorting[0].id,
+          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+        });
+
+        // console.log('SUCOS', response?.data);
+        setSucos(response?.data.list);
+      } catch (error) {
+        console.error('Error fetching municipios', error);
+      }
+    };
+
+    fetchSucos([{ id: 'name', desc: false }]);
+  }, []);
+
+  useEffect(() => {
+    if (showAddDialog === false) {
+      resetForm();
+    }
+  }, [showAddDialog]);
+
   return (
     <Dialog open={showAddDialog} onOpenChange={(open) => handleAddDialog(open)}>
       <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
@@ -121,16 +165,39 @@ const AddDialog = () => {
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Sucos ID<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="number"
-                      min={0}
-                      value={formField.sucos === 0 ? '' : formField.sucos}
-                      onChange={(e) => {
-                        const value = parseInt(e.target.value, 10);
-                        setFormField({ ...formField, sucos: isNaN(value) ? 0 : value });
-                      }}
-                    />
+                    <Popover open={open} onOpenChange={setOpen}>
+                      <PopoverTrigger asChild>
+                        <button type="button" className="input col-span-5 text-left">
+                          {sucos.find((suco) => suco.sucos_id === formField.sucos_id)?.sucos_name ||
+                            'Select Sucos'}
+                        </button>
+                      </PopoverTrigger>
+                      <PopoverContent className="w-[400px] p-0">
+                        <Command>
+                          <CommandInput placeholder="Search Sucos..." />
+                          <CommandList>
+                            <CommandEmpty>No Sucos found.</CommandEmpty>
+                            <CommandGroup>
+                              {sucos.map((suco) => (
+                                <CommandItem
+                                  key={suco.sucos_id}
+                                  value={suco.sucos_name}
+                                  onSelect={() => {
+                                    setFormField({
+                                      ...formField,
+                                      sucos_id: suco.sucos_id
+                                    });
+                                    setOpen(false);
+                                  }}
+                                >
+                                  {suco.sucos_name}
+                                </CommandItem>
+                              ))}
+                            </CommandGroup>
+                          </CommandList>
+                        </Command>
+                      </PopoverContent>
+                    </Popover>
                   </div>
                 </div>
 
diff --git a/src/pages/master/aldeias/blocks/EditDialog.tsx b/src/pages/master/aldeias/blocks/EditDialog.tsx
index d34e30c..179208c 100644
--- a/src/pages/master/aldeias/blocks/EditDialog.tsx
+++ b/src/pages/master/aldeias/blocks/EditDialog.tsx
@@ -15,21 +15,37 @@ import {
 } from '@/components/ui/dialog';
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList
+} from '@/components/ui/command';
+
+interface SucosProps {
+  sucos_id: number;
+  sucos_name: string;
+}
 
 const API_URL = apiConfig.service_master_data;
 
 const EditDialog = () => {
-  const { showEditDialog, handleEditDialog, selectedAldeias } = useManageAldeiasContext();
+  const { showEditDialog, handleEditDialog, selectedAldeias, aldeias } = useManageAldeiasContext();
   const { reload } = useDataGrid();
-  const { PutData } = useCallApi();
+  const { PutData, GetData } = useCallApi();
   const parsedUser = getAuth()?.user;
+  const [sucos, setSucos] = useState<SucosProps[]>([]);
+  const [open, setOpen] = useState(false);
   const [alert, setAlert] = useState({
     show: false,
     message: ''
   });
   const initialState = {
     name: '',
-    sucos: 0,
+    sucos_id: 0,
     updated_by: '',
     updated_at: ''
   };
@@ -64,12 +80,12 @@ const EditDialog = () => {
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '' || formField.sucos === 0) {
+    if (formField.name === '' || formField.sucos_id === 0) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
     }
 
-    // doUpdateAldeias(e);
+    doUpdateAldeias(e);
     console.log(formField);
     setAlert({ show: false, message: '' });
   };
@@ -84,6 +100,28 @@ const EditDialog = () => {
     }
   }, [formattedTime]);
 
+  useEffect(() => {
+    const fetchSucos = async (sorting: any) => {
+      try {
+        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+        const response = await GetData(`${API_URL}/sucos/list`, {
+          limit: 100,
+          page: 1,
+          with_deleted: false,
+          order_field: sorting[0].id,
+          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+        });
+
+        // console.log('SUCOS', response?.data);
+        setSucos(response?.data.list);
+      } catch (error) {
+        console.error('Error fetching municipios', error);
+      }
+    };
+
+    fetchSucos([{ id: 'name', desc: false }]);
+  }, []);
+
   return (
     <Dialog open={showEditDialog} onOpenChange={(open) => handleEditDialog(open, null)}>
       <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
@@ -120,16 +158,39 @@ const EditDialog = () => {
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Sucos ID<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="number"
-                      min={0}
-                      value={formField.sucos === 0 ? '' : formField.sucos}
-                      onChange={(e) => {
-                        const value = parseInt(e.target.value, 10);
-                        setFormField({ ...formField, sucos: isNaN(value) ? 0 : value });
-                      }}
-                    />
+                    <Popover open={open} onOpenChange={setOpen}>
+                      <PopoverTrigger asChild>
+                        <button type="button" className="input col-span-5 text-left">
+                          {sucos.find((suco) => suco.sucos_id === formField.sucos_id)?.sucos_name ||
+                            'Select Sucos'}
+                        </button>
+                      </PopoverTrigger>
+                      <PopoverContent className="w-[400px] p-0">
+                        <Command>
+                          <CommandInput placeholder="Search Sucos..." />
+                          <CommandList>
+                            <CommandEmpty>No Sucos found.</CommandEmpty>
+                            <CommandGroup>
+                              {sucos.map((suco) => (
+                                <CommandItem
+                                  key={suco.sucos_id}
+                                  value={suco.sucos_name}
+                                  onSelect={() => {
+                                    setFormField({
+                                      ...formField,
+                                      sucos_id: suco.sucos_id
+                                    });
+                                    setOpen(false);
+                                  }}
+                                >
+                                  {suco.sucos_name}
+                                </CommandItem>
+                              ))}
+                            </CommandGroup>
+                          </CommandList>
+                        </Command>
+                      </PopoverContent>
+                    </Popover>
                   </div>
                 </div>
 
diff --git a/src/pages/master/aldeias/blocks/ListToolbar.tsx b/src/pages/master/aldeias/blocks/ListToolbar.tsx
index 7cc5369..70ababf 100644
--- a/src/pages/master/aldeias/blocks/ListToolbar.tsx
+++ b/src/pages/master/aldeias/blocks/ListToolbar.tsx
@@ -31,13 +31,13 @@ const ListToolbar = () => {
                 <KeenIcon icon="filter" />
               </Button>
             </DefaultTooltip>
-            <Button
+            {/* <Button
               variant="outline"
               className="h-7.5 text-[0.8rem]"
               onClick={() => handleSearchDialog(true)}
             >
               Search Sucos
-            </Button>
+            </Button> */}
           </div>
           <div className="flex gap-3 items-center">
             <Button
diff --git a/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx b/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx
index d4cf6d3..80359b0 100644
--- a/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx
+++ b/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx
@@ -150,7 +150,7 @@ const ManageAldeiasContextProvider = ({ children }: { children: React.ReactNode
         order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
         filter: JSON.stringify(filter)
       });
-      console.log(response?.data);
+      // console.log(response?.data);
       setAldeias(response?.data.list);
       return { data: response?.data.list, totalCount: response?.data.total_count };
     } catch (error) {
diff --git a/src/pages/master/municipios/blocks/AddDialog.tsx b/src/pages/master/municipios/blocks/AddDialog.tsx
index 234bd0c..03fca26 100644
--- a/src/pages/master/municipios/blocks/AddDialog.tsx
+++ b/src/pages/master/municipios/blocks/AddDialog.tsx
@@ -77,12 +77,6 @@ const AddDialog = () => {
       return;
     }
 
-    // setFormField({
-    //   name: formField.name,
-    //   created_by: parsedUser.email,
-    //   created_at: formattedTime
-    // });
-
     doCreateMunicipio(e);
     console.log(parsedUser.email);
     console.log(formField);
@@ -104,6 +98,12 @@ const AddDialog = () => {
     }
   }, [formattedTime]);
 
+  useEffect(() => {
+    if (showAddDialog === false) {
+      resetForm();
+    }
+  }, [showAddDialog]);
+
   return (
     <Dialog open={showAddDialog} onOpenChange={(open) => handleAddDialog(open)}>
       <DialogContent className="container-fixed max-w-96 flex flex-col p-5 overflow-hidden [&>button]:hidden">
diff --git a/src/pages/master/municipios/blocks/ListToolbar.tsx b/src/pages/master/municipios/blocks/ListToolbar.tsx
index 0129c85..abbdce2 100644
--- a/src/pages/master/municipios/blocks/ListToolbar.tsx
+++ b/src/pages/master/municipios/blocks/ListToolbar.tsx
@@ -1,10 +1,23 @@
 import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components';
 import { useManageMunicipiosContext } from '../hooks/useManageMunicipiosContext';
 import { Button } from '@/components/ui/button';
+import { useCallback, useState } from 'react';
+import { toast } from 'sonner';
 
 const ListToolbar = () => {
   const { table, reload } = useDataGrid();
   const { handleAddDialog, handleSearchDialog } = useManageMunicipiosContext();
+  const [searchName, setSearchName] = useState('');
+  const [isLoading, setIsLoading] = useState(false);
+
+  const handleFilterData = useCallback(() => {
+    try {
+      table.getColumn('name')?.setFilterValue(searchName);
+    } catch (error) {
+      toast.error('Error applying filter');
+      console.error('Error applying filter:', error);
+    }
+  }, [searchName, table]);
 
   return (
     <div className="card-header flex-wrap gap-2 border-b-0 px-5">
@@ -16,8 +29,8 @@ const ListToolbar = () => {
               <input
                 type="text"
                 placeholder="Search Municipios"
-                value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
-                onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
+                value={searchName}
+                onChange={(event) => setSearchName(event.target.value)}
               />
             </label>
             <DefaultTooltip title={'Filter'} placement={'top'}>
@@ -25,19 +38,19 @@ const ListToolbar = () => {
                 variant="outline"
                 className="h-7.5 disabled:bg-gray-400"
                 // disabled={isLoading}
-                // onClick={handleFilterData}
+                onClick={handleFilterData}
               >
                 {/* {loadingButton === 'filter' ? <ContentLoader /> : <KeenIcon icon="filter" />} */}
                 <KeenIcon icon="filter" />
               </Button>
             </DefaultTooltip>
-            <Button
+            {/* <Button
               variant="outline"
               className="h-7.5 text-[0.8rem]"
               onClick={() => handleSearchDialog(true)}
             >
               Search Postu Administrativo
-            </Button>
+            </Button> */}
           </div>
           <div className="flex gap-3 items-center">
             <Button
diff --git a/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx b/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx
index 4d95cf4..606ef0d 100644
--- a/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx
+++ b/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx
@@ -168,7 +168,7 @@ const ManageMunicipiosProvider = ({ children }: { children: React.ReactNode }) =
           order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
         }
       });
-      console.log(response.data);
+      // console.log(response.data);
       // const sortedList = response.data.data.list.sort((a: MunicipiosProps, b: MunicipiosProps) => {
       //   if (a.name < b.name) return -1;
       //   if (a.name > b.name) return 1;
diff --git a/src/pages/master/postoadms/blocks/AddDialog.tsx b/src/pages/master/postoadms/blocks/AddDialog.tsx
index 6e47f25..42126b9 100644
--- a/src/pages/master/postoadms/blocks/AddDialog.tsx
+++ b/src/pages/master/postoadms/blocks/AddDialog.tsx
@@ -15,6 +15,20 @@ import {
 } from '@/components/ui/dialog';
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList
+} from '@/components/ui/command';
+
+interface MunicipioProps {
+  id: number;
+  name: string;
+}
 
 const API_URL = apiConfig.service_master_data;
 
@@ -22,9 +36,10 @@ const AddDialog = () => {
   const parentRef = useRef<any | null>(null);
   const { showAddDialog, handleAddDialog } = useManagePostoAdmsContext();
   const { reload } = useDataGrid();
-  const { PostData } = useCallApi();
+  const { PostData, GetData } = useCallApi();
   const parsedUser = getAuth()?.user;
-
+  const [municipios, setMunicipios] = useState<MunicipioProps[]>([]);
+  const [open, setOpen] = useState(false);
   const [alert, setAlert] = useState({
     show: false,
     message: ''
@@ -88,6 +103,34 @@ const AddDialog = () => {
     }
   }, [formattedTime]);
 
+  useEffect(() => {
+    if (showAddDialog === false) {
+      resetForm();
+    }
+  }, [showAddDialog]);
+
+  useEffect(() => {
+    const fetchMunicipios = async (sorting: any) => {
+      try {
+        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+        const response = await GetData(`${API_URL}/municipios/list`, {
+          limit: 100,
+          page: 1,
+          with_deleted: false,
+          order_field: sorting[0].id,
+          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+        });
+
+        // console.log(response?.data);
+        setMunicipios(response?.data.list);
+      } catch (error) {
+        console.error('Error fetching municipios', error);
+      }
+    };
+
+    fetchMunicipios([{ id: 'name', desc: false }]);
+  }, []);
+
   return (
     <Dialog open={showAddDialog} onOpenChange={(open) => handleAddDialog(open)}>
       <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
@@ -122,18 +165,41 @@ const AddDialog = () => {
                 <div className="w-full">
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">
-                      Municipio ID<span className="text-red-500">*</span>
+                      Municipio Name<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="number"
-                      min={0}
-                      value={formField.municipio_id === 0 ? '' : formField.municipio_id}
-                      onChange={(e) => {
-                        const value = parseInt(e.target.value, 10);
-                        setFormField({ ...formField, municipio_id: isNaN(value) ? 0 : value });
-                      }}
-                    />
+                    <Popover open={open} onOpenChange={setOpen}>
+                      <PopoverTrigger asChild>
+                        <button type="button" className="input col-span-5 text-left">
+                          {municipios.find((municipio) => municipio.id === formField.municipio_id)
+                            ?.name || 'Select Municipios'}
+                        </button>
+                      </PopoverTrigger>
+                      <PopoverContent className="w-[400px] p-0">
+                        <Command>
+                          <CommandInput placeholder="Search Municipios..." />
+                          <CommandList>
+                            <CommandEmpty>No Municipio found.</CommandEmpty>
+                            <CommandGroup>
+                              {municipios.map((municipio) => (
+                                <CommandItem
+                                  key={municipio.id}
+                                  value={municipio.name}
+                                  onSelect={() => {
+                                    setFormField({
+                                      ...formField,
+                                      municipio_id: municipio.id
+                                    });
+                                    setOpen(false);
+                                  }}
+                                >
+                                  {municipio.name}
+                                </CommandItem>
+                              ))}
+                            </CommandGroup>
+                          </CommandList>
+                        </Command>
+                      </PopoverContent>
+                    </Popover>
                   </div>
                 </div>
 
diff --git a/src/pages/master/postoadms/blocks/EditDialog.tsx b/src/pages/master/postoadms/blocks/EditDialog.tsx
index 8513d83..c42423b 100644
--- a/src/pages/master/postoadms/blocks/EditDialog.tsx
+++ b/src/pages/master/postoadms/blocks/EditDialog.tsx
@@ -15,15 +15,32 @@ import {
 } from '@/components/ui/dialog';
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList
+} from '@/components/ui/command';
+
+interface MunicipioProps {
+  id: number;
+  name: string;
+}
 
 const API_URL = apiConfig.service_master_data;
 
 const EditDialog = () => {
   const parentRef = useRef<any | null>(null);
-  const { showEditDialog, handleEditDialog, selectedPostoAdms } = useManagePostoAdmsContext();
+  const { showEditDialog, handleEditDialog, selectedPostoAdms, postoAdms } =
+    useManagePostoAdmsContext();
   const { reload } = useDataGrid();
-  const { PutData } = useCallApi();
+  const { PutData, GetData } = useCallApi();
   const parsedUser = getAuth()?.user;
+  const [open, setOpen] = useState(false);
+  const [municipios, setMunicipios] = useState<MunicipioProps[]>([]);
 
   const [alert, setAlert] = useState({
     show: false,
@@ -35,7 +52,6 @@ const EditDialog = () => {
     updated_by: '',
     updated_at: ''
   };
-
   const [formField, setFormField] = useState(initialState);
   const created_time = new Date();
   const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' ');
@@ -87,6 +103,30 @@ const EditDialog = () => {
     }
   }, [formattedTime]);
 
+  useEffect(() => {
+    try {
+      const fetchMunicipios = async (sorting: any) => {
+        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+        const response = await GetData(`${API_URL}/municipios/list`, {
+          limit: 100,
+          page: 1,
+          with_deleted: false,
+          order_field: sorting[0].id,
+          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+        });
+
+        // console.log(response?.data);
+        setMunicipios(response?.data.list);
+      };
+
+      fetchMunicipios([{ id: 'name', desc: false }]);
+    } catch (error) {
+      console.error('Error fetching municipios', error);
+    }
+  }, []);
+
+  // console.log(selectedPostoAdms);
+
   return (
     <Dialog open={showEditDialog} onOpenChange={(open) => handleEditDialog(open, null)}>
       <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
@@ -121,22 +161,48 @@ const EditDialog = () => {
                 <div className="w-full">
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">
-                      Municipio ID<span className="text-red-500">*</span>
+                      Municipio Name<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="number"
-                      min={0}
-                      value={formField.municipio_id === 0 ? '' : formField.municipio_id}
-                      onChange={(e) => {
-                        const value = parseInt(e.target.value, 10);
-                        setFormField({ ...formField, municipio_id: isNaN(value) ? 0 : value });
-                      }}
-                    />
+                    <Popover open={open} onOpenChange={setOpen}>
+                      <PopoverTrigger asChild>
+                        <button type="button" className="input col-span-5 text-left">
+                          {municipios.find((municipio) => municipio.id === formField.municipio_id)
+                            ?.name || 'Select Municipios'}
+                        </button>
+                      </PopoverTrigger>
+                      <PopoverContent className="w-[400px] p-0">
+                        <Command>
+                          <CommandInput placeholder="Search Municipios..." />
+                          <CommandList>
+                            <CommandEmpty>No Municipio found.</CommandEmpty>
+                            <CommandGroup>
+                              {municipios.map((municipio) => (
+                                <CommandItem
+                                  key={municipio.id}
+                                  value={municipio.name}
+                                  onSelect={() => {
+                                    setFormField({
+                                      ...formField,
+                                      municipio_id: municipio.id
+                                    });
+                                    setOpen(false);
+                                  }}
+                                >
+                                  {municipio.name}
+                                </CommandItem>
+                              ))}
+                            </CommandGroup>
+                          </CommandList>
+                        </Command>
+                      </PopoverContent>
+                    </Popover>
                   </div>
                 </div>
 
-                <div className="flex justify-end">
+                <div className="flex justify-end gap-5">
+                  <Button type="button" variant="outline" onClick={resetForm}>
+                    Reset
+                  </Button>
                   <Button className="btn btn-primary">Save Changes</Button>
                 </div>
               </div>
diff --git a/src/pages/master/postoadms/blocks/ListToolbar.tsx b/src/pages/master/postoadms/blocks/ListToolbar.tsx
index 0be25e2..56a758d 100644
--- a/src/pages/master/postoadms/blocks/ListToolbar.tsx
+++ b/src/pages/master/postoadms/blocks/ListToolbar.tsx
@@ -16,7 +16,7 @@ const ListToolbar = () => {
               <KeenIcon icon="magnifier" />
               <input
                 type="text"
-                placeholder="Search Postu Administrativo"
+                placeholder="Search Postu"
                 value={(table.getColumn('posto_adms_name')?.getFilterValue() as string) ?? ''}
                 onChange={(event) =>
                   table.getColumn('posto_adms_name')?.setFilterValue(event.target.value)
@@ -34,13 +34,13 @@ const ListToolbar = () => {
                 <KeenIcon icon="filter" />
               </Button>
             </DefaultTooltip>
-            <Button
+            {/* <Button
               variant="outline"
               className="h-7.5 text-[0.8rem]"
               onClick={() => handleSearchDialog(true)}
             >
               Search Sucos
-            </Button>
+            </Button> */}
           </div>
           <div className="flex gap-3 items-center">
             <Button
diff --git a/src/pages/master/postoadms/blocks/SearchDialog.tsx b/src/pages/master/postoadms/blocks/SearchDialog.tsx
index a9e9ee1..2218e3e 100644
--- a/src/pages/master/postoadms/blocks/SearchDialog.tsx
+++ b/src/pages/master/postoadms/blocks/SearchDialog.tsx
@@ -11,14 +11,16 @@ import { Alert, KeenIcon } from '@/components';
 import { Button } from '@/components/ui/button';
 import { apiConfig } from '@/config/api.config';
 import axios from 'axios';
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue
-} from '@/components/ui/select';
 import { useManagePostoAdmsContext } from '../hooks/useManagePostoAdmsContext';
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList
+} from '@/components/ui/command';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
 
 interface SucosProps {
   id: number;
@@ -29,6 +31,7 @@ const API_URL = apiConfig.service_master_data;
 
 const SearchDialog = () => {
   const parentRef = useRef<any | null>(null);
+  const [open, setOpen] = useState(false);
   const { showSearchDialog, handleSearchDialog, postoAdms } = useManagePostoAdmsContext();
   const [alert, setAlert] = useState({
     show: false,
@@ -60,6 +63,7 @@ const SearchDialog = () => {
 
       if (response.data.status) {
         setSucos(response.data.data);
+        console.log(sucos);
         setIsFound(true);
         console.log('Found postoadms: ', response.data.data);
       } else {
@@ -79,25 +83,22 @@ const SearchDialog = () => {
     setIsFound(false);
     setSucos([]);
   };
-  // console.log(municipios);
+  
   return (
-    <Dialog open={showSearchDialog} onOpenChange={(open) => handleSearchDialog(open)}>
+    <Dialog open={showSearchDialog} onOpenChange={handleSearchDialog}>
       <DialogContent className="container-fixed max-w-[700px] flex flex-col p-5 overflow-hidden [&>button]:hidden">
-        <DialogTitle></DialogTitle>
-        <DialogDescription></DialogDescription>
         <DialogHeader className="p-2 border-0">
+          <DialogTitle></DialogTitle>
+          <DialogDescription></DialogDescription>
           <div className="flex items-center justify-between flex-wrap grow">
             <div className="flex flex-col justify-center">
-              <h1 className="text-xl font-semibold leading-none text-gray-900">
-                Search Sucos
-              </h1>
-              <div className="flex items-center gap-2 text-sm font-normal text-gray-700"></div>
+              <h1 className="text-xl font-semibold leading-none text-gray-900">Search Sucos</h1>
             </div>
             <div
               className="cursor-pointer hover:opacity-100 opacity-50"
               onClick={() => {
                 handleSearchDialog(false);
-                resetForm();
+                handleReset();
               }}
             >
               <KeenIcon icon="cross" className="text-1.5xl" />
@@ -105,68 +106,68 @@ const SearchDialog = () => {
           </div>
         </DialogHeader>
         <DialogBody className="scrollable-y px-0 pb-0" ref={parentRef}>
-          <div className="flex flex-col px-0">
-            {alert.show && (
-              <Alert variant="danger" className="mb-5">
-                {alert.message}
-              </Alert>
-            )}
-            <form action="" onSubmit={handleSubmit}>
-              <div className="card-body grid-cols-6 gap-5 p-0">
-                <div className="grid grid-cols-8 gap-2 w-full items-center">
-                  <label className="form-label flex items-center gap-1 col-span-2">
-                  PostoAdms Name<span className="text-red-500">*</span>
-                  </label>
+          <form onSubmit={handleSubmit} className="flex flex-col px-5 gap-5">
+            {alert.show && <Alert variant="danger">{alert.message}</Alert>}
 
-                  <Select
-                    value={formField.id.toString()}
-                    onValueChange={(target) => {
-                      const selectedPostoadms = postoAdms.find((m) => m.posto_adms_id.toString() === target);
-                      if (selectedPostoadms) {
-                        setFormField({
-                          ...formField,
-                          id: selectedPostoadms.posto_adms_id,
-                          name: selectedPostoadms.posto_adms_name
-                        });
-                      }
-                    }}
-                  >
-                    <SelectTrigger className="col-span-6">
-                      <SelectValue placeholder="Select Municipios" />
-                    </SelectTrigger>
-                    <SelectContent>
-                      {postoAdms.map((postoAdm) => (
-                        <SelectItem key={postoAdm.posto_adms_id} value={postoAdm.posto_adms_id.toString()}>
-                          {postoAdm.posto_adms_name}
-                        </SelectItem>
-                      ))}
-                    </SelectContent>
-                  </Select>
-                </div>
+            <div className="grid grid-cols-8 gap-1 w-full items-center">
+              <label className="form-label flex items-center col-span-3">
+                Postu Administrativo Name<span className="text-red-500">*</span>
+              </label>
 
-                {isFound && sucos.length > 0 && (
-                  <div className="mt-4 border-t pt-4">
-                    <h2 className="text-md font-semibold">Sucos: </h2>
-                    <br />
-                    <div className="flex flex-col">
-                      <span className="text-sm form-hint">
-                        {sucos.map((suco) => suco.name).join(', ')}
-                      </span>
-                    </div>
-                  </div>
-                )}
+              <Popover open={open} onOpenChange={setOpen}>
+                <PopoverTrigger asChild>
+                  <button type="button" className="input col-span-5 text-left">
+                    {formField.name || 'Select PostoAdms'}
+                  </button>
+                </PopoverTrigger>
+                <PopoverContent className="w-[400px] p-0">
+                  <Command>
+                    <CommandInput placeholder="Search PostoAdms..." />
+                    <CommandList>
+                      <CommandEmpty>No PostoAdms found.</CommandEmpty>
+                      <CommandGroup>
+                        {postoAdms.map((postoAdm) => (
+                          <CommandItem
+                            key={postoAdm.posto_adms_id}
+                            value={postoAdm.posto_adms_name}
+                            onSelect={() => {
+                              setFormField({
+                                id: postoAdm.posto_adms_id,
+                                name: postoAdm.posto_adms_name
+                              });
+                              setOpen(false);
+                            }}
+                          >
+                            {postoAdm.posto_adms_name}
+                          </CommandItem>
+                        ))}
+                      </CommandGroup>
+                    </CommandList>
+                  </Command>
+                </PopoverContent>
+              </Popover>
+            </div>
 
-                <div className="flex justify-end pt-2.5 gap-5 col-span-6">
-                  <Button variant={'outline'} type="reset" onClick={handleReset}>
-                    Reset
-                  </Button>
-                  <Button variant={'default'} type="submit">
-                    Search
-                  </Button>
+            {isFound && sucos.length > 0 && (
+              <div className="mt-4 border-t pt-4">
+                <h2 className="text-md font-semibold">Sucos: </h2>
+                <div className="flex flex-col">
+                  <span className="text-sm form-hint">
+                    {sucos.map((suco) => suco.name).join(', ')}
+                  </span>
                 </div>
               </div>
-            </form>
-          </div>
+            )}
+
+            <div className="flex justify-end gap-4">
+              <Button type="reset" variant="outline" onClick={handleReset}>
+                Reset
+              </Button>
+              <Button type="submit" variant="default">
+                Search
+              </Button>
+            </div>
+          </form>
         </DialogBody>
       </DialogContent>
     </Dialog>
diff --git a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
index 2b19adc..55b87c3 100644
--- a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
+++ b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
@@ -3,10 +3,10 @@ import { Button } from '@/components/ui/button';
 import { Toaster } from '@/components/ui/sonner';
 import { apiConfig } from '@/config/api.config';
 import { ColumnDef } from '@tanstack/react-table';
-import axios from 'axios';
 import { createContext, useCallback, useMemo, useState } from 'react';
 import { useNavigate, useParams } from 'react-router';
 import ListToolbar from '../blocks/ListToolbar';
+import { useCallApi } from '@/hooks';
 
 interface PostoAdmsProps {
   posto_adms_id: number;
@@ -58,6 +58,7 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
   const [showEditDialog, setShowEditDialog] = useState(false);
   const [showDeleteDialog, setShowDeleteDialog] = useState(false);
   const [selectedPostoAdms, setSelectedPostoAdms] = useState<string | null>(null);
+  const { GetData } = useCallApi();
 
   const navigate = useNavigate();
   const { municipioId } = useParams();
@@ -93,8 +94,9 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
         }
       },
       {
-        accessorFn: (row) => row.posto_adms_name,
-        id: 'posto_adms_name',
+        // accessorFn: (row) => row.posto_adms_name,
+        // id: 'posto_adms_name',
+        accessorKey: 'posto_adms_name',
         header: ({ column }) => (
           <DataGridColumnHeader title="Posto Administrativo Name" column={column} />
         ),
@@ -125,13 +127,13 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
             <>
               <button
                 className="btn btn-sm btn-icon btn-clear btn-light"
-                onClick={() => handleEditDialog(true, row.id)}
+                onClick={() => handleEditDialog(true, row.posto_adms_id)}
               >
                 <KeenIcon icon="notepad-edit" />
               </button>
               <button
                 className="btn btn-sm btn-icon btn-clear btn-light"
-                onClick={() => handleDeleteDialog(true, row.id)}
+                onClick={() => handleDeleteDialog(true, row.posto_adms_id)}
               >
                 <KeenIcon icon="trash" />
               </button>
@@ -151,23 +153,21 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
     try {
       sorting: sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
       filter = filter.length == 0 ? {} : { any: filter[0].value?.toLowerCase() };
-      const response = await axios.get(`${API_URL}/postoadms/list`, {
-        params: {
-          limit,
-          page: page + 1,
-          with_deleted: false,
-          order_field: sorting[0].id,
-          order_direction: sorting[0].desc ? 'DESC' : 'ASC'
-        }
+      const response = await GetData(`${API_URL}/postoadms/list`, {
+        limit,
+        page: page + 1,
+        with_deleted: false,
+        order_field: sorting[0].id,
+        order_direction: sorting[0].desc ? 'DESC' : 'ASC'
       });
-      console.log(response.data);
+      // console.log(response.data);
       // const sortedList = response.data.data.list.sort((a: PostoAdmsProps, b: PostoAdmsProps) => {
       //   if (a.name < b.name) return -1;
       //   if (a.name > b.name) return 1;
       //   return 0;
       // });
-      setPostoAdms(response.data.data.list);
-      return { data: response.data.data.list, totalCount: response.data.data.total_count };
+      setPostoAdms(response?.data.list);
+      return { data: response?.data.list, totalCount: response?.data.total_count };
     } catch (error) {
       console.error('Error fetching Postu Administrativo', error);
     }
diff --git a/src/pages/master/products/blocks/AddDialog.tsx b/src/pages/master/products/blocks/AddDialog.tsx
index 21d77d3..dc6ec88 100644
--- a/src/pages/master/products/blocks/AddDialog.tsx
+++ b/src/pages/master/products/blocks/AddDialog.tsx
@@ -100,6 +100,12 @@ const AddDialog = () => {
     }
   }, [formattedTime]);
 
+  useEffect(() => {
+    if (showAddDialog === false) {
+      resetForm();
+    }
+  }, [showAddDialog]);
+
   return (
     <Dialog open={showAddDialog} onOpenChange={(open) => handleAddDialog(open)}>
       <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
diff --git a/src/pages/master/products/blocks/ListToolbar.tsx b/src/pages/master/products/blocks/ListToolbar.tsx
index e4af4bd..9e2c916 100644
--- a/src/pages/master/products/blocks/ListToolbar.tsx
+++ b/src/pages/master/products/blocks/ListToolbar.tsx
@@ -15,7 +15,7 @@ const ListToolbar = () => {
               <KeenIcon icon="magnifier" />
               <input
                 type="text"
-                placeholder="Search Aldeias"
+                placeholder="Search Products"
                 value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
                 onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
               />
diff --git a/src/pages/master/profession/blocks/AddDialog.tsx b/src/pages/master/profession/blocks/AddDialog.tsx
index bcf21be..247ff73 100644
--- a/src/pages/master/profession/blocks/AddDialog.tsx
+++ b/src/pages/master/profession/blocks/AddDialog.tsx
@@ -81,6 +81,12 @@ const AddDialog = () => {
     }
   }, [formattedTime]);
 
+  useEffect(() => {
+    if (showAddDialog === false) {
+      resetForm();
+    }
+  }, [showAddDialog]);
+
   return (
     <Dialog open={showAddDialog} onOpenChange={(open) => handleAddDialog(open)}>
       <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
diff --git a/src/pages/master/provider/blocks/AddDialog.tsx b/src/pages/master/provider/blocks/AddDialog.tsx
index 9b7f533..854ebf9 100644
--- a/src/pages/master/provider/blocks/AddDialog.tsx
+++ b/src/pages/master/provider/blocks/AddDialog.tsx
@@ -15,14 +15,46 @@ import {
 } from '@/components/ui/dialog';
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from '@/components/ui/select';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList
+} from '@/components/ui/command';
+
+export interface CustomerProps {
+  msisdn: string;
+  email: string;
+  fullname: string;
+  username: string;
+}
+
+export interface TransactionProps {
+  id: string;
+  name: string;
+}
+
+const API_URL_CUSTOMER = apiConfig.service_customer;
+const API_URL_MASTERDATA = apiConfig.service_master_data;
+const API_URL_TRANSACTION = apiConfig.service_transaction;
 
-const API_URL = apiConfig.service_master_data;
 const AddDialog = () => {
   const { showAddDialog, handleAddDialog } = useManageProviderContext();
   const { reload } = useDataGrid();
-  const { PostData } = useCallApi();
+  const { PostData, GetData } = useCallApi();
   const parentRef = useRef<any | null>(null);
   const parsedUser = getAuth()?.user;
+  const [open, setOpen] = useState(false);
   const [alert, setAlert] = useState({
     show: false,
     message: ''
@@ -38,6 +70,8 @@ const AddDialog = () => {
     created_at: ''
   };
   const [formField, setFormField] = useState(initialState);
+  const [customers, setCustomers] = useState<CustomerProps[]>([]);
+  const [transactions, setTransactions] = useState<TransactionProps[]>([]);
   const created_time = new Date();
   const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' ');
 
@@ -49,7 +83,7 @@ const AddDialog = () => {
   const doCreateProvider = useCallback(async (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    const response = await PostData(`${API_URL}/provider/create`, formField);
+    const response = await PostData(`${API_URL_MASTERDATA}/provider/create`, formField);
 
     if (response?.status) {
       resetForm();
@@ -78,7 +112,7 @@ const AddDialog = () => {
     }
 
     doCreateProvider(e);
-    console.log(formField);
+    // console.log(formField);
     setAlert({ show: false, message: '' });
   };
 
@@ -92,6 +126,52 @@ const AddDialog = () => {
     }
   }, [formattedTime]);
 
+  useEffect(() => {
+    const getCustomerList = async (sorting: any) => {
+      try {
+        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+        const response = await GetData(`${API_URL_CUSTOMER}/customer/list`, {
+          limit: 100,
+          page: 1,
+          with_deleted: false,
+          order_field: sorting[0].id,
+          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+        });
+
+        // console.log('CUSTOMER: ', response?.data);
+        setCustomers(response?.data.list);
+      } catch (error) {
+        console.error('Error fetching customer', error);
+      }
+    };
+
+    const getTransactionTypeList = async (sorting: any) => {
+      try {
+        const response = await GetData(`${API_URL_TRANSACTION}/transactiontype/list`, {
+          limit: 100,
+          page: 1,
+          with_deleted: false,
+          order_field: sorting[0].id,
+          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+        });
+
+        // console.log('TRANSACTION TYPE: ', response?.data);
+        setTransactions(response?.data.list);
+      } catch (error) {
+        console.error('Error fetching transaction type', error);
+      }
+    };
+
+    getCustomerList([{ id: 'msisdn', desc: false }]);
+    getTransactionTypeList([{ id: 'name', desc: false }]);
+  }, []);
+
+  useEffect(() => {
+    if (showAddDialog === false) {
+      resetForm();
+    }
+  }, [showAddDialog]);
+
   return (
     <Dialog open={showAddDialog} onOpenChange={(open) => handleAddDialog(open)}>
       <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
@@ -142,12 +222,18 @@ const AddDialog = () => {
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Type<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="text"
+                    <Select
                       value={formField.type}
-                      onChange={(e) => setFormField({ ...formField, type: e.target.value })}
-                    />
+                      onValueChange={(value) => setFormField({ ...formField, type: value })}
+                    >
+                      <SelectTrigger>
+                        <SelectValue placeholder="Select Type" />
+                      </SelectTrigger>
+                      <SelectContent>
+                        <SelectItem value="h2h">H2H</SelectItem>
+                        <SelectItem value="agent">Agent</SelectItem>
+                      </SelectContent>
+                    </Select>
                   </div>
                 </div>
 
@@ -156,12 +242,18 @@ const AddDialog = () => {
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Status<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="text"
+                    <Select
                       value={formField.status}
-                      onChange={(e) => setFormField({ ...formField, status: e.target.value })}
-                    />
+                      onValueChange={(value) => setFormField({ ...formField, status: value })}
+                    >
+                      <SelectTrigger>
+                        <SelectValue placeholder="Select Status" />
+                      </SelectTrigger>
+                      <SelectContent>
+                        <SelectItem value="Y">Active</SelectItem>
+                        <SelectItem value="N">Inactive</SelectItem>
+                      </SelectContent>
+                    </Select>
                   </div>
                 </div>
 
@@ -170,28 +262,64 @@ const AddDialog = () => {
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Transaction Type Id<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="text"
+                    <Select
                       value={formField.transactionTypeId}
-                      onChange={(e) =>
-                        setFormField({ ...formField, transactionTypeId: e.target.value })
+                      onValueChange={(value) =>
+                        setFormField({ ...formField, transactionTypeId: value })
                       }
-                    />
+                    >
+                      <SelectTrigger>
+                        <SelectValue placeholder="Select Transaction Type" />
+                      </SelectTrigger>
+                      <SelectContent>
+                        {transactions.map((transaction) => (
+                          <SelectItem key={transaction.id} value={transaction.id}>
+                            {transaction.name}
+                          </SelectItem>
+                        ))}
+                      </SelectContent>
+                    </Select>
                   </div>
                 </div>
 
                 <div className="w-full">
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">
-                      Agent Id<span className="text-red-500">*</span>
+                      Agent Name<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="text"
-                      value={formField.agentId}
-                      onChange={(e) => setFormField({ ...formField, agentId: e.target.value })}
-                    />
+                    <Popover open={open} onOpenChange={setOpen}>
+                      <PopoverTrigger asChild>
+                        <button type="button" className="input col-span-5 text-left">
+                          {customers.find((customer) => customer.msisdn === formField.agentId)
+                            ?.fullname || 'Select Agent'}
+                        </button>
+                      </PopoverTrigger>
+                      <PopoverContent className="w-[400px] p-0">
+                        <Command>
+                          <CommandInput placeholder="Search Agent..." />
+                          <CommandList>
+                            <CommandEmpty>No Agent found.</CommandEmpty>
+                            <CommandGroup>
+                              {customers.map((customer) => (
+                                <CommandItem
+                                  key={customer.msisdn}
+                                  value={customer.fullname}
+                                  onSelect={() => {
+                                    setFormField({
+                                      ...formField,
+                                      agentId: customer.msisdn
+                                    });
+                                    setOpen(false);
+                                  }}
+                                >
+                                  {customer.fullname}
+                                </CommandItem>
+                              ))}
+                            </CommandGroup>
+                          </CommandList>
+                        </Command>
+                      </PopoverContent>
+                    </Popover>
                   </div>
                 </div>
 
diff --git a/src/pages/master/provider/blocks/EditDialog.tsx b/src/pages/master/provider/blocks/EditDialog.tsx
index 51b4796..3cd2b6c 100644
--- a/src/pages/master/provider/blocks/EditDialog.tsx
+++ b/src/pages/master/provider/blocks/EditDialog.tsx
@@ -15,15 +15,37 @@ import {
 } from '@/components/ui/dialog';
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from '@/components/ui/select';
+import { CustomerProps, TransactionProps } from './AddDialog';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList
+} from '@/components/ui/command';
+
+const API_URL_CUSTOMER = apiConfig.service_customer;
+const API_URL_MASTERDATA = apiConfig.service_master_data;
+const API_URL_TRANSACTION = apiConfig.service_transaction;
 
-const API_URL = apiConfig.service_master_data;
 const EditDialog = () => {
-  const { showEditDialog, handleEditDialog, selectedProvider } = useManageProviderContext();
+  const { showEditDialog, handleEditDialog, selectedProvider, provider } =
+    useManageProviderContext();
   const { reload } = useDataGrid();
-  const { PutData } = useCallApi();
+  const { PutData, GetData } = useCallApi();
   const parsedUser = getAuth()?.user;
   const created_time = new Date();
   const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' ');
+  const [open, setOpen] = useState(false);
   const [alert, setAlert] = useState({
     show: false,
     message: ''
@@ -39,6 +61,8 @@ const EditDialog = () => {
     updated_at: ''
   };
   const [formField, setFormField] = useState(initialState);
+  const [transactions, setTransactions] = useState<TransactionProps[]>([]);
+  const [customers, setCustomers] = useState<CustomerProps[]>([]);
 
   const resetForm = () => {
     setFormField(initialState);
@@ -49,7 +73,10 @@ const EditDialog = () => {
     async (e: React.FormEvent<HTMLFormElement>) => {
       e.preventDefault();
 
-      const response = await PutData(`${API_URL}/provider/update/${selectedProvider}`, formField);
+      const response = await PutData(
+        `${API_URL_MASTERDATA}/provider/update/${selectedProvider}`,
+        formField
+      );
 
       if (response?.status) {
         resetForm();
@@ -64,6 +91,25 @@ const EditDialog = () => {
     [selectedProvider, formField]
   );
 
+  const doFetchData = useCallback(async () => {
+    if (selectedProvider) {
+      const data = provider.find((item) => item.id === selectedProvider);
+      if (data) {
+        setFormField((prev) => ({
+          ...prev,
+          name: data.name,
+          description: data.description,
+          type: data.type,
+          status: data.status,
+          transactionTypeId: data.transactionTypeId,
+          agentId: data.agentId
+        }));
+      }
+    } else {
+      resetForm();
+    }
+  }, []);
+
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
@@ -80,10 +126,16 @@ const EditDialog = () => {
     }
 
     doUpdateProvider(e);
-    console.log(formField);
+    // console.log(formField);
     setAlert({ show: false, message: '' });
   };
 
+  useEffect(() => {
+    if (selectedProvider) {
+      doFetchData();
+    }
+  }, [selectedProvider]);
+
   useEffect(() => {
     if (showEditDialog) {
       setFormField({
@@ -94,6 +146,46 @@ const EditDialog = () => {
     }
   }, [formattedTime]);
 
+  useEffect(() => {
+    const getCustomerList = async (sorting: any) => {
+      try {
+        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+        const response = await GetData(`${API_URL_CUSTOMER}/customer/list`, {
+          limit: 100,
+          page: 1,
+          with_deleted: false,
+          order_field: sorting[0].id,
+          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+        });
+
+        // console.log('CUSTOMER: ', response?.data);
+        setCustomers(response?.data.list);
+      } catch (error) {
+        console.error('Error fetching customer', error);
+      }
+    };
+
+    const getTransactionTypeList = async (sorting: any) => {
+      try {
+        const response = await GetData(`${API_URL_TRANSACTION}/transactiontype/list`, {
+          limit: 100,
+          page: 1,
+          with_deleted: false,
+          order_field: sorting[0].id,
+          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+        });
+
+        // console.log('TRANSACTION TYPE: ', response?.data);
+        setTransactions(response?.data.list);
+      } catch (error) {
+        console.error('Error fetching transaction type', error);
+      }
+    };
+
+    getCustomerList([{ id: 'msisdn', desc: false }]);
+    getTransactionTypeList([{ id: 'name', desc: false }]);
+  }, []);
+
   return (
     <Dialog open={showEditDialog} onOpenChange={(open) => handleEditDialog(open, null)}>
       <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
@@ -120,7 +212,9 @@ const EditDialog = () => {
                       className="input"
                       type="text"
                       value={formField.name}
-                      onChange={(e) => setFormField({ ...formField, name: e.target.value })}
+                      onChange={({ target }) =>
+                        setFormField((prev) => ({ ...prev, name: target.value }))
+                      }
                     />
                   </div>
                 </div>
@@ -144,12 +238,18 @@ const EditDialog = () => {
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Type<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="text"
+                    <Select
                       value={formField.type}
-                      onChange={(e) => setFormField({ ...formField, type: e.target.value })}
-                    />
+                      onValueChange={(value) => setFormField({ ...formField, type: value })}
+                    >
+                      <SelectTrigger>
+                        <SelectValue placeholder="Select Type" />
+                      </SelectTrigger>
+                      <SelectContent>
+                        <SelectItem value="h2h">H2H</SelectItem>
+                        <SelectItem value="agent">Agent</SelectItem>
+                      </SelectContent>
+                    </Select>
                   </div>
                 </div>
 
@@ -158,12 +258,18 @@ const EditDialog = () => {
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Status<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="text"
+                    <Select
                       value={formField.status}
-                      onChange={(e) => setFormField({ ...formField, status: e.target.value })}
-                    />
+                      onValueChange={(value) => setFormField({ ...formField, status: value })}
+                    >
+                      <SelectTrigger>
+                        <SelectValue placeholder="Select Status" />
+                      </SelectTrigger>
+                      <SelectContent>
+                        <SelectItem value="Y">Active</SelectItem>
+                        <SelectItem value="N">Inactive</SelectItem>
+                      </SelectContent>
+                    </Select>
                   </div>
                 </div>
 
@@ -172,28 +278,64 @@ const EditDialog = () => {
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Transaction Type Id<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="text"
+                    <Select
                       value={formField.transactionTypeId}
-                      onChange={(e) =>
-                        setFormField({ ...formField, transactionTypeId: e.target.value })
+                      onValueChange={(value) =>
+                        setFormField({ ...formField, transactionTypeId: value })
                       }
-                    />
+                    >
+                      <SelectTrigger>
+                        <SelectValue placeholder="Select Transaction Type" />
+                      </SelectTrigger>
+                      <SelectContent>
+                        {transactions.map((transaction) => (
+                          <SelectItem key={transaction.id} value={transaction.id}>
+                            {transaction.name}
+                          </SelectItem>
+                        ))}
+                      </SelectContent>
+                    </Select>
                   </div>
                 </div>
 
                 <div className="w-full">
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">
-                      Agent Id<span className="text-red-500">*</span>
+                      Agent Name<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="text"
-                      value={formField.agentId}
-                      onChange={(e) => setFormField({ ...formField, agentId: e.target.value })}
-                    />
+                    <Popover open={open} onOpenChange={setOpen}>
+                      <PopoverTrigger asChild>
+                        <button type="button" className="input col-span-5 text-left">
+                          {customers.find((customer) => customer.msisdn === formField.agentId)
+                            ?.fullname || 'Select Agent'}
+                        </button>
+                      </PopoverTrigger>
+                      <PopoverContent className="w-[400px] p-0">
+                        <Command>
+                          <CommandInput placeholder="Search Agent..." />
+                          <CommandList>
+                            <CommandEmpty>No Agent found.</CommandEmpty>
+                            <CommandGroup>
+                              {customers.map((customer) => (
+                                <CommandItem
+                                  key={customer.msisdn}
+                                  value={customer.fullname}
+                                  onSelect={() => {
+                                    setFormField({
+                                      ...formField,
+                                      agentId: customer.msisdn
+                                    });
+                                    setOpen(false);
+                                  }}
+                                >
+                                  {customer.fullname}
+                                </CommandItem>
+                              ))}
+                            </CommandGroup>
+                          </CommandList>
+                        </Command>
+                      </PopoverContent>
+                    </Popover>
                   </div>
                 </div>
 
diff --git a/src/pages/master/provider/blocks/ListToolbar.tsx b/src/pages/master/provider/blocks/ListToolbar.tsx
index 24a532f..8c1ba4d 100644
--- a/src/pages/master/provider/blocks/ListToolbar.tsx
+++ b/src/pages/master/provider/blocks/ListToolbar.tsx
@@ -15,7 +15,7 @@ const ListToolbar = () => {
               <KeenIcon icon="magnifier" />
               <input
                 type="text"
-                placeholder="Search Profession"
+                placeholder="Search Provider"
                 value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
                 onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
               />
diff --git a/src/pages/master/provider/hooks/ManageProviderContext.tsx b/src/pages/master/provider/hooks/ManageProviderContext.tsx
index 10482a6..43635b5 100644
--- a/src/pages/master/provider/hooks/ManageProviderContext.tsx
+++ b/src/pages/master/provider/hooks/ManageProviderContext.tsx
@@ -7,6 +7,7 @@ import { Toaster } from 'sonner';
 import ListToolbar from '../blocks/ListToolbar';
 
 interface ProviderProps {
+  id: string;
   name: string;
   description: string;
   type: string;
@@ -167,7 +168,7 @@ const ManageProviderContextProvider = ({ children }: { children: React.ReactNode
         order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
         filter: JSON.stringify(filter)
       });
-      console.log(response?.data);
+      // console.log(response?.data);
       setProvider(response?.data.list);
       return { data: response?.data.list, totalCount: response?.data.total_count };
     } catch (error) {
diff --git a/src/pages/master/sucos/blocks/AddDialog.tsx b/src/pages/master/sucos/blocks/AddDialog.tsx
index 51909e6..e9e0ad0 100644
--- a/src/pages/master/sucos/blocks/AddDialog.tsx
+++ b/src/pages/master/sucos/blocks/AddDialog.tsx
@@ -67,7 +67,7 @@ const AddDialog = () => {
       return;
     }
 
-    // doCreateSucos(e);
+    doCreateSucos(e);
     console.log(formField);
     setAlert({ show: false, message: '' });
   };
@@ -82,6 +82,12 @@ const AddDialog = () => {
     }
   }, [formattedTime]);
 
+  useEffect(() => {
+    if (showAddDialog === false) {
+      resetForm();
+    }
+  }, [showAddDialog]);
+
   return (
     <Dialog open={showAddDialog} onOpenChange={(open) => handleAddDialog(open)}>
       <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
diff --git a/src/pages/master/sucos/blocks/EditDialog.tsx b/src/pages/master/sucos/blocks/EditDialog.tsx
index f655658..6d70b64 100644
--- a/src/pages/master/sucos/blocks/EditDialog.tsx
+++ b/src/pages/master/sucos/blocks/EditDialog.tsx
@@ -73,7 +73,7 @@ const EditDialog = () => {
       return;
     }
 
-    // doUpdateSucos(e);
+    doUpdateSucos(e);
     console.log(formField);
     setAlert({ show: false, message: '' });
   };
diff --git a/src/pages/master/sucos/blocks/ListToolbar.tsx b/src/pages/master/sucos/blocks/ListToolbar.tsx
index 2c359c6..3bd0a1a 100644
--- a/src/pages/master/sucos/blocks/ListToolbar.tsx
+++ b/src/pages/master/sucos/blocks/ListToolbar.tsx
@@ -1,10 +1,23 @@
 import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components';
-import { useManageSucosContext } from '../hooks/useManageSucosContext';
 import { Button } from '@/components/ui/button';
+import { useCallback, useState } from 'react';
+import { toast } from 'sonner';
+import { useManageSucosContext } from '../hooks/useManageSucosContext';
 
 const ListToolbar = () => {
   const { table, reload } = useDataGrid();
   const { handleAddDialog, handleSearchDialog } = useManageSucosContext();
+  const [searchName, setSearchName] = useState('');
+  const [isLoading, setIsLoading] = useState(false);
+
+  const handleFilterData = useCallback(() => {
+    try {
+      table.getColumn('name')?.setFilterValue(searchName);
+    } catch (error) {
+      toast.error('Error applying filter');
+      console.error('Error applying filter:', error);
+    }
+  }, [searchName, table]);
 
   return (
     <div className="card-header flex-wrap gap-2 border-b-0 px-5">
@@ -16,10 +29,8 @@ const ListToolbar = () => {
               <input
                 type="text"
                 placeholder="Search Sucos"
-                value={(table.getColumn('sucos_name')?.getFilterValue() as string) ?? ''}
-                onChange={(event) =>
-                  table.getColumn('sucos_name')?.setFilterValue(event.target.value)
-                }
+                value={searchName}
+                onChange={(event) => setSearchName(event.target.value)}
               />
             </label>
             <DefaultTooltip title={'Filter'} placement={'top'}>
@@ -27,19 +38,19 @@ const ListToolbar = () => {
                 variant="outline"
                 className="h-7.5 disabled:bg-gray-400"
                 // disabled={isLoading}
-                // onClick={handleFilterData}
+                onClick={handleFilterData}
               >
                 {/* {loadingButton === 'filter' ? <ContentLoader /> : <KeenIcon icon="filter" />} */}
                 <KeenIcon icon="filter" />
               </Button>
             </DefaultTooltip>
-            <Button
+            {/* <Button
               variant="outline"
               className="h-7.5 text-[0.8rem]"
               onClick={() => handleSearchDialog(true)}
             >
-              Search Aldeias
-            </Button>
+              Search Postu Administrativo
+            </Button> */}
           </div>
           <div className="flex gap-3 items-center">
             <Button
diff --git a/src/pages/members/kyc/Columns.tsx b/src/pages/members/kyc/Columns.tsx
index 195f62a..541ac16 100644
--- a/src/pages/members/kyc/Columns.tsx
+++ b/src/pages/members/kyc/Columns.tsx
@@ -192,4 +192,5 @@ export const initialMember = {
   suco: "",
   aldeia: "",
   profession: "",
+  description: ""
 }
diff --git a/src/pages/members/kyc/Kyc.tsx b/src/pages/members/kyc/Kyc.tsx
index aa57d52..151eb71 100644
--- a/src/pages/members/kyc/Kyc.tsx
+++ b/src/pages/members/kyc/Kyc.tsx
@@ -90,6 +90,7 @@ const Kyc = () => {
     const userLogin: any = await getUser();
     const updateData: any = member;
     const customerId = member.id;
+    const description = member.description;
     updateData.updated_by = userLogin.data ? userLogin.data.id : ''
     let today = new Date();
     updateData.updated_at = today.toString();
@@ -102,6 +103,7 @@ const Kyc = () => {
     delete updateData.no;
     delete updateData.destinationGroup;
     delete updateData.statusApproval;
+    delete updateData.description;
     delete updateData.group_id;
     delete updateData.group_name;
     delete updateData.group_description;
@@ -118,7 +120,10 @@ const Kyc = () => {
       }
       if (dialogType === 'update') {
         await axios.put(`${BASE_URL}/customer/update/${customerId}`, updateData)
-        if (updateData.isneedapproval == 1) await axios.post(`${BASE_URL}/customer/approve`, {customerid: customerId})
+        if (updateData.isneedapproval == 1) await axios.post(`${BASE_URL}/customer/approve`, {
+          customerid: customerId,
+          description: description
+        })
       }
       await fetchGroups();
       setDialogOpen(false)
diff --git a/src/pages/members/manage-members/CustomerDetailModal.tsx b/src/pages/members/manage-members/CustomerDetailModal.tsx
index 00c5dd1..1e3abfd 100644
--- a/src/pages/members/manage-members/CustomerDetailModal.tsx
+++ b/src/pages/members/manage-members/CustomerDetailModal.tsx
@@ -242,6 +242,13 @@ const CustomerDialog = ({ open, handleClose, handleSubmit, initialData, viewStat
         <TextField disabled={viewOnly} fullWidth margin="dense" label="Bank Name" name="bank_name" value={formData.bank_name} onChange={handleChange} />
         <TextField disabled={viewOnly} fullWidth margin="dense" label="Bank Account" name="bank_account" value={formData.bank_account} onChange={handleChange} />
         <TextField disabled={viewOnly} fullWidth margin="dense" label="iBank Number" name="ibank_number" value={formData.ibank_number} onChange={handleChange} />
+        <Divider className="pt-7"/>
+        <Typography sx={{color:'grey'}}>Approval</Typography>
+        {
+          page === 'kyc' ? (
+            <TextField fullWidth margin="dense" label="Approval Description" name="description" value={formData.description} onChange={handleChange} />
+          ) : ('')
+        }
       </DialogContent>
       <DialogActions>
         <Button onClick={() => viewOnly ? setViewOnly(false) : setViewOnly(true)} color="secondary">{ viewOnly ? (`Open Edit`) : (`Close Edit`) }</Button>
diff --git a/src/pages/members/manage-members/ManageMembers.tsx b/src/pages/members/manage-members/ManageMembers.tsx
index 044b05d..a0d1959 100644
--- a/src/pages/members/manage-members/ManageMembers.tsx
+++ b/src/pages/members/manage-members/ManageMembers.tsx
@@ -82,6 +82,7 @@ const ManageMembers = () => {
     delete updateData.no;
     delete updateData.destinationGroup;
     delete updateData.statusApproval;
+    delete updateData.description;
     delete updateData.group_id;
     delete updateData.group_name;
     delete updateData.group_description;

From 1cfda6745e74b6c3e3c06bcb2514b5f63fae68dd Mon Sep 17 00:00:00 2001
From: Wikzyy <alwi.erdi4@gmail.com>
Date: Tue, 18 Mar 2025 10:36:40 +0700
Subject: [PATCH 04/19] chore: simplify status display by replacing
 EnforceSwitch with badges

---
 .../manage-position/hooks/ManagePositionContext.tsx | 13 +++++++++----
 .../user/manage-user/hooks/ManageUserContext.tsx    | 13 +++++++++----
 2 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/src/pages/settings/user/manage-position/hooks/ManagePositionContext.tsx b/src/pages/settings/user/manage-position/hooks/ManagePositionContext.tsx
index ee3f565..2bc9d80 100644
--- a/src/pages/settings/user/manage-position/hooks/ManagePositionContext.tsx
+++ b/src/pages/settings/user/manage-position/hooks/ManagePositionContext.tsx
@@ -85,11 +85,16 @@ const ManagePositionContextProvider = ({ children }: { children: React.ReactNode
         enableSorting: false,
         enableHiding: false,
         cell: ({ row }) => {
+          const isActive = row.original.status === 'Y';
+
           return (
-            <EnforceSwitch
-              enforce={row.original.status == 'Y' ? true : false}
-              onChange={() => {}}
-            />
+            <span
+              className={`px-2 py-1 text-xs font-semibold rounded-full ${
+                isActive ? 'bg-green-100 text-green-600' : 'bg-red-100 text-red-600'
+              }`}
+            >
+              {isActive ? 'Active' : 'Inactive'}
+            </span>
           );
         },
         meta: {
diff --git a/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx b/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx
index 284ce93..efae604 100644
--- a/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx
+++ b/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx
@@ -127,11 +127,16 @@ const ManageUserContextProvider = ({ children }: { children: React.ReactNode })
         enableSorting: false,
         enableHiding: false,
         cell: ({ row }) => {
+          const isActive = row.original.status === 'Y';
+
           return (
-            <EnforceSwitch
-              enforce={row.original.status == 'Y' ? true : false}
-              onChange={() => {}}
-            />
+            <span
+              className={`px-2 py-1 text-xs font-semibold rounded-full ${
+                isActive ? 'bg-green-100 text-green-600' : 'bg-red-100 text-red-600'
+              }`}
+            >
+              {isActive ? 'Active' : 'Inactive'}
+            </span>
           );
         },
         meta: {

From e0c064c74931a85ea2acb8d428b9d5345336b881 Mon Sep 17 00:00:00 2001
From: Wikzyy <alwi.erdi4@gmail.com>
Date: Tue, 18 Mar 2025 10:46:39 +0700
Subject: [PATCH 05/19] feat: increase fetchSucos limit and add doFetchData
 function

---
 src/pages/master/aldeias/blocks/AddDialog.tsx | 38 +++++------
 .../master/aldeias/blocks/EditDialog.tsx      | 68 +++++++++++++------
 .../master/municipios/blocks/EditDialog.tsx   | 43 +++++++++---
 .../master/postoadms/blocks/AddDialog.tsx     | 38 +++++------
 .../master/postoadms/blocks/EditDialog.tsx    | 67 ++++++++++++------
 .../master/products/blocks/EditDialog.tsx     | 33 ++++++++-
 6 files changed, 199 insertions(+), 88 deletions(-)

diff --git a/src/pages/master/aldeias/blocks/AddDialog.tsx b/src/pages/master/aldeias/blocks/AddDialog.tsx
index 26c53f3..af089ef 100644
--- a/src/pages/master/aldeias/blocks/AddDialog.tsx
+++ b/src/pages/master/aldeias/blocks/AddDialog.tsx
@@ -78,6 +78,24 @@ const AddDialog = () => {
     [formField]
   );
 
+  const doFetchSucos = async (sorting: any) => {
+    try {
+      sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+      const response = await GetData(`${API_URL}/sucos/list`, {
+        limit: 1000,
+        page: 1,
+        with_deleted: false,
+        order_field: sorting[0].id,
+        order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+      });
+
+      // console.log('SUCOS', response?.data);
+      setSucos(response?.data.list);
+    } catch (error) {
+      console.error('Error fetching municipios', error);
+    }
+  };
+
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
@@ -102,25 +120,7 @@ const AddDialog = () => {
   }, [formattedTime]);
 
   useEffect(() => {
-    const fetchSucos = async (sorting: any) => {
-      try {
-        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
-        const response = await GetData(`${API_URL}/sucos/list`, {
-          limit: 100,
-          page: 1,
-          with_deleted: false,
-          order_field: sorting[0].id,
-          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
-        });
-
-        // console.log('SUCOS', response?.data);
-        setSucos(response?.data.list);
-      } catch (error) {
-        console.error('Error fetching municipios', error);
-      }
-    };
-
-    fetchSucos([{ id: 'name', desc: false }]);
+    doFetchSucos([{ id: 'name', desc: false }]);
   }, []);
 
   useEffect(() => {
diff --git a/src/pages/master/aldeias/blocks/EditDialog.tsx b/src/pages/master/aldeias/blocks/EditDialog.tsx
index 179208c..d69981e 100644
--- a/src/pages/master/aldeias/blocks/EditDialog.tsx
+++ b/src/pages/master/aldeias/blocks/EditDialog.tsx
@@ -77,6 +77,42 @@ const EditDialog = () => {
     [selectedAldeias, formField]
   );
 
+  const doFetchSucos = async (sorting: any) => {
+    try {
+      sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+      const response = await GetData(`${API_URL}/sucos/list`, {
+        limit: 1000,
+        page: 1,
+        with_deleted: false,
+        order_field: sorting[0].id,
+        order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+      });
+
+      // console.log('SUCOS', response?.data);
+      setSucos(response?.data.list);
+    } catch (error) {
+      console.error('Error fetching municipios', error);
+    }
+  };
+
+  const doFetchData = useCallback(async (id: string) => {
+    const response = await GetData(`${API_URL}/aldeias/getdata/${id}`, { id });
+
+    if (response?.status) {
+      setFormField((prev) => ({
+        ...prev,
+        name: response.data.name,
+        sucos_id: response.data.sucos.id
+      }));
+    } else {
+      setFormField((prev) => ({
+        ...prev,
+        name: '',
+        sucos_id: 0
+      }));
+    }
+  }, []);
+
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
@@ -90,6 +126,18 @@ const EditDialog = () => {
     setAlert({ show: false, message: '' });
   };
 
+  useEffect(() => {
+    if (selectedAldeias) {
+      doFetchData(selectedAldeias);
+    }
+  }, [selectedAldeias]);
+
+  useEffect(() => {
+    if (showEditDialog === false) {
+      resetForm();
+    }
+  }, [showEditDialog]);
+
   useEffect(() => {
     if (showEditDialog) {
       setFormField({
@@ -101,25 +149,7 @@ const EditDialog = () => {
   }, [formattedTime]);
 
   useEffect(() => {
-    const fetchSucos = async (sorting: any) => {
-      try {
-        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
-        const response = await GetData(`${API_URL}/sucos/list`, {
-          limit: 100,
-          page: 1,
-          with_deleted: false,
-          order_field: sorting[0].id,
-          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
-        });
-
-        // console.log('SUCOS', response?.data);
-        setSucos(response?.data.list);
-      } catch (error) {
-        console.error('Error fetching municipios', error);
-      }
-    };
-
-    fetchSucos([{ id: 'name', desc: false }]);
+    doFetchSucos([{ id: 'name', desc: false }]);
   }, []);
 
   return (
diff --git a/src/pages/master/municipios/blocks/EditDialog.tsx b/src/pages/master/municipios/blocks/EditDialog.tsx
index 8cf5d5f..50406bc 100644
--- a/src/pages/master/municipios/blocks/EditDialog.tsx
+++ b/src/pages/master/municipios/blocks/EditDialog.tsx
@@ -25,7 +25,7 @@ const EditDialog = () => {
   const { showEditDialog, handleEditDialog, selectedMunicipios, municipios } =
     useManageMunicipiosContext();
   const { reload } = useDataGrid();
-  const { PutData } = useCallApi();
+  const { PutData, GetData } = useCallApi();
   const parsedUser = getAuth()?.user;
   const [alert, setAlert] = useState({
     show: false,
@@ -44,6 +44,7 @@ const EditDialog = () => {
 
   const resetForm = () => {
     setFormField(initialState);
+    setAlert({ show: false, message: '' });
   };
 
   const doUpdateMunicipios = useCallback(
@@ -74,6 +75,22 @@ const EditDialog = () => {
     [selectedMunicipios, formField]
   );
 
+  const doFetchData = useCallback(async (id: string) => {
+    const response = await GetData(`${API_URL}/municipios/getdata/${id}`, { id });
+
+    if (response?.status) {
+      setFormField((prev) => ({
+        ...prev,
+        name: response.data.name
+      }));
+    } else {
+      setFormField((prev) => ({
+        ...prev,
+        name: ''
+      }));
+    }
+  }, []);
+
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
@@ -82,20 +99,22 @@ const EditDialog = () => {
       return;
     }
 
-    // setFormField({
-    //   name: formField.name,
-    //   created_by: parsedUser.email,
-    //   created_at: formattedTime
-    // });
-
     doUpdateMunicipios(e);
     console.log(formField);
     setAlert({ show: false, message: '' });
   };
 
-  // const doFetchMunicipios = useCallback(async (id: string) => {
-  //   const response = await axios.get(`${API_URL}/municipios/${id}`);
-  // }, []);
+  useEffect(() => {
+    if (selectedMunicipios) {
+      doFetchData(selectedMunicipios);
+    }
+  }, [selectedMunicipios]);
+
+  useEffect(() => {
+    if (showEditDialog === false) {
+      resetForm();
+    }
+  }, [showEditDialog]);
 
   useEffect(() => {
     if (selectedMunicipios) {
@@ -127,7 +146,9 @@ const EditDialog = () => {
               <div className="card-body grid gap-5">
                 <div className="w-full">
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
-                    <label className="form-label flex items-center gap-1 max-w-56">Name</label>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      Name<span className="text-red-500">*</span>
+                    </label>
                     <Input
                       className="input"
                       type="text"
diff --git a/src/pages/master/postoadms/blocks/AddDialog.tsx b/src/pages/master/postoadms/blocks/AddDialog.tsx
index 64590bf..fa7c7dd 100644
--- a/src/pages/master/postoadms/blocks/AddDialog.tsx
+++ b/src/pages/master/postoadms/blocks/AddDialog.tsx
@@ -80,6 +80,24 @@ const AddDialog = () => {
     [formField]
   );
 
+  const doFetchMunicipios = async (sorting: any) => {
+    try {
+      sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+      const response = await GetData(`${API_URL}/municipios/list`, {
+        limit: 100,
+        page: 1,
+        with_deleted: false,
+        order_field: sorting[0].id,
+        order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+      });
+
+      // console.log(response?.data);
+      setMunicipios(response?.data.list);
+    } catch (error) {
+      console.error('Error fetching municipios', error);
+    }
+  };
+
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
@@ -110,25 +128,7 @@ const AddDialog = () => {
   }, [showAddDialog]);
 
   useEffect(() => {
-    const fetchMunicipios = async (sorting: any) => {
-      try {
-        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
-        const response = await GetData(`${API_URL}/municipios/list`, {
-          limit: 100,
-          page: 1,
-          with_deleted: false,
-          order_field: sorting[0].id,
-          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
-        });
-
-        // console.log(response?.data);
-        setMunicipios(response?.data.list);
-      } catch (error) {
-        console.error('Error fetching municipios', error);
-      }
-    };
-
-    fetchMunicipios([{ id: 'name', desc: false }]);
+    doFetchMunicipios([{ id: 'name', desc: false }]);
   }, []);
 
   return (
diff --git a/src/pages/master/postoadms/blocks/EditDialog.tsx b/src/pages/master/postoadms/blocks/EditDialog.tsx
index abb8f0d..d170d1a 100644
--- a/src/pages/master/postoadms/blocks/EditDialog.tsx
+++ b/src/pages/master/postoadms/blocks/EditDialog.tsx
@@ -80,6 +80,41 @@ const EditDialog = () => {
     [selectedPostoAdms, formField]
   );
 
+  const doFetchMunicipios = useCallback(async (sorting: any) => {
+    try {
+      sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+      const response = await GetData(`${API_URL}/municipios/list`, {
+        limit: 100,
+        page: 1,
+        with_deleted: false,
+        order_field: sorting[0].id,
+        order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+      });
+
+      // console.log('MUNICIPIOS: ', response?.data);
+      setMunicipios(response?.data.list);
+    } catch (error) {
+      console.error('Error fetching municipios', error);
+    }
+  }, []);
+
+  const doFetchData = useCallback(async (id: string) => {
+    const response = await GetData(`${API_URL}/postoadms/getdata/${id}`, { id });
+
+    if (response?.status) {
+      setFormField((prev) => ({
+        ...prev,
+        name: response.data.name,
+        municipio_id: response.data.municipios.id
+      }));
+    } else {
+      setFormField((prev) => ({
+        ...prev,
+        name: ''
+      }));
+    }
+  }, []);
+
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
@@ -93,6 +128,18 @@ const EditDialog = () => {
     setAlert({ show: false, message: '' });
   };
 
+  useEffect(() => {
+    if (showEditDialog === false) {
+      resetForm();
+    }
+  }, [showEditDialog]);
+
+  useEffect(() => {
+    if (selectedPostoAdms) {
+      doFetchData(selectedPostoAdms);
+    }
+  }, [selectedPostoAdms]);
+
   useEffect(() => {
     if (selectedPostoAdms) {
       setFormField({
@@ -104,25 +151,7 @@ const EditDialog = () => {
   }, [formattedTime]);
 
   useEffect(() => {
-    try {
-      const fetchMunicipios = async (sorting: any) => {
-        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
-        const response = await GetData(`${API_URL}/municipios/list`, {
-          limit: 100,
-          page: 1,
-          with_deleted: false,
-          order_field: sorting[0].id,
-          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
-        });
-
-        // console.log(response?.data);
-        setMunicipios(response?.data.list);
-      };
-
-      fetchMunicipios([{ id: 'name', desc: false }]);
-    } catch (error) {
-      console.error('Error fetching municipios', error);
-    }
+    doFetchMunicipios([{ id: 'name', desc: false }]);
   }, []);
 
   // console.log(selectedPostoAdms);
diff --git a/src/pages/master/products/blocks/EditDialog.tsx b/src/pages/master/products/blocks/EditDialog.tsx
index a34f93d..06eb7b6 100644
--- a/src/pages/master/products/blocks/EditDialog.tsx
+++ b/src/pages/master/products/blocks/EditDialog.tsx
@@ -20,7 +20,7 @@ const API_URL = apiConfig.service_master_data;
 const EditDialog = () => {
   const { showEditDialog, handleEditDialog, selectedProducts } = useManageProductsContext();
   const { reload } = useDataGrid();
-  const { PutData } = useCallApi();
+  const { PutData, GetData } = useCallApi();
   const parsedUser = getAuth()?.user;
   const created_time = new Date();
   const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' ');
@@ -66,6 +66,25 @@ const EditDialog = () => {
     [selectedProducts, formField]
   );
 
+  const doFetchData = useCallback(async (id: string) => {
+    const response = await GetData(`${API_URL}/product/getdata/${selectedProducts}`, { id });
+
+    if (response?.status) {
+      setFormField((prev) => ({
+        ...prev,
+        name: response.data.name,
+        description: response.data.description,
+        price_point: response.data.price_point,
+        price_cash: response.data.price_cash,
+        cashback_point: response.data.cashback_point,
+        cashback_cash: response.data.cashback_cash,
+        status: response.data.status
+      }));
+    } else {
+      setFormField(initialState);
+    }
+  }, []);
+
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
@@ -89,6 +108,18 @@ const EditDialog = () => {
     setAlert({ show: false, message: '' });
   };
 
+  useEffect(() => {
+    if (showEditDialog === false) {
+      resetForm();
+    }
+  }, [showEditDialog]);
+
+  useEffect(() => {
+    if (selectedProducts) {
+      doFetchData(selectedProducts);
+    }
+  }, [selectedProducts]);
+
   useEffect(() => {
     if (showEditDialog) {
       setFormField({

From 1127c2c05f5adc21418c448b318d4983f812d717 Mon Sep 17 00:00:00 2001
From: Wikzyy <alwi.erdi4@gmail.com>
Date: Tue, 18 Mar 2025 11:11:13 +0700
Subject: [PATCH 06/19] fix width column table

---
 src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx | 2 +-
 src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx   | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx b/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx
index 63697d4..05c5931 100644
--- a/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx
+++ b/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx
@@ -120,7 +120,7 @@ const ManageMunicipiosProvider = ({ children }: { children: React.ReactNode }) =
         enableSorting: true,
         enableHiding: false,
         meta: {
-          headerClassName: 'w-[1000px]'
+          headerClassName: 'w-[250px]'
         }
       },
       {
diff --git a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
index 4c3ca65..986db2e 100644
--- a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
+++ b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
@@ -104,7 +104,7 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
         enableSorting: true,
         enableHiding: false,
         meta: {
-          headerClassName: 'w-[1000px]'
+          headerClassName: 'w-[250px]'
         }
       },
       {
@@ -114,7 +114,7 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
         enableSorting: true,
         enableHiding: false,
         meta: {
-          headerClassName: 'w-[1000px]'
+          headerClassName: 'w-[250px]'
         }
       },
       {

From 8026d6910a9ba53758aa86dce20a5d5caf83f8ed Mon Sep 17 00:00:00 2001
From: Raja Oktafrianto <rajaoktafrianto3.com>
Date: Tue, 18 Mar 2025 11:20:43 +0700
Subject: [PATCH 07/19] update add data sucos

---
 src/pages/master/sucos/blocks/AddDialog.tsx   | 108 +++++++++--
 src/pages/master/sucos/blocks/ListToolbar.tsx |  21 +-
 .../master/sucos/blocks/SearchDialog.tsx      | 181 ++++++++----------
 .../master/sucos/hooks/ManageSucosContext.tsx |   3 +-
 4 files changed, 180 insertions(+), 133 deletions(-)

diff --git a/src/pages/master/sucos/blocks/AddDialog.tsx b/src/pages/master/sucos/blocks/AddDialog.tsx
index e9e0ad0..1eae604 100644
--- a/src/pages/master/sucos/blocks/AddDialog.tsx
+++ b/src/pages/master/sucos/blocks/AddDialog.tsx
@@ -15,15 +15,30 @@ import {
 } from '@/components/ui/dialog';
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList
+} from '@/components/ui/command';
 
+interface PostoAdmsProps {
+  PostoAdms_id: number;
+  PostoAdms_name: string;
+}
 const API_URL = apiConfig.service_master_data;
 
 const AddDialog = () => {
   const parentRef = useRef<any | null>(null);
   const { showAddDialog, handleAddDialog } = useManageSucosContext();
   const { reload } = useDataGrid();
-  const { PostData } = useCallApi();
+  const { PostData, GetData } = useCallApi();
   const parsedUser = getAuth()?.user;
+  const [posto_adms, setPostoadms] = useState<PostoAdmsProps[]>([]);
+  const [open, setOpen] = useState(false);
   const [alert, setAlert] = useState({
     show: false,
     message: ''
@@ -44,20 +59,23 @@ const AddDialog = () => {
     setAlert({ show: false, message: '' });
   };
 
-  const doCreateSucos = useCallback(async (e: React.FormEvent<HTMLFormElement>) => {
-    e.preventDefault();
-    const response = await PostData(`${API_URL}/sucos/create`, formField);
+  const doCreateSucos = useCallback(
+    async (e: React.FormEvent<HTMLFormElement>) => {
+      e.preventDefault();
+      const response = await PostData(`${API_URL}/sucos/create`, formField);
 
-    if (response?.status) {
-      resetForm();
-      handleAddDialog(false);
-      reload();
-      toast.success('Success Create Sucos');
-    } else {
-      toast.error('Failed Create Sucos');
-      setAlert({ show: true, message: response?.message });
-    }
-  }, []);
+      if (response?.status) {
+        resetForm();
+        handleAddDialog(false);
+        reload();
+        toast.success('Sucos created successfully!');
+      } else {
+        toast.error('Failed to create Sucos Please try again.');
+        setAlert({ show: true, message: 'Failed to create Sucos Please try again.' });
+      }
+    },
+    [formField]
+  );
 
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
@@ -76,7 +94,7 @@ const AddDialog = () => {
     if (showAddDialog) {
       setFormField({
         ...formField,
-        created_by: parsedUser.username,
+        created_by: parsedUser?.username,
         created_at: formattedTime
       });
     }
@@ -88,9 +106,30 @@ const AddDialog = () => {
     }
   }, [showAddDialog]);
 
+  useEffect(() => {
+    const fetchPostoAdms = async (sorting: any) => {
+      try {
+        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+        const response = await GetData(`${API_URL}/postoadms/list`, {
+          limit: 100,
+          page: 1,
+          with_deleted: false,
+          order_field: sorting[0].id,
+          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+        });
+        console.log('ini data posto :', response?.data);
+        setPostoadms(response?.data.list || []);
+      } catch (error) {
+        console.log('Error fetching posto', error);
+      }
+    };
+
+    fetchPostoAdms([{ id: 'name', desc: false }]);
+  }, []);
+
   return (
     <Dialog open={showAddDialog} onOpenChange={(open) => handleAddDialog(open)}>
-      <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
+      <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5">
         <DialogHeader>
           <DialogTitle>Sucos - Create</DialogTitle>
           <DialogDescription></DialogDescription>
@@ -124,7 +163,40 @@ const AddDialog = () => {
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Posto Adm ID<span className="text-red-500">*</span>
                     </label>
-                    <Input
+                    <Popover open={open} onOpenChange={setOpen}>
+                      <PopoverTrigger asChild>
+                        <button type="button" className="input col-span-5 text-left">
+                          {posto_adms.find((posto) => posto.PostoAdms_id === formField.posto_adm_id)
+                            ?.PostoAdms_name || 'Select Posto Administrativo'}
+                        </button>
+                      </PopoverTrigger>
+                      <PopoverContent className="w-[400px] p-0">
+                        <Command>
+                          <CommandInput placeholder="Search Posto Adms..." />
+                          <CommandList>
+                            <CommandEmpty>No Posto Adms Found.</CommandEmpty>
+                            <CommandGroup>
+                              {posto_adms.map((posto) => (
+                                <CommandItem
+                                  key={posto.PostoAdms_id}
+                                  value={posto.PostoAdms_name}
+                                  onSelect={() => {
+                                    setFormField({
+                                      ...formField,
+                                      posto_adm_id: posto.PostoAdms_id
+                                    });
+                                    setOpen(false);
+                                  }}
+                                >
+                                  {posto.PostoAdms_name}
+                                </CommandItem>
+                              ))}
+                            </CommandGroup>
+                          </CommandList>
+                        </Command>
+                      </PopoverContent>
+                    </Popover>
+                    {/* <Input
                       className="input"
                       type="number"
                       min={0}
@@ -133,7 +205,7 @@ const AddDialog = () => {
                         const value = parseInt(e.target.value, 10);
                         setFormField({ ...formField, posto_adm_id: isNaN(value) ? 0 : value });
                       }}
-                    />
+                    /> */}
                   </div>
                 </div>
 
diff --git a/src/pages/master/sucos/blocks/ListToolbar.tsx b/src/pages/master/sucos/blocks/ListToolbar.tsx
index 8779cad..f5cd607 100644
--- a/src/pages/master/sucos/blocks/ListToolbar.tsx
+++ b/src/pages/master/sucos/blocks/ListToolbar.tsx
@@ -1,23 +1,10 @@
 import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components';
 import { Button } from '@/components/ui/button';
-import { useCallback, useState } from 'react';
-import { toast } from 'sonner';
 import { useManageSucosContext } from '../hooks/useManageSucosContext';
 
 const ListToolbar = () => {
   const { table, reload } = useDataGrid();
   const { handleAddDialog, handleSearchDialog } = useManageSucosContext();
-  const [searchName, setSearchName] = useState('');
-  const [isLoading, setIsLoading] = useState(false);
-
-  const handleFilterData = useCallback(() => {
-    try {
-      table.getColumn('name')?.setFilterValue(searchName);
-    } catch (error) {
-      toast.error('Error applying filter');
-      console.error('Error applying filter:', error);
-    }
-  }, [searchName, table]);
 
   return (
     <div className="card-header flex-wrap gap-2 border-b-0 px-5">
@@ -29,8 +16,10 @@ const ListToolbar = () => {
               <input
                 type="text"
                 placeholder="Search Sucos"
-                value={searchName}
-                onChange={(event) => setSearchName(event.target.value)}
+                value={table.getColumn(`sucos_id`)?.getFilterValue() as string}
+                onChange={(event) =>
+                  table.getColumn('sucos_name')?.setFilterValue(event.target.value)
+                }
               />
             </label>
             <DefaultTooltip title={'Filter'} placement={'top'}>
@@ -38,7 +27,7 @@ const ListToolbar = () => {
                 variant="outline"
                 className="h-7.5 disabled:bg-gray-400"
                 // disabled={isLoading}
-                onClick={handleFilterData}
+                // onClick={handleFilterData}
               >
                 {/* {loadingButton === 'filter' ? <ContentLoader /> : <KeenIcon icon="filter" />} */}
                 <KeenIcon icon="filter" />
diff --git a/src/pages/master/sucos/blocks/SearchDialog.tsx b/src/pages/master/sucos/blocks/SearchDialog.tsx
index 22ef4c9..e744347 100644
--- a/src/pages/master/sucos/blocks/SearchDialog.tsx
+++ b/src/pages/master/sucos/blocks/SearchDialog.tsx
@@ -1,4 +1,4 @@
-import { useContext, useEffect, useRef, useState } from 'react';
+import { useRef, useState } from 'react';
 import {
   Dialog,
   DialogBody,
@@ -8,18 +8,19 @@ import {
   DialogTitle
 } from '@/components/ui/dialog';
 import { Alert, KeenIcon } from '@/components';
-import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
 import { apiConfig } from '@/config/api.config';
 import axios from 'axios';
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue
-} from '@/components/ui/select';
 import { useManageSucosContext } from '../hooks/useManageSucosContext';
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList
+} from '@/components/ui/command';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
 
 interface AldeiasProps {
   id: number;
@@ -30,14 +31,8 @@ const API_URL = apiConfig.service_master_data;
 
 const SearchDialog = () => {
   const parentRef = useRef<any | null>(null);
+  const [open, setOpen] = useState(false);
   const { showSearchDialog, handleSearchDialog, sucos } = useManageSucosContext();
-  console.log('Sucos:', sucos);
-  // const { sucos, getSucosLists } = useContext(ManageSucosContext);
-
-  // useEffect(() => {
-  //   getSucosLists(1, 1000, [], []); // Memuat semua sucos
-  // }, []);
-
   const [alert, setAlert] = useState({
     show: false,
     message: ''
@@ -51,7 +46,7 @@ const SearchDialog = () => {
   const resetForm = () => {
     setFormField(initialState);
   };
-  const [aldeias, setAldeias] = useState<AldeiasProps[]>([]);
+  const [aldeia, setAldeia] = useState<AldeiasProps[]>([]);
   const [isFound, setIsFound] = useState(false);
 
   const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
@@ -64,23 +59,21 @@ const SearchDialog = () => {
     }
 
     try {
-      const response = await axios.get(`${API_URL}/sucos/aldeias/${id}`);
-      console.log('API Response Data:', response.data.data);
-      console.log('aldeias data:', aldeias);
-      console.log('isFound:', isFound);
+      const response = await axios.get(`${API_URL}/postoadms/sucos/${id}`);
 
       if (response.data.status) {
-        setAldeias(response.data.data);
+        setAldeia(response.data.data);
+        console.log(aldeia);
         setIsFound(true);
-        console.log('Found aldeias: ', response.data.data);
+        console.log('Found Sucos: ', response.data.data);
       } else {
-        setAldeias([]);
+        setAldeia([]);
         setIsFound(false);
-        setAlert({ show: true, message: 'No aldeias found.' });
+        setAlert({ show: true, message: 'No sucos found.' });
       }
     } catch (error) {
-      console.error('Error fetching aldeias', error);
-      setAlert({ show: true, message: 'Failed to fetch aldeias. Please try again.' });
+      console.error('Error fetching sucos', error);
+      setAlert({ show: true, message: 'Failed to fetch sucos. Please try again.' });
     }
     setAlert({ show: false, message: '' });
   };
@@ -88,101 +81,93 @@ const SearchDialog = () => {
   const handleReset = () => {
     setFormField(initialState);
     setIsFound(false);
-    setAldeias([]);
+    setAldeia([]);
   };
-  // console.log(aldeias);
+
   return (
-    <Dialog open={showSearchDialog} onOpenChange={(open) => handleSearchDialog(open)}>
+    <Dialog open={showSearchDialog} onOpenChange={handleSearchDialog}>
       <DialogContent className="container-fixed max-w-[700px] flex flex-col p-5 overflow-hidden [&>button]:hidden">
-        <DialogTitle></DialogTitle>
-        <DialogDescription></DialogDescription>
         <DialogHeader className="p-2 border-0">
+          <DialogTitle></DialogTitle>
+          <DialogDescription></DialogDescription>
           <div className="flex items-center justify-between flex-wrap grow">
             <div className="flex flex-col justify-center">
               <h1 className="text-xl font-semibold leading-none text-gray-900">Search Aldeias</h1>
-              <div className="flex items-center gap-2 text-sm font-normal text-gray-700"></div>
             </div>
             <div
               className="cursor-pointer hover:opacity-100 opacity-50"
               onClick={() => {
                 handleSearchDialog(false);
-                resetForm();
+                handleReset();
               }}
             >
               <KeenIcon icon="cross" className="text-1.5xl" />
             </div>
           </div>
         </DialogHeader>
-        <DialogBody className="scrollable-x px-0 pb-0" ref={parentRef}>
-          <div className="flex flex-col px-0">
-            {alert.show && (
-              <Alert variant="danger" className="mb-5">
-                {alert.message}
-              </Alert>
-            )}
-            <form action="" onSubmit={handleSubmit}>
-              <div className="card-body grid-cols-6 gap-5 p-0">
-                <div className="grid grid-cols-8 gap-2 w-full items-center">
-                  <label className="form-label flex items-center gap-1 col-span-2">
-                    Sucos Name<span className="text-red-500">*</span>
-                  </label>
+        <DialogBody className="scrollable-y px-0 pb-0" ref={parentRef}>
+          <form onSubmit={handleSubmit} className="flex flex-col px-5 gap-5">
+            {alert.show && <Alert variant="danger">{alert.message}</Alert>}
 
-                  <Select
-                    value={formField.id?.toString() ?? ''}
-                    onValueChange={(target) => {
-                      const selectedSuco = sucos.find((m) => m.sucos_id.toString() === target);
-                      if (selectedSuco) {
-                        setFormField({
-                          ...formField,
-                          id: selectedSuco.sucos_id,
-                          name: selectedSuco.sucos_name
-                        });
-                      }
-                    }}
-                  >
-                    <SelectTrigger className="col-span-6">
-                      <SelectValue placeholder="Select Sucos" />
-                    </SelectTrigger>
+            <div className="grid grid-cols-8 gap-1 w-full items-center">
+              <label className="form-label flex items-center col-span-3">
+                Sucos Name<span className="text-red-500">*</span>
+              </label>
 
-                    <SelectContent>
-                      {sucos?.map((suco) => {
-                        if (!suco.sucos_id) {
-                          console.error('suco.id is undefined or null', suco);
-                          return null; // Skip rendering this item if id is not valid
-                        }
-                        return (
-                          <SelectItem key={suco.sucos_id} value={suco.sucos_id.toString()}>
+              <Popover open={open} onOpenChange={setOpen}>
+                <PopoverTrigger asChild>
+                  <button type="button" className="input col-span-5 text-left">
+                    {formField.name || 'Select Sucos'}
+                  </button>
+                </PopoverTrigger>
+                <PopoverContent className="w-[400px] p-0">
+                  <Command>
+                    <CommandInput placeholder="Search Sucos..." />
+                    <CommandList>
+                      <CommandEmpty>No PostoAdms found.</CommandEmpty>
+                      <CommandGroup>
+                        {sucos.map((suco) => (
+                          <CommandItem
+                            key={suco.sucos_id}
+                            value={suco.sucos_name}
+                            onSelect={() => {
+                              setFormField({
+                                id: suco.sucos_id,
+                                name: suco.sucos_name
+                              });
+                              setOpen(false);
+                            }}
+                          >
                             {suco.sucos_name}
-                          </SelectItem>
-                        );
-                      })}
-                    </SelectContent>
-                  </Select>
-                </div>
+                          </CommandItem>
+                        ))}
+                      </CommandGroup>
+                    </CommandList>
+                  </Command>
+                </PopoverContent>
+              </Popover>
+            </div>
 
-                {isFound && aldeias.length > 0 && (
-                  <div className="mt-4 border-t pt-4">
-                    <h2 className="text-md font-semibold">Aldeias: </h2>
-                    <br />
-                    <div className="flex flex-col">
-                      <span className="text-sm form-hint">
-                        {aldeias.map((aldeia) => aldeia.name).join(', ')}
-                      </span>
-                    </div>
-                  </div>
-                )}
-
-                <div className="flex justify-end pt-2.5 gap-5 col-span-6">
-                  <Button variant={'outline'} type="reset" onClick={handleReset}>
-                    Reset
-                  </Button>
-                  <Button variant={'default'} type="submit">
-                    Search
-                  </Button>
+            {isFound && sucos.length > 0 && (
+              <div className="mt-4 border-t pt-4">
+                <h2 className="text-md font-semibold">Aldeias: </h2>
+                <div className="flex flex-col">
+                  <span className="text-sm form-hint">
+                    {aldeia.map((aldeias) => aldeias.name).join(', ')}
+                  </span>
                 </div>
               </div>
-            </form>
-          </div>
+            )}
+
+            <div className="flex justify-end gap-4">
+              <Button type="reset" variant="outline" onClick={handleReset}>
+                Reset
+              </Button>
+              <Button type="submit" variant="default">
+                Search
+              </Button>
+            </div>
+          </form>
         </DialogBody>
       </DialogContent>
     </Dialog>
diff --git a/src/pages/master/sucos/hooks/ManageSucosContext.tsx b/src/pages/master/sucos/hooks/ManageSucosContext.tsx
index d1ae6ac..212be5a 100644
--- a/src/pages/master/sucos/hooks/ManageSucosContext.tsx
+++ b/src/pages/master/sucos/hooks/ManageSucosContext.tsx
@@ -11,6 +11,7 @@ import axios from 'axios';
 interface SucosProps {
   sucos_id: number;
   sucos_name: string;
+  posto_name: string;
 }
 
 interface ContextProps {
@@ -159,7 +160,7 @@ const ManageSucosContextProvider = ({ children }: { children: React.ReactNode })
         order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
         filter: JSON.stringify(filter)
       });
-      console.log('Sucos List Response:', response?.data);
+      // console.log('Sucos List Response:', response?.data);
       setSucos(response?.data.list || []); // Pastikan default value adalah array kosong
       return { data: response?.data.list, totalCount: response?.data.total_count };
     } catch (error) {

From 1445fc8ecf8937db3c9785d0d838f363d50d26f5 Mon Sep 17 00:00:00 2001
From: Raja Oktafrianto <rajaoktafrianto3.com>
Date: Tue, 18 Mar 2025 11:27:23 +0700
Subject: [PATCH 08/19] update

---
 src/pages/master/aldeias/blocks/AddDialog.tsx |  38 +++---
 .../master/aldeias/blocks/EditDialog.tsx      |  68 ++++++++---
 .../aldeias/hooks/ManageAldeiasContext.tsx    |   6 +-
 .../master/municipios/blocks/AddDialog.tsx    |   3 +-
 .../master/municipios/blocks/EditDialog.tsx   |  45 +++++--
 .../master/municipios/blocks/ListToolbar.tsx  |   4 +-
 .../hooks/ManageMunicipiosContext.tsx         |  71 ++---------
 .../master/postoadms/blocks/AddDialog.tsx     |  40 +++----
 .../master/postoadms/blocks/EditDialog.tsx    |  69 +++++++----
 .../master/postoadms/blocks/ListToolbar.tsx   |   4 +-
 .../master/postoadms/blocks/SearchDialog.tsx  |  12 +-
 .../hooks/ManagePostoAdmsContext.tsx          |  22 ++--
 .../master/products/blocks/AddDialog.tsx      |  10 +-
 .../master/products/blocks/EditDialog.tsx     |  41 ++++++-
 .../master/profession/blocks/AddDialog.tsx    |   2 +-
 .../master/profession/blocks/EditDialog.tsx   |   2 +-
 .../master/provider/blocks/AddDialog.tsx      |  12 +-
 .../master/provider/blocks/EditDialog.tsx     |  12 +-
 src/pages/master/sucos/blocks/AddDialog.tsx   |   2 +-
 src/pages/master/sucos/blocks/EditDialog.tsx  |   2 +-
 src/pages/members/kyc/Kyc.tsx                 |   3 +
 .../members/manage-members/ManageMembers.tsx  |   3 +
 .../menu/manage-menu/blocks/AddDIalog.tsx     |  81 +++++++------
 .../menu/manage-menu/blocks/DeleteDialog.tsx  |  10 +-
 .../menu/manage-menu/blocks/EditDialog.tsx    | 111 ++++++++++--------
 .../manage-menu/hooks/ManageMenusContext.tsx  |  63 ++++++----
 .../hooks/ManagePositionContext.tsx           |  13 +-
 .../manage-user/hooks/ManageUserContext.tsx   |  13 +-
 28 files changed, 446 insertions(+), 316 deletions(-)

diff --git a/src/pages/master/aldeias/blocks/AddDialog.tsx b/src/pages/master/aldeias/blocks/AddDialog.tsx
index 26c53f3..af089ef 100644
--- a/src/pages/master/aldeias/blocks/AddDialog.tsx
+++ b/src/pages/master/aldeias/blocks/AddDialog.tsx
@@ -78,6 +78,24 @@ const AddDialog = () => {
     [formField]
   );
 
+  const doFetchSucos = async (sorting: any) => {
+    try {
+      sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+      const response = await GetData(`${API_URL}/sucos/list`, {
+        limit: 1000,
+        page: 1,
+        with_deleted: false,
+        order_field: sorting[0].id,
+        order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+      });
+
+      // console.log('SUCOS', response?.data);
+      setSucos(response?.data.list);
+    } catch (error) {
+      console.error('Error fetching municipios', error);
+    }
+  };
+
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
@@ -102,25 +120,7 @@ const AddDialog = () => {
   }, [formattedTime]);
 
   useEffect(() => {
-    const fetchSucos = async (sorting: any) => {
-      try {
-        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
-        const response = await GetData(`${API_URL}/sucos/list`, {
-          limit: 100,
-          page: 1,
-          with_deleted: false,
-          order_field: sorting[0].id,
-          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
-        });
-
-        // console.log('SUCOS', response?.data);
-        setSucos(response?.data.list);
-      } catch (error) {
-        console.error('Error fetching municipios', error);
-      }
-    };
-
-    fetchSucos([{ id: 'name', desc: false }]);
+    doFetchSucos([{ id: 'name', desc: false }]);
   }, []);
 
   useEffect(() => {
diff --git a/src/pages/master/aldeias/blocks/EditDialog.tsx b/src/pages/master/aldeias/blocks/EditDialog.tsx
index 179208c..d69981e 100644
--- a/src/pages/master/aldeias/blocks/EditDialog.tsx
+++ b/src/pages/master/aldeias/blocks/EditDialog.tsx
@@ -77,6 +77,42 @@ const EditDialog = () => {
     [selectedAldeias, formField]
   );
 
+  const doFetchSucos = async (sorting: any) => {
+    try {
+      sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+      const response = await GetData(`${API_URL}/sucos/list`, {
+        limit: 1000,
+        page: 1,
+        with_deleted: false,
+        order_field: sorting[0].id,
+        order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+      });
+
+      // console.log('SUCOS', response?.data);
+      setSucos(response?.data.list);
+    } catch (error) {
+      console.error('Error fetching municipios', error);
+    }
+  };
+
+  const doFetchData = useCallback(async (id: string) => {
+    const response = await GetData(`${API_URL}/aldeias/getdata/${id}`, { id });
+
+    if (response?.status) {
+      setFormField((prev) => ({
+        ...prev,
+        name: response.data.name,
+        sucos_id: response.data.sucos.id
+      }));
+    } else {
+      setFormField((prev) => ({
+        ...prev,
+        name: '',
+        sucos_id: 0
+      }));
+    }
+  }, []);
+
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
@@ -90,6 +126,18 @@ const EditDialog = () => {
     setAlert({ show: false, message: '' });
   };
 
+  useEffect(() => {
+    if (selectedAldeias) {
+      doFetchData(selectedAldeias);
+    }
+  }, [selectedAldeias]);
+
+  useEffect(() => {
+    if (showEditDialog === false) {
+      resetForm();
+    }
+  }, [showEditDialog]);
+
   useEffect(() => {
     if (showEditDialog) {
       setFormField({
@@ -101,25 +149,7 @@ const EditDialog = () => {
   }, [formattedTime]);
 
   useEffect(() => {
-    const fetchSucos = async (sorting: any) => {
-      try {
-        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
-        const response = await GetData(`${API_URL}/sucos/list`, {
-          limit: 100,
-          page: 1,
-          with_deleted: false,
-          order_field: sorting[0].id,
-          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
-        });
-
-        // console.log('SUCOS', response?.data);
-        setSucos(response?.data.list);
-      } catch (error) {
-        console.error('Error fetching municipios', error);
-      }
-    };
-
-    fetchSucos([{ id: 'name', desc: false }]);
+    doFetchSucos([{ id: 'name', desc: false }]);
   }, []);
 
   return (
diff --git a/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx b/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx
index 80359b0..a4cf161 100644
--- a/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx
+++ b/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx
@@ -142,15 +142,17 @@ const ManageAldeiasContextProvider = ({ children }: { children: React.ReactNode
 
   const getAldeiasLists = async (page: number, limit: number, sorting: any, filter: any) => {
     try {
+      sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+      filter = filter.length == 0 ? {} : { any: filter[0].value?.toLowerCase() };
       const response = await GetData(`${API_URL}/aldeias/list`, {
         limit,
         page: page + 1,
-        with_deleted: true,
+        with_deleted: false,
         order_field: sorting[0].id,
         order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
         filter: JSON.stringify(filter)
       });
-      // console.log(response?.data);
+      console.log(response?.data);
       setAldeias(response?.data.list);
       return { data: response?.data.list, totalCount: response?.data.total_count };
     } catch (error) {
diff --git a/src/pages/master/municipios/blocks/AddDialog.tsx b/src/pages/master/municipios/blocks/AddDialog.tsx
index 03fca26..d2dfda4 100644
--- a/src/pages/master/municipios/blocks/AddDialog.tsx
+++ b/src/pages/master/municipios/blocks/AddDialog.tsx
@@ -42,6 +42,7 @@ const AddDialog = () => {
 
   const resetForm = () => {
     setFormField(initialState);
+    setAlert({ show: false, message: '' });
   };
 
   const doCreateMunicipio = useCallback(
@@ -72,7 +73,7 @@ const AddDialog = () => {
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '') {
+    if (formField.name.trim() === '') {
       setAlert({ show: true, message: 'Please fill name field.' });
       return;
     }
diff --git a/src/pages/master/municipios/blocks/EditDialog.tsx b/src/pages/master/municipios/blocks/EditDialog.tsx
index 0579d28..50406bc 100644
--- a/src/pages/master/municipios/blocks/EditDialog.tsx
+++ b/src/pages/master/municipios/blocks/EditDialog.tsx
@@ -25,7 +25,7 @@ const EditDialog = () => {
   const { showEditDialog, handleEditDialog, selectedMunicipios, municipios } =
     useManageMunicipiosContext();
   const { reload } = useDataGrid();
-  const { PutData } = useCallApi();
+  const { PutData, GetData } = useCallApi();
   const parsedUser = getAuth()?.user;
   const [alert, setAlert] = useState({
     show: false,
@@ -44,6 +44,7 @@ const EditDialog = () => {
 
   const resetForm = () => {
     setFormField(initialState);
+    setAlert({ show: false, message: '' });
   };
 
   const doUpdateMunicipios = useCallback(
@@ -74,28 +75,46 @@ const EditDialog = () => {
     [selectedMunicipios, formField]
   );
 
+  const doFetchData = useCallback(async (id: string) => {
+    const response = await GetData(`${API_URL}/municipios/getdata/${id}`, { id });
+
+    if (response?.status) {
+      setFormField((prev) => ({
+        ...prev,
+        name: response.data.name
+      }));
+    } else {
+      setFormField((prev) => ({
+        ...prev,
+        name: ''
+      }));
+    }
+  }, []);
+
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '') {
+    if (formField.name.trim() === '') {
       setAlert({ show: true, message: 'Please fill name field.' });
       return;
     }
 
-    // setFormField({
-    //   name: formField.name,
-    //   created_by: parsedUser.email,
-    //   created_at: formattedTime
-    // });
-
     doUpdateMunicipios(e);
     console.log(formField);
     setAlert({ show: false, message: '' });
   };
 
-  // const doFetchMunicipios = useCallback(async (id: string) => {
-  //   const response = await axios.get(`${API_URL}/municipios/${id}`);
-  // }, []);
+  useEffect(() => {
+    if (selectedMunicipios) {
+      doFetchData(selectedMunicipios);
+    }
+  }, [selectedMunicipios]);
+
+  useEffect(() => {
+    if (showEditDialog === false) {
+      resetForm();
+    }
+  }, [showEditDialog]);
 
   useEffect(() => {
     if (selectedMunicipios) {
@@ -127,7 +146,9 @@ const EditDialog = () => {
               <div className="card-body grid gap-5">
                 <div className="w-full">
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
-                    <label className="form-label flex items-center gap-1 max-w-56">Name</label>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      Name<span className="text-red-500">*</span>
+                    </label>
                     <Input
                       className="input"
                       type="text"
diff --git a/src/pages/master/municipios/blocks/ListToolbar.tsx b/src/pages/master/municipios/blocks/ListToolbar.tsx
index abbdce2..68dd8fe 100644
--- a/src/pages/master/municipios/blocks/ListToolbar.tsx
+++ b/src/pages/master/municipios/blocks/ListToolbar.tsx
@@ -29,8 +29,8 @@ const ListToolbar = () => {
               <input
                 type="text"
                 placeholder="Search Municipios"
-                value={searchName}
-                onChange={(event) => setSearchName(event.target.value)}
+                value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
+                onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
               />
             </label>
             <DefaultTooltip title={'Filter'} placement={'top'}>
diff --git a/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx b/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx
index 606ef0d..63697d4 100644
--- a/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx
+++ b/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx
@@ -113,8 +113,9 @@ const ManageMunicipiosProvider = ({ children }: { children: React.ReactNode }) =
         }
       },
       {
-        accessorFn: (row) => row.name,
-        id: 'name',
+        // accessorFn: (row) => row.name,
+        // id: 'name',
+        accessorKey: 'name',
         header: ({ column }) => <DataGridColumnHeader title="Municipios Name" column={column} />,
         enableSorting: true,
         enableHiding: false,
@@ -159,73 +160,27 @@ const ManageMunicipiosProvider = ({ children }: { children: React.ReactNode }) =
     try {
       sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
       filter = filter.length == 0 ? {} : { any: filter[0].value?.toLowerCase() };
-      const response = await axios.get(`${API_URL}/municipios/list`, {
-        params: {
-          limit: limit,
-          page: page + 1,
-          with_deleted: false,
-          order_field: sorting[0].id,
-          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
-        }
+      const response = await GetData(`${API_URL}/municipios/list`, {
+        limit,
+        page: page + 1,
+        with_deleted: false,
+        order_field: sorting[0].id,
+        order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
+        filter: JSON.stringify(filter)
       });
-      // console.log(response.data);
+      // console.log(response?.data);
       // const sortedList = response.data.data.list.sort((a: MunicipiosProps, b: MunicipiosProps) => {
       //   if (a.name < b.name) return -1;
       //   if (a.name > b.name) return 1;
       //   return 0;
       // });
-      setMunicipios(response.data.data.list);
-      return { data: response?.data.data.list, totalCount: response?.data.data.total_count };
+      setMunicipios(response?.data.list);
+      return { data: response?.data.list, totalCount: response?.data.total_count };
     } catch (error) {
       console.error('Error fetching municipios', error);
     }
   };
 
-  const getPostoadmsByMunicipio = async (name: string) => {
-    try {
-      const response = await axios.get(`${API_URL}/municipios/postoadms/${name}`);
-      const data = response.data;
-      console.log(data);
-    } catch (error) {
-      console.error(`Error fetching municipios by ${name}`, error);
-    }
-  };
-
-  const createMunicipios = async (data: Partial<MunicipiosProps>) => {
-    try {
-      await axios.post(`${API_URL}/municipios/create`, data);
-      // getMunicipiosLists(10, 1, false, 'name', 'ASC');
-    } catch (error) {
-      console.error('Error creating municipios', error);
-    }
-  };
-
-  const updateMunicipios = async (id: number, data: Partial<MunicipiosProps>) => {
-    try {
-      await axios.put(`${API_URL}/update/${id}`, data);
-      // getMunicipiosLists(10, 1, false, 'name', 'ASC');
-    } catch (error) {
-      console.error('Error updating municipios', error);
-    }
-  };
-
-  const deleteMunicipios = async (id: number, hardDelete?: boolean) => {
-    try {
-      await axios.delete(`${API_URL}/delete/${id}/${hardDelete}`);
-      // getMunicipiosLists(10, 1, false, 'name', 'ASC');
-    } catch (error) {
-      console.error('Error deleting municipios', error);
-    }
-  };
-
-  const restoreMunicipios = async (id: number) => {
-    try {
-      await axios.put(`${API_URL}/restore/${id}`);
-      // getMunicipiosLists(10, 1, false, 'name', 'ASC');
-    } catch (error) {
-      console.error('Error restoring municipios', error);
-    }
-  };
   return (
     <ManageMunicipiosContext.Provider
       value={{
diff --git a/src/pages/master/postoadms/blocks/AddDialog.tsx b/src/pages/master/postoadms/blocks/AddDialog.tsx
index 42126b9..fa7c7dd 100644
--- a/src/pages/master/postoadms/blocks/AddDialog.tsx
+++ b/src/pages/master/postoadms/blocks/AddDialog.tsx
@@ -80,10 +80,28 @@ const AddDialog = () => {
     [formField]
   );
 
+  const doFetchMunicipios = async (sorting: any) => {
+    try {
+      sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+      const response = await GetData(`${API_URL}/municipios/list`, {
+        limit: 100,
+        page: 1,
+        with_deleted: false,
+        order_field: sorting[0].id,
+        order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+      });
+
+      // console.log(response?.data);
+      setMunicipios(response?.data.list);
+    } catch (error) {
+      console.error('Error fetching municipios', error);
+    }
+  };
+
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '' || formField.municipio_id === 0) {
+    if (formField.name.trim() === '' || formField.municipio_id === 0) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
     }
@@ -110,25 +128,7 @@ const AddDialog = () => {
   }, [showAddDialog]);
 
   useEffect(() => {
-    const fetchMunicipios = async (sorting: any) => {
-      try {
-        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
-        const response = await GetData(`${API_URL}/municipios/list`, {
-          limit: 100,
-          page: 1,
-          with_deleted: false,
-          order_field: sorting[0].id,
-          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
-        });
-
-        // console.log(response?.data);
-        setMunicipios(response?.data.list);
-      } catch (error) {
-        console.error('Error fetching municipios', error);
-      }
-    };
-
-    fetchMunicipios([{ id: 'name', desc: false }]);
+    doFetchMunicipios([{ id: 'name', desc: false }]);
   }, []);
 
   return (
diff --git a/src/pages/master/postoadms/blocks/EditDialog.tsx b/src/pages/master/postoadms/blocks/EditDialog.tsx
index c42423b..d170d1a 100644
--- a/src/pages/master/postoadms/blocks/EditDialog.tsx
+++ b/src/pages/master/postoadms/blocks/EditDialog.tsx
@@ -80,10 +80,45 @@ const EditDialog = () => {
     [selectedPostoAdms, formField]
   );
 
+  const doFetchMunicipios = useCallback(async (sorting: any) => {
+    try {
+      sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+      const response = await GetData(`${API_URL}/municipios/list`, {
+        limit: 100,
+        page: 1,
+        with_deleted: false,
+        order_field: sorting[0].id,
+        order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+      });
+
+      // console.log('MUNICIPIOS: ', response?.data);
+      setMunicipios(response?.data.list);
+    } catch (error) {
+      console.error('Error fetching municipios', error);
+    }
+  }, []);
+
+  const doFetchData = useCallback(async (id: string) => {
+    const response = await GetData(`${API_URL}/postoadms/getdata/${id}`, { id });
+
+    if (response?.status) {
+      setFormField((prev) => ({
+        ...prev,
+        name: response.data.name,
+        municipio_id: response.data.municipios.id
+      }));
+    } else {
+      setFormField((prev) => ({
+        ...prev,
+        name: ''
+      }));
+    }
+  }, []);
+
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '' || formField.municipio_id === 0) {
+    if (formField.name.trim() === '' || formField.municipio_id === 0) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
     }
@@ -93,6 +128,18 @@ const EditDialog = () => {
     setAlert({ show: false, message: '' });
   };
 
+  useEffect(() => {
+    if (showEditDialog === false) {
+      resetForm();
+    }
+  }, [showEditDialog]);
+
+  useEffect(() => {
+    if (selectedPostoAdms) {
+      doFetchData(selectedPostoAdms);
+    }
+  }, [selectedPostoAdms]);
+
   useEffect(() => {
     if (selectedPostoAdms) {
       setFormField({
@@ -104,25 +151,7 @@ const EditDialog = () => {
   }, [formattedTime]);
 
   useEffect(() => {
-    try {
-      const fetchMunicipios = async (sorting: any) => {
-        sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
-        const response = await GetData(`${API_URL}/municipios/list`, {
-          limit: 100,
-          page: 1,
-          with_deleted: false,
-          order_field: sorting[0].id,
-          order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
-        });
-
-        // console.log(response?.data);
-        setMunicipios(response?.data.list);
-      };
-
-      fetchMunicipios([{ id: 'name', desc: false }]);
-    } catch (error) {
-      console.error('Error fetching municipios', error);
-    }
+    doFetchMunicipios([{ id: 'name', desc: false }]);
   }, []);
 
   // console.log(selectedPostoAdms);
diff --git a/src/pages/master/postoadms/blocks/ListToolbar.tsx b/src/pages/master/postoadms/blocks/ListToolbar.tsx
index 56a758d..c476994 100644
--- a/src/pages/master/postoadms/blocks/ListToolbar.tsx
+++ b/src/pages/master/postoadms/blocks/ListToolbar.tsx
@@ -17,9 +17,9 @@ const ListToolbar = () => {
               <input
                 type="text"
                 placeholder="Search Postu"
-                value={(table.getColumn('posto_adms_name')?.getFilterValue() as string) ?? ''}
+                value={(table.getColumn('PostoAdms_name')?.getFilterValue() as string) ?? ''}
                 onChange={(event) =>
-                  table.getColumn('posto_adms_name')?.setFilterValue(event.target.value)
+                  table.getColumn('PostoAdms_name')?.setFilterValue(event.target.value)
                 }
               />
             </label>
diff --git a/src/pages/master/postoadms/blocks/SearchDialog.tsx b/src/pages/master/postoadms/blocks/SearchDialog.tsx
index 2218e3e..6b83e74 100644
--- a/src/pages/master/postoadms/blocks/SearchDialog.tsx
+++ b/src/pages/master/postoadms/blocks/SearchDialog.tsx
@@ -83,7 +83,7 @@ const SearchDialog = () => {
     setIsFound(false);
     setSucos([]);
   };
-  
+
   return (
     <Dialog open={showSearchDialog} onOpenChange={handleSearchDialog}>
       <DialogContent className="container-fixed max-w-[700px] flex flex-col p-5 overflow-hidden [&>button]:hidden">
@@ -128,17 +128,17 @@ const SearchDialog = () => {
                       <CommandGroup>
                         {postoAdms.map((postoAdm) => (
                           <CommandItem
-                            key={postoAdm.posto_adms_id}
-                            value={postoAdm.posto_adms_name}
+                            key={postoAdm.PostoAdms_id}
+                            value={postoAdm.PostoAdms_name}
                             onSelect={() => {
                               setFormField({
-                                id: postoAdm.posto_adms_id,
-                                name: postoAdm.posto_adms_name
+                                id: postoAdm.PostoAdms_id,
+                                name: postoAdm.PostoAdms_name
                               });
                               setOpen(false);
                             }}
                           >
-                            {postoAdm.posto_adms_name}
+                            {postoAdm.PostoAdms_name}
                           </CommandItem>
                         ))}
                       </CommandGroup>
diff --git a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
index 55b87c3..4c3ca65 100644
--- a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
+++ b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
@@ -9,8 +9,8 @@ import ListToolbar from '../blocks/ListToolbar';
 import { useCallApi } from '@/hooks';
 
 interface PostoAdmsProps {
-  posto_adms_id: number;
-  posto_adms_name: string;
+  PostoAdms_id: number;
+  PostoAdms_name: string;
   municipios_name: string;
 }
 
@@ -84,8 +84,9 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
   const columns = useMemo<ColumnDef<any>[]>(
     () => [
       {
-        accessorFn: (row) => row.posto_adms_id,
-        id: 'id',
+        // accessorFn: (row) => row.PostoAdms_id,
+        // id: 'PostoAdms_id',
+        accessorKey: 'PostoAdms_id',
         header: ({ column }) => <DataGridColumnHeader title="ID" column={column} />,
         enableSorting: true,
         enableHiding: false,
@@ -96,7 +97,7 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
       {
         // accessorFn: (row) => row.posto_adms_name,
         // id: 'posto_adms_name',
-        accessorKey: 'posto_adms_name',
+        accessorKey: 'PostoAdms_name',
         header: ({ column }) => (
           <DataGridColumnHeader title="Posto Administrativo Name" column={column} />
         ),
@@ -127,13 +128,13 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
             <>
               <button
                 className="btn btn-sm btn-icon btn-clear btn-light"
-                onClick={() => handleEditDialog(true, row.posto_adms_id)}
+                onClick={() => handleEditDialog(true, row.PostoAdms_id)}
               >
                 <KeenIcon icon="notepad-edit" />
               </button>
               <button
                 className="btn btn-sm btn-icon btn-clear btn-light"
-                onClick={() => handleDeleteDialog(true, row.posto_adms_id)}
+                onClick={() => handleDeleteDialog(true, row.PostoAdms_id)}
               >
                 <KeenIcon icon="trash" />
               </button>
@@ -151,16 +152,17 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
 
   const getPostoAdmsLists = async (page: number, limit: number, sorting: any, filter: any) => {
     try {
-      sorting: sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+      sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
       filter = filter.length == 0 ? {} : { any: filter[0].value?.toLowerCase() };
       const response = await GetData(`${API_URL}/postoadms/list`, {
         limit,
         page: page + 1,
         with_deleted: false,
         order_field: sorting[0].id,
-        order_direction: sorting[0].desc ? 'DESC' : 'ASC'
+        order_direction: sorting[0].desc ? 'DESC' : 'ASC',
+        filter: JSON.stringify(filter)
       });
-      // console.log(response.data);
+      console.log(response?.data);
       // const sortedList = response.data.data.list.sort((a: PostoAdmsProps, b: PostoAdmsProps) => {
       //   if (a.name < b.name) return -1;
       //   if (a.name > b.name) return 1;
diff --git a/src/pages/master/products/blocks/AddDialog.tsx b/src/pages/master/products/blocks/AddDialog.tsx
index dc6ec88..3cdcf3c 100644
--- a/src/pages/master/products/blocks/AddDialog.tsx
+++ b/src/pages/master/products/blocks/AddDialog.tsx
@@ -71,15 +71,15 @@ const AddDialog = () => {
     e.preventDefault();
 
     if (
-      formField.name === '' ||
-      formField.description === '' ||
+      formField.name.trim() === '' ||
+      formField.description.trim() === '' ||
       formField.price_point === 0 ||
       formField.price_cash === 0 ||
       formField.cashback_point === 0 ||
       formField.cashback_cash === 0 ||
-      formField.status === '' ||
-      formField.created_by === '' ||
-      formField.created_at === ''
+      formField.status.trim() === '' ||
+      formField.created_by.trim() === '' ||
+      formField.created_at.trim() === ''
     ) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
diff --git a/src/pages/master/products/blocks/EditDialog.tsx b/src/pages/master/products/blocks/EditDialog.tsx
index 5f5e45c..06eb7b6 100644
--- a/src/pages/master/products/blocks/EditDialog.tsx
+++ b/src/pages/master/products/blocks/EditDialog.tsx
@@ -20,7 +20,7 @@ const API_URL = apiConfig.service_master_data;
 const EditDialog = () => {
   const { showEditDialog, handleEditDialog, selectedProducts } = useManageProductsContext();
   const { reload } = useDataGrid();
-  const { PutData } = useCallApi();
+  const { PutData, GetData } = useCallApi();
   const parsedUser = getAuth()?.user;
   const created_time = new Date();
   const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' ');
@@ -66,19 +66,38 @@ const EditDialog = () => {
     [selectedProducts, formField]
   );
 
+  const doFetchData = useCallback(async (id: string) => {
+    const response = await GetData(`${API_URL}/product/getdata/${selectedProducts}`, { id });
+
+    if (response?.status) {
+      setFormField((prev) => ({
+        ...prev,
+        name: response.data.name,
+        description: response.data.description,
+        price_point: response.data.price_point,
+        price_cash: response.data.price_cash,
+        cashback_point: response.data.cashback_point,
+        cashback_cash: response.data.cashback_cash,
+        status: response.data.status
+      }));
+    } else {
+      setFormField(initialState);
+    }
+  }, []);
+
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
     if (
-      formField.name === '' ||
-      formField.description === '' ||
+      formField.name.trim() === '' ||
+      formField.description.trim() === '' ||
       formField.price_point === 0 ||
       formField.price_cash === 0 ||
       formField.cashback_point === 0 ||
       formField.cashback_cash === 0 ||
       formField.status === '' ||
-      formField.updated_by === '' ||
-      formField.updated_at === ''
+      formField.updated_by.trim() === '' ||
+      formField.updated_at.trim() === ''
     ) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
@@ -89,6 +108,18 @@ const EditDialog = () => {
     setAlert({ show: false, message: '' });
   };
 
+  useEffect(() => {
+    if (showEditDialog === false) {
+      resetForm();
+    }
+  }, [showEditDialog]);
+
+  useEffect(() => {
+    if (selectedProducts) {
+      doFetchData(selectedProducts);
+    }
+  }, [selectedProducts]);
+
   useEffect(() => {
     if (showEditDialog) {
       setFormField({
diff --git a/src/pages/master/profession/blocks/AddDialog.tsx b/src/pages/master/profession/blocks/AddDialog.tsx
index 247ff73..f87c9f9 100644
--- a/src/pages/master/profession/blocks/AddDialog.tsx
+++ b/src/pages/master/profession/blocks/AddDialog.tsx
@@ -61,7 +61,7 @@ const AddDialog = () => {
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '') {
+    if (formField.name.trim() === '') {
       setAlert({ show: true, message: 'Please fill name field.' });
       return;
     }
diff --git a/src/pages/master/profession/blocks/EditDialog.tsx b/src/pages/master/profession/blocks/EditDialog.tsx
index ad592da..7dfc06c 100644
--- a/src/pages/master/profession/blocks/EditDialog.tsx
+++ b/src/pages/master/profession/blocks/EditDialog.tsx
@@ -65,7 +65,7 @@ const EditDialog = () => {
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '') {
+    if (formField.name.trim() === '') {
       setAlert({ show: true, message: 'Please fill name field.' });
       return;
     }
diff --git a/src/pages/master/provider/blocks/AddDialog.tsx b/src/pages/master/provider/blocks/AddDialog.tsx
index 854ebf9..636ba54 100644
--- a/src/pages/master/provider/blocks/AddDialog.tsx
+++ b/src/pages/master/provider/blocks/AddDialog.tsx
@@ -100,12 +100,12 @@ const AddDialog = () => {
     e.preventDefault();
 
     if (
-      formField.name === '' ||
-      formField.description === '' ||
-      formField.type === '' ||
-      formField.status === '' ||
-      formField.transactionTypeId === '' ||
-      formField.agentId === ''
+      formField.name.trim() === '' ||
+      formField.description.trim() === '' ||
+      formField.type.trim() === '' ||
+      formField.status.trim() === '' ||
+      formField.transactionTypeId.trim() === '' ||
+      formField.agentId.trim() === ''
     ) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
diff --git a/src/pages/master/provider/blocks/EditDialog.tsx b/src/pages/master/provider/blocks/EditDialog.tsx
index 3cd2b6c..5fa37c2 100644
--- a/src/pages/master/provider/blocks/EditDialog.tsx
+++ b/src/pages/master/provider/blocks/EditDialog.tsx
@@ -114,12 +114,12 @@ const EditDialog = () => {
     e.preventDefault();
 
     if (
-      formField.name === '' ||
-      formField.description === '' ||
-      formField.type === '' ||
-      formField.status === '' ||
-      formField.transactionTypeId === '' ||
-      formField.agentId === ''
+      formField.name.trim() === '' ||
+      formField.description.trim() === '' ||
+      formField.type.trim() === '' ||
+      formField.status.trim() === '' ||
+      formField.transactionTypeId.trim() === '' ||
+      formField.agentId.trim() === ''
     ) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
diff --git a/src/pages/master/sucos/blocks/AddDialog.tsx b/src/pages/master/sucos/blocks/AddDialog.tsx
index 1eae604..dd5ab57 100644
--- a/src/pages/master/sucos/blocks/AddDialog.tsx
+++ b/src/pages/master/sucos/blocks/AddDialog.tsx
@@ -80,7 +80,7 @@ const AddDialog = () => {
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '' || formField.posto_adm_id === 0) {
+    if (formField.name.trim() === '' || formField.posto_adm_id === 0) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
     }
diff --git a/src/pages/master/sucos/blocks/EditDialog.tsx b/src/pages/master/sucos/blocks/EditDialog.tsx
index 6d70b64..64c8b94 100644
--- a/src/pages/master/sucos/blocks/EditDialog.tsx
+++ b/src/pages/master/sucos/blocks/EditDialog.tsx
@@ -68,7 +68,7 @@ const EditDialog = () => {
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '' || formField.posto_adm_id === 0) {
+    if (formField.name.trim() === '' || formField.posto_adm_id === 0) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
     }
diff --git a/src/pages/members/kyc/Kyc.tsx b/src/pages/members/kyc/Kyc.tsx
index 151eb71..e346889 100644
--- a/src/pages/members/kyc/Kyc.tsx
+++ b/src/pages/members/kyc/Kyc.tsx
@@ -8,6 +8,7 @@ import { useAuthContext } from '@/auth';
 import { apiConfig } from '@/config/api.config';
 import ConfirmDialog from '@/components/confirm';
 import axios from 'axios';
+import { toast } from 'sonner';
 const BASE_URL = apiConfig.service_customer;
 import CustomerDialog from '../manage-members/CustomerDetailModal';
 
@@ -128,10 +129,12 @@ const Kyc = () => {
       await fetchGroups();
       setDialogOpen(false)
       setIsDialogOpen(false)
+      toast.success('Success Update Kyc Member');
     } catch (error: any) {
       alert(error.message)
       setDialogOpen(false)
       setIsDialogOpen(false)
+      toast.error(error.message)
     }
   }
 
diff --git a/src/pages/members/manage-members/ManageMembers.tsx b/src/pages/members/manage-members/ManageMembers.tsx
index a0d1959..2258819 100644
--- a/src/pages/members/manage-members/ManageMembers.tsx
+++ b/src/pages/members/manage-members/ManageMembers.tsx
@@ -7,6 +7,7 @@ import CustomerDialog from './CustomerDetailModal';
 import ConfirmDialog from '@/components/confirm';
 import { useAuthContext } from '@/auth';
 import { ScreenLoader } from '@/components';
+import { toast } from 'sonner';
 const BASE_URL = apiConfig.service_customer;
 
 const ManageMembers = () => {
@@ -99,10 +100,12 @@ const ManageMembers = () => {
       await fetchGroups();
       setDialogOpen(false)
       setIsDialogOpen(false)
+      toast.success('Success Update Member');
     } catch (error: any) {
       alert(error.message)
       setDialogOpen(false)
       setIsDialogOpen(false)
+      toast.error(error.message)
     }
   }
 
diff --git a/src/pages/menu/manage-menu/blocks/AddDIalog.tsx b/src/pages/menu/manage-menu/blocks/AddDIalog.tsx
index 72e4209..d79fe8a 100644
--- a/src/pages/menu/manage-menu/blocks/AddDIalog.tsx
+++ b/src/pages/menu/manage-menu/blocks/AddDIalog.tsx
@@ -12,13 +12,14 @@ import {
   DialogHeader,
   DialogTitle
 } from '@/components/ui/dialog';
+import { FormControl,NativeSelect } from "@mui/material";
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
 
 const API_URL = apiConfig.service_dashboard;
 const AddDialog = () => {
   const parentRef = useRef<any | null>(null);
-  const { showAddDialog, handleAddDialog } = useManageMenusContext();
+  const { showAddDialog, handleAddDialog, parents } = useManageMenusContext();
   const { reload } = useDataGrid();
   const { PostData } = useCallApi();
   const [alert, setAlert] = useState({
@@ -36,26 +37,7 @@ const AddDialog = () => {
   };
   const [formField, setFormField] = useState(initialState);
 
-  const doCreateMenu = useCallback(
-    async (e: React.FormEvent<HTMLFormElement>) => {
-      e.preventDefault();
-
-      const response = await PostData(`${API_URL}/menus/create`, formField);
-
-      if (response?.status) {
-        handleAddDialog(false);
-        resetForm();
-        toast.success('Success Create Menu');
-        reload();
-      } else {
-        toast.error('Failed Create Menu');
-        setAlert({ show: true, message: 'Failed Create Menu' });
-      }
-    },
-    [formField]
-  );
-
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
     if (
@@ -69,7 +51,17 @@ const AddDialog = () => {
       return;
     }
 
-    doCreateMenu(e);
+    const response = await PostData(`${API_URL}/menus/create`, formField);
+
+    if (response?.status) {
+      handleAddDialog(false);
+      resetForm();
+      toast.success('Success Create Menu');
+      reload();
+    } else {
+      toast.error('Failed Create Menu');
+      setAlert({ show: true, message: 'Failed Create Menu' });
+    }
     console.log(formField);
     setAlert({ show: false, message: '' });
   };
@@ -140,13 +132,24 @@ const AddDialog = () => {
 
                 <div className="w-full">
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
-                    <label className="form-label flex items-center gap-1 max-w-56">ID Parent</label>
-                    <Input
-                      className="input"
-                      type="text"
-                      value={formField.id_parent}
-                      onChange={(e) => setFormField({ ...formField, id_parent: e.target.value })}
-                    />
+                    <label className="form-label flex items-center gap-1 max-w-56">Parent</label>
+                    <FormControl fullWidth margin="dense">
+                      <NativeSelect
+                        defaultValue={30}
+                        value={formField.id_parent}
+                        onChange={(e: any) => setFormField({ ...formField, id_parent: e.target.value })}
+                        inputProps={{
+                          name: 'id_parent',
+                          id: 'uncontrolled-native',
+                        }}
+                      >
+                      {
+                        parents ? parents.map((el: any) => (
+                          <option key={el.id} value={el.id}>{el.name}</option>
+                        )) : ''
+                      }
+                      </NativeSelect>
+                    </FormControl>
                   </div>
                 </div>
 
@@ -185,12 +188,20 @@ const AddDialog = () => {
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Status<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="text"
-                      value={formField.status}
-                      onChange={(e) => setFormField({ ...formField, status: e.target.value })}
-                    />
+                    <FormControl fullWidth margin="dense">
+                      <NativeSelect
+                        defaultValue={30}
+                        value={formField.status}
+                        onChange={(e: any) => setFormField({ ...formField, status: e.target.value })}
+                        inputProps={{
+                          name: 'status',
+                          id: 'uncontrolled-native',
+                        }}
+                      >
+                        <option value={"Y"}>Active</option>
+                        <option value={"N"}>Inactive</option>
+                      </NativeSelect>
+                    </FormControl>
                   </div>
                 </div>
 
diff --git a/src/pages/menu/manage-menu/blocks/DeleteDialog.tsx b/src/pages/menu/manage-menu/blocks/DeleteDialog.tsx
index f0baf0e..4f4818c 100644
--- a/src/pages/menu/manage-menu/blocks/DeleteDialog.tsx
+++ b/src/pages/menu/manage-menu/blocks/DeleteDialog.tsx
@@ -10,7 +10,7 @@ import { Button } from '@/components/ui/button';
 
 const API_URL = apiConfig.service_dashboard;
 const DeleteDialog = () => {
-  const { showDeleteDialog, handleDeleteDialog, selectedMenu } = useManageMenusContext();
+  const { showDeleteDialog, handleDeleteDialog, selectedMenu }: any = useManageMenusContext();
   const { reload } = useDataGrid();
   const { DeleteData } = useCallApi();
   const [enforce, setEnforce] = useState(false);
@@ -19,9 +19,9 @@ const DeleteDialog = () => {
     message: ''
   });
 
-  const doDeleteMenu = useCallback(async () => {
-    const response = await DeleteData(`${API_URL}/menus/delete/${selectedMenu}/${enforce}`, {
-      id: selectedMenu
+  const doDeleteMenu = async () => {
+    const response = await DeleteData(`${API_URL}/menus/delete/${selectedMenu.id}/${enforce}`, {
+      id: selectedMenu.id
     });
 
     if (response?.status) {
@@ -33,7 +33,7 @@ const DeleteDialog = () => {
       toast.error('Failed Delete Menu');
       setAlert((prev) => ({ ...prev, show: true, message: response?.message }));
     }
-  }, [selectedMenu, enforce]);
+  };
 
   return (
     <Dialog open={showDeleteDialog} onOpenChange={(open) => handleDeleteDialog(open, null)}>
diff --git a/src/pages/menu/manage-menu/blocks/EditDialog.tsx b/src/pages/menu/manage-menu/blocks/EditDialog.tsx
index 7dff544..78a5ea2 100644
--- a/src/pages/menu/manage-menu/blocks/EditDialog.tsx
+++ b/src/pages/menu/manage-menu/blocks/EditDialog.tsx
@@ -2,7 +2,7 @@ import { Alert, useDataGrid } from '@/components';
 import { useManageMenusContext } from '../hooks/useManageMenusContext';
 import { useCallApi } from '@/hooks';
 import { apiConfig } from '@/config/api.config';
-import React, { useCallback, useState } from 'react';
+import React, { useCallback, useState, useEffect } from 'react';
 import { toast } from 'sonner';
 import {
   Dialog,
@@ -12,12 +12,13 @@ import {
   DialogHeader,
   DialogTitle
 } from '@/components/ui/dialog';
+import { FormControl,NativeSelect } from "@mui/material";
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
-
 const API_URL = apiConfig.service_dashboard;
+
 const EditDialog = () => {
-  const { showEditDialog, handleEditDialog, selectedMenu } = useManageMenusContext();
+  const { showEditDialog, handleEditDialog, selectedMenu, setSelectedMenu, parents }: any = useManageMenusContext();
   const { reload } = useDataGrid();
   const { PutData } = useCallApi();
   const [alert, setAlert] = useState({
@@ -25,6 +26,7 @@ const EditDialog = () => {
     message: ''
   });
   const initialState = {
+    id: '',
     module: '',
     name: '',
     link: '',
@@ -33,13 +35,25 @@ const EditDialog = () => {
     icon: '',
     status: ''
   };
-  const [formField, setFormField] = useState(initialState);
 
-  const doUpdateMenu = useCallback(async (e: React.FormEvent<HTMLFormElement>) => {
+  const handleUpdate = async (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
+    
+    if (
+      selectedMenu.module === '' ||
+      selectedMenu.name === '' ||
+      selectedMenu.link === '' ||
+      selectedMenu.order_number === 0 ||
+      selectedMenu.status === ''
+    ) {
+      setAlert({ show: true, message: 'Please fill in all required fields.' });
+      return;
+    }
 
-    const response = await PutData(`${API_URL}/menus/update/${selectedMenu}`, formField);
-
+    const updateMenu = selectedMenu;
+    if (updateMenu.id_parent === null) updateMenu.id_parent = "";
+    delete updateMenu.parentName    
+    const response = await PutData(`${API_URL}/menus/update/${selectedMenu.id}`, selectedMenu);
     if (response?.status) {
       handleEditDialog(false, null);
       resetForm();
@@ -49,29 +63,11 @@ const EditDialog = () => {
       toast.error('Failed Update Menu');
       setAlert({ show: true, message: 'Failed Update Menu' });
     }
-  }, []);
-
-  const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
-    e.preventDefault();
-
-    if (
-      formField.module === '' ||
-      formField.name === '' ||
-      formField.link === '' ||
-      formField.order_number === 0 ||
-      formField.status === ''
-    ) {
-      setAlert({ show: true, message: 'Please fill in all required fields.' });
-      return;
-    }
-
-    doUpdateMenu(e);
-    console.log(formField);
     setAlert({ show: false, message: '' });
   };
 
   const resetForm = () => {
-    setFormField(initialState);
+    setSelectedMenu(initialState)
     setAlert({ show: false, message: '' });
   };
 
@@ -100,8 +96,8 @@ const EditDialog = () => {
                     <Input
                       className="input"
                       type="text"
-                      value={formField.module}
-                      onChange={(e) => setFormField({ ...formField, module: e.target.value })}
+                      value={selectedMenu.module}
+                      onChange={(e) => setSelectedMenu({ ...selectedMenu, module: e.target.value })}
                     />
                   </div>
                 </div>
@@ -114,8 +110,8 @@ const EditDialog = () => {
                     <Input
                       className="input"
                       type="text"
-                      value={formField.name}
-                      onChange={(e) => setFormField({ ...formField, name: e.target.value })}
+                      value={selectedMenu.name}
+                      onChange={(e) => setSelectedMenu({ ...selectedMenu, name: e.target.value })}
                     />
                   </div>
                 </div>
@@ -128,8 +124,8 @@ const EditDialog = () => {
                     <Input
                       className="input"
                       type="text"
-                      value={formField.link}
-                      onChange={(e) => setFormField({ ...formField, link: e.target.value })}
+                      value={selectedMenu.link}
+                      onChange={(e) => setSelectedMenu({ ...selectedMenu, link: e.target.value })}
                     />
                   </div>
                 </div>
@@ -137,12 +133,23 @@ const EditDialog = () => {
                 <div className="w-full">
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">ID Parent</label>
-                    <Input
-                      className="input"
-                      type="text"
-                      value={formField.id_parent}
-                      onChange={(e) => setFormField({ ...formField, id_parent: e.target.value })}
-                    />
+                    <FormControl fullWidth margin="dense">
+                      <NativeSelect
+                        defaultValue={30}
+                        value={selectedMenu.id_parent}
+                        onChange={(e: any) => setSelectedMenu({ ...selectedMenu, id_parent: e.target.value })}
+                        inputProps={{
+                          name: 'id_parent',
+                          id: 'uncontrolled-native',
+                        }}
+                      >
+                      {
+                        parents ? parents.map((el: any) => (
+                          <option key={el.id} value={el.id}>{el.name}</option>
+                        )) : ''
+                      }
+                      </NativeSelect>
+                    </FormControl>
                   </div>
                 </div>
 
@@ -155,10 +162,10 @@ const EditDialog = () => {
                       className="input"
                       type="number"
                       min={0}
-                      value={formField.order_number === 0 ? '' : formField.order_number}
+                      value={selectedMenu.order_number === 0 ? '' : selectedMenu.order_number}
                       onChange={(e) => {
                         const value = parseInt(e.target.value, 10);
-                        setFormField({ ...formField, order_number: isNaN(value) ? 0 : value });
+                        setSelectedMenu({ ...selectedMenu, order_number: isNaN(value) ? 0 : value });
                       }}
                     />
                   </div>
@@ -170,8 +177,8 @@ const EditDialog = () => {
                     <Input
                       className="input"
                       type="text"
-                      value={formField.icon}
-                      onChange={(e) => setFormField({ ...formField, name: e.target.value })}
+                      value={selectedMenu.icon}
+                      onChange={(e) => setSelectedMenu({ ...selectedMenu, icon: e.target.value })}
                     />
                   </div>
                 </div>
@@ -181,12 +188,20 @@ const EditDialog = () => {
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Status<span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="text"
-                      value={formField.status}
-                      onChange={(e) => setFormField({ ...formField, status: e.target.value })}
-                    />
+                    <FormControl fullWidth margin="dense">
+                      <NativeSelect
+                        defaultValue={30}
+                        value={selectedMenu.status}
+                        onChange={(e) => setSelectedMenu({ ...selectedMenu, status: e.target.value })}
+                        inputProps={{
+                          name: 'status',
+                          id: 'uncontrolled-native',
+                        }}
+                      >
+                        <option value={"Y"}>Active</option>
+                        <option value={"N"}>Inactive</option>
+                      </NativeSelect>
+                    </FormControl>
                   </div>
                 </div>
 
diff --git a/src/pages/menu/manage-menu/hooks/ManageMenusContext.tsx b/src/pages/menu/manage-menu/hooks/ManageMenusContext.tsx
index 69f43b1..96a82f0 100644
--- a/src/pages/menu/manage-menu/hooks/ManageMenusContext.tsx
+++ b/src/pages/menu/manage-menu/hooks/ManageMenusContext.tsx
@@ -27,15 +27,26 @@ interface MenuProps {
   status: string;
 }
 
+const initialState = {
+  id: '',
+  module: '',
+  name: '',
+  link: '',
+  id_parent: '',
+  order_number: 0,
+  icon: '',
+  status: ''
+};
+
 interface ContextProps {
   menus: MenuProps[];
   showEditDialog: boolean;
-  handleEditDialog: (show: boolean, selected_postoAdms: string | null) => void;
+  handleEditDialog: (show: boolean, selected_postoAdms: object | null) => void;
   showAddDialog: boolean;
   handleAddDialog: (show: boolean) => void;
   showDeleteDialog: boolean;
-  handleDeleteDialog: (show: boolean, selected_postoAdms: string | null) => void;
-  selectedMenu: string | null;
+  handleDeleteDialog: (show: boolean, selected_postoAdms: object | null) => void;
+  selectedMenu: object | null;
   getMenusLists: (
     limit: number,
     page: number,
@@ -43,6 +54,8 @@ interface ContextProps {
     order_field: any,
     order_direction: any
   ) => Promise<{ data: MenuProps[]; totalCount: number } | undefined>;
+  setSelectedMenu: (data: object) => void;
+  parents: any;
 }
 
 const initialProps: ContextProps = {
@@ -50,11 +63,13 @@ const initialProps: ContextProps = {
   showAddDialog: false,
   handleAddDialog: (show: boolean) => {},
   showEditDialog: false,
-  handleEditDialog: (show: boolean, selected_menu: string | null) => {},
+  handleEditDialog: (show: boolean, selected_menu: object | null) => {},
   showDeleteDialog: false,
-  handleDeleteDialog: (show: boolean, selected_menu: string | null) => {},
-  selectedMenu: null,
-  getMenusLists: async () => ({ data: [], totalCount: 0 })
+  handleDeleteDialog: (show: boolean, selected_menu: object | null) => {},
+  selectedMenu: initialState,
+  getMenusLists: async () => ({ data: [], totalCount: 0 }),
+  setSelectedMenu: (data: object) => {},
+  parents: []
 };
 
 const ManageMenusContext = createContext<ContextProps>(initialProps);
@@ -65,21 +80,22 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode })
   const [showAddDialog, setShowAddDialog] = useState(false);
   const [showEditDialog, setShowEditDialog] = useState(false);
   const [showDeleteDialog, setShowDeleteDialog] = useState(false);
-  const [selectedMenu, setSelectedMenu] = useState<string | null>(null);
+  const [selectedMenu, setSelectedMenu] = useState<object | null>(initialState);
+  const [parents, setParents] = useState<any>([]);
   const { GetData } = useCallApi();
 
   const handleAddDialog = useCallback((show: boolean) => {
     setShowAddDialog(show);
   }, []);
 
-  const handleEditDialog = useCallback((show: boolean, selected_menu: string | null) => {
+  const handleEditDialog = useCallback((show: boolean, selected_menu: object | null) => {
+    if (show) setSelectedMenu(selected_menu);
     setShowEditDialog(show);
-    setSelectedMenu(selected_menu);
   }, []);
 
-  const handleDeleteDialog = useCallback((show: boolean, selected_menu: string | null) => {
+  const handleDeleteDialog = useCallback((show: boolean, selected_menu: object | null) => {
+    if (show) setSelectedMenu(selected_menu);
     setShowDeleteDialog(show);
-    setSelectedMenu(selected_menu);
   }, []);
 
   const columns = useMemo<ColumnDef<any>[]>(
@@ -135,13 +151,13 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode })
             <>
               <button
                 className="btn btn-sm btn-icon btn-clear btn-light"
-                onClick={() => handleEditDialog(true, row.id)}
+                onClick={() => handleEditDialog(true, row)}
               >
                 <KeenIcon icon="notepad-edit" />
               </button>
               <button
                 className="btn btn-sm btn-icon btn-clear btn-light"
-                onClick={() => handleDeleteDialog(true, row.id)}
+                onClick={() => handleDeleteDialog(true, row)}
               >
                 <KeenIcon icon="trash" />
               </button>
@@ -158,25 +174,27 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode })
   );
 
   const flattenChildren = (parent: any, parentIdx: number, depth = 0, parentName = '') => {
+    if (parent.link === '/') {
+      if (!parents.find((el: any) => el.id === parent.id)) setParents((el: any) => [...el, { id: parent.id, name: parent.name }]) // GET PARENTS
+    }
     if (!parent.children || parent.children.length === 0) {
       return []; // Jika tidak ada children, kembalikan array kosong
     }
 
     return parent.children.flatMap((child: any, childIdx: number) => {
-      // Jika child masih punya children, lakukan rekursi lebih dalam
       if (child.children && child.children.length > 0) {
         return flattenChildren(child, parentIdx * 100 + childIdx, depth + 1, child.name);
       }
 
-      // Jika ini adalah child terakhir (leaf node), masukkan ke array hasil
       return {
-        id: parentIdx * 100 + childIdx + 1,
+        id: child.id,
         module: parent.module,
         parentName: parentName || parent.name,
         name: child.name,
         link: child.link,
-        id_parent: parent.id_parent,
-        status: parent.status
+        id_parent: child.id_parent,
+        status: parent.status,
+        order_number: parent.order_number
       };
     });
   };
@@ -194,10 +212,8 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode })
         order_direction: sorting[0].desc ? 'DESC' : 'ASC'
       });
 
-      console.log(response?.data);
       if (!response?.data.list) return { data: [], totalCount: 0 };
 
-      // Gunakan rekursi untuk mencari children paling dalam
       const transformedData = response.data.list.flatMap((row: any, parentIdx: number) =>
         flattenChildren(row, parentIdx)
       );
@@ -205,7 +221,6 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode })
       const total_count = transformedData.length;
 
       setMenus(transformedData);
-      console.log(menus);
       return { data: transformedData, totalCount: total_count };
     } catch (error) {
       console.error('Error fetching Menus', error);
@@ -224,7 +239,9 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode })
         showDeleteDialog,
         handleDeleteDialog,
         selectedMenu,
-        getMenusLists
+        getMenusLists,
+        setSelectedMenu,
+        parents
       }}
     >
       <Toaster expand visibleToasts={9} duration={3000} />
diff --git a/src/pages/settings/user/manage-position/hooks/ManagePositionContext.tsx b/src/pages/settings/user/manage-position/hooks/ManagePositionContext.tsx
index ee3f565..2bc9d80 100644
--- a/src/pages/settings/user/manage-position/hooks/ManagePositionContext.tsx
+++ b/src/pages/settings/user/manage-position/hooks/ManagePositionContext.tsx
@@ -85,11 +85,16 @@ const ManagePositionContextProvider = ({ children }: { children: React.ReactNode
         enableSorting: false,
         enableHiding: false,
         cell: ({ row }) => {
+          const isActive = row.original.status === 'Y';
+
           return (
-            <EnforceSwitch
-              enforce={row.original.status == 'Y' ? true : false}
-              onChange={() => {}}
-            />
+            <span
+              className={`px-2 py-1 text-xs font-semibold rounded-full ${
+                isActive ? 'bg-green-100 text-green-600' : 'bg-red-100 text-red-600'
+              }`}
+            >
+              {isActive ? 'Active' : 'Inactive'}
+            </span>
           );
         },
         meta: {
diff --git a/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx b/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx
index 284ce93..efae604 100644
--- a/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx
+++ b/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx
@@ -127,11 +127,16 @@ const ManageUserContextProvider = ({ children }: { children: React.ReactNode })
         enableSorting: false,
         enableHiding: false,
         cell: ({ row }) => {
+          const isActive = row.original.status === 'Y';
+
           return (
-            <EnforceSwitch
-              enforce={row.original.status == 'Y' ? true : false}
-              onChange={() => {}}
-            />
+            <span
+              className={`px-2 py-1 text-xs font-semibold rounded-full ${
+                isActive ? 'bg-green-100 text-green-600' : 'bg-red-100 text-red-600'
+              }`}
+            >
+              {isActive ? 'Active' : 'Inactive'}
+            </span>
           );
         },
         meta: {

From 25cb7aae898c58f045637d4d01a6aa1cc4ace9b1 Mon Sep 17 00:00:00 2001
From: Wikzyy <alwi.erdi4@gmail.com>
Date: Tue, 18 Mar 2025 15:11:03 +0700
Subject: [PATCH 09/19] fix filter search posto and remove console log
 parsedUser

---
 .../home/user-profile/blocks/BasicSettings.tsx       |  2 +-
 src/pages/master/postoadms/blocks/ListToolbar.tsx    |  4 ++--
 .../postoadms/hooks/ManagePostoAdmsContext.tsx       | 12 ++++++------
 .../menu/manage-menu/hooks/ManageMenusContext.tsx    |  6 ++++--
 4 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/src/pages/account/home/user-profile/blocks/BasicSettings.tsx b/src/pages/account/home/user-profile/blocks/BasicSettings.tsx
index c5d9249..0d3847b 100644
--- a/src/pages/account/home/user-profile/blocks/BasicSettings.tsx
+++ b/src/pages/account/home/user-profile/blocks/BasicSettings.tsx
@@ -14,7 +14,7 @@ const BasicSettings = () => {
   // const user = localStorage.getItem('user');
   // const parsedUser = user ? JSON.parse(user) : null;
   const parsedUser = getAuth()?.user;
-  console.log('parsedUser :', parsedUser);
+  // console.log('parsedUser :', parsedUser);
   const [newUsername, setNewUsername] = useState<string>(parsedUser?.username || '');
   const [newEmail, setNewEmail] = useState<string>(parsedUser?.email || '');
   const [newName, setNewName] = useState<string>(parsedUser?.name || '');
diff --git a/src/pages/master/postoadms/blocks/ListToolbar.tsx b/src/pages/master/postoadms/blocks/ListToolbar.tsx
index c476994..6d6de9c 100644
--- a/src/pages/master/postoadms/blocks/ListToolbar.tsx
+++ b/src/pages/master/postoadms/blocks/ListToolbar.tsx
@@ -17,9 +17,9 @@ const ListToolbar = () => {
               <input
                 type="text"
                 placeholder="Search Postu"
-                value={(table.getColumn('PostoAdms_name')?.getFilterValue() as string) ?? ''}
+                value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
                 onChange={(event) =>
-                  table.getColumn('PostoAdms_name')?.setFilterValue(event.target.value)
+                  table.getColumn('name')?.setFilterValue(event.target.value)
                 }
               />
             </label>
diff --git a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
index 986db2e..0a80a85 100644
--- a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
+++ b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
@@ -84,9 +84,9 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
   const columns = useMemo<ColumnDef<any>[]>(
     () => [
       {
-        // accessorFn: (row) => row.PostoAdms_id,
-        // id: 'PostoAdms_id',
-        accessorKey: 'PostoAdms_id',
+        accessorFn: (row) => row.PostoAdms_id,
+        id: 'id',
+        // accessorKey: 'PostoAdms_id',
         header: ({ column }) => <DataGridColumnHeader title="ID" column={column} />,
         enableSorting: true,
         enableHiding: false,
@@ -95,9 +95,9 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
         }
       },
       {
-        // accessorFn: (row) => row.posto_adms_name,
-        // id: 'posto_adms_name',
-        accessorKey: 'PostoAdms_name',
+        accessorFn: (row) => row.PostoAdms_name,
+        id: 'name',
+        // accessorKey: 'PostoAdms_name',
         header: ({ column }) => (
           <DataGridColumnHeader title="Posto Administrativo Name" column={column} />
         ),
diff --git a/src/pages/menu/manage-menu/hooks/ManageMenusContext.tsx b/src/pages/menu/manage-menu/hooks/ManageMenusContext.tsx
index 96a82f0..a8a40e6 100644
--- a/src/pages/menu/manage-menu/hooks/ManageMenusContext.tsx
+++ b/src/pages/menu/manage-menu/hooks/ManageMenusContext.tsx
@@ -175,7 +175,8 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode })
 
   const flattenChildren = (parent: any, parentIdx: number, depth = 0, parentName = '') => {
     if (parent.link === '/') {
-      if (!parents.find((el: any) => el.id === parent.id)) setParents((el: any) => [...el, { id: parent.id, name: parent.name }]) // GET PARENTS
+      if (!parents.find((el: any) => el.id === parent.id))
+        setParents((el: any) => [...el, { id: parent.id, name: parent.name }]); // GET PARENTS
     }
     if (!parent.children || parent.children.length === 0) {
       return []; // Jika tidak ada children, kembalikan array kosong
@@ -220,8 +221,9 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode })
 
       const total_count = transformedData.length;
 
+      console.log(response.data);
       setMenus(transformedData);
-      return { data: transformedData, totalCount: total_count };
+      return { data: transformedData, totalCount: response.data.total_count };
     } catch (error) {
       console.error('Error fetching Menus', error);
       return { data: [], totalCount: 0 };

From ae24123151ce17bb239e26c28d5ada1670f473a1 Mon Sep 17 00:00:00 2001
From: Wikzyy <alwi.erdi4@gmail.com>
Date: Tue, 18 Mar 2025 16:44:02 +0700
Subject: [PATCH 10/19] remove console log

---
 src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx       | 2 +-
 src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx   | 4 ++--
 src/pages/master/products/hooks/ManageProductsContext.tsx     | 2 +-
 src/pages/master/profession/hooks/ManageProfessionContext.tsx | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx b/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx
index a4cf161..2fa55ee 100644
--- a/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx
+++ b/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx
@@ -152,7 +152,7 @@ const ManageAldeiasContextProvider = ({ children }: { children: React.ReactNode
         order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
         filter: JSON.stringify(filter)
       });
-      console.log(response?.data);
+      // console.log(response?.data);
       setAldeias(response?.data.list);
       return { data: response?.data.list, totalCount: response?.data.total_count };
     } catch (error) {
diff --git a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
index 0a80a85..2d92dda 100644
--- a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
+++ b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
@@ -111,7 +111,7 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
         accessorFn: (row) => row.municipios_name,
         id: 'municipios_name',
         header: ({ column }) => <DataGridColumnHeader title="Municipio Name" column={column} />,
-        enableSorting: true,
+        enableSorting: false,
         enableHiding: false,
         meta: {
           headerClassName: 'w-[250px]'
@@ -162,7 +162,7 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
         order_direction: sorting[0].desc ? 'DESC' : 'ASC',
         filter: JSON.stringify(filter)
       });
-      console.log(response?.data);
+      // console.log(response?.data);
       // const sortedList = response.data.data.list.sort((a: PostoAdmsProps, b: PostoAdmsProps) => {
       //   if (a.name < b.name) return -1;
       //   if (a.name > b.name) return 1;
diff --git a/src/pages/master/products/hooks/ManageProductsContext.tsx b/src/pages/master/products/hooks/ManageProductsContext.tsx
index c5b819a..adaa5d9 100644
--- a/src/pages/master/products/hooks/ManageProductsContext.tsx
+++ b/src/pages/master/products/hooks/ManageProductsContext.tsx
@@ -167,7 +167,7 @@ const ManageProductsContextProvider = ({ children }: { children: React.ReactNode
         order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
         filter: JSON.stringify(filter)
       });
-      console.log(response?.data);
+      // console.log(response?.data);
       setProducts(response?.data.list);
       return { data: response?.data.list, totalCount: response?.data.total_count };
     } catch (error) {
diff --git a/src/pages/master/profession/hooks/ManageProfessionContext.tsx b/src/pages/master/profession/hooks/ManageProfessionContext.tsx
index c4c4caf..f00c7e3 100644
--- a/src/pages/master/profession/hooks/ManageProfessionContext.tsx
+++ b/src/pages/master/profession/hooks/ManageProfessionContext.tsx
@@ -132,7 +132,7 @@ const ManageProfessionContextProvider = ({ children }: { children: React.ReactNo
         order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
         filter: JSON.stringify(filter)
       });
-      console.log(response?.data);
+      // console.log(response?.data);
       setProfession(response?.data.list);
       return { data: response?.data.list, totalCount: response?.data.total_count };
     } catch (error) {

From 8a4adf53d701bc239747eedba21c6d10d12af970 Mon Sep 17 00:00:00 2001
From: Wikzyy <alwi.erdi4@gmail.com>
Date: Tue, 18 Mar 2025 16:53:29 +0700
Subject: [PATCH 11/19] fix row table for refresh loading

---
 src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx       | 2 +-
 src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx | 2 +-
 src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx   | 2 +-
 src/pages/master/products/hooks/ManageProductsContext.tsx     | 2 +-
 src/pages/master/profession/hooks/ManageProfessionContext.tsx | 2 +-
 src/pages/master/provider/hooks/ManageProviderContext.tsx     | 2 +-
 6 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx b/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx
index 2fa55ee..f0b9aff 100644
--- a/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx
+++ b/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx
@@ -179,7 +179,7 @@ const ManageAldeiasContextProvider = ({ children }: { children: React.ReactNode
       <Toaster expand visibleToasts={9} duration={3000} />
       <DataGridProvider
         columns={columns}
-        pagination={{ size: 25 }}
+        pagination={{ size: 10 }}
         toolbar={<ListToolbar />}
         layout={{ card: true }}
         sorting={[{ id: 'id', desc: false }]}
diff --git a/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx b/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx
index 05c5931..80c208a 100644
--- a/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx
+++ b/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx
@@ -201,7 +201,7 @@ const ManageMunicipiosProvider = ({ children }: { children: React.ReactNode }) =
 
       <DataGridProvider
         columns={columns}
-        pagination={{ size: 25 }}
+        pagination={{ size: 10 }}
         toolbar={<ListToolbar />}
         layout={{ card: true }}
         sorting={[{ id: 'id', desc: false }]}
diff --git a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
index 2d92dda..5c2f500 100644
--- a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
+++ b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx
@@ -195,7 +195,7 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod
 
       <DataGridProvider
         columns={columns}
-        pagination={{ size: 25 }}
+        pagination={{ size: 10 }}
         toolbar={<ListToolbar />}
         layout={{ card: true }}
         sorting={[{ id: 'id', desc: false }]}
diff --git a/src/pages/master/products/hooks/ManageProductsContext.tsx b/src/pages/master/products/hooks/ManageProductsContext.tsx
index adaa5d9..0c23c51 100644
--- a/src/pages/master/products/hooks/ManageProductsContext.tsx
+++ b/src/pages/master/products/hooks/ManageProductsContext.tsx
@@ -193,7 +193,7 @@ const ManageProductsContextProvider = ({ children }: { children: React.ReactNode
 
       <DataGridProvider
         columns={columns}
-        pagination={{ size: 25 }}
+        pagination={{ size: 10 }}
         toolbar={<ListToolbar />}
         layout={{ card: true }}
         sorting={[{ id: 'id', desc: false }]}
diff --git a/src/pages/master/profession/hooks/ManageProfessionContext.tsx b/src/pages/master/profession/hooks/ManageProfessionContext.tsx
index f00c7e3..a9a0fc8 100644
--- a/src/pages/master/profession/hooks/ManageProfessionContext.tsx
+++ b/src/pages/master/profession/hooks/ManageProfessionContext.tsx
@@ -158,7 +158,7 @@ const ManageProfessionContextProvider = ({ children }: { children: React.ReactNo
 
       <DataGridProvider
         columns={columns}
-        pagination={{ size: 25 }}
+        pagination={{ size: 10 }}
         toolbar={<ListToolbar />}
         layout={{ card: true }}
         sorting={[{ id: 'id', desc: false }]}
diff --git a/src/pages/master/provider/hooks/ManageProviderContext.tsx b/src/pages/master/provider/hooks/ManageProviderContext.tsx
index 43635b5..2beb2a2 100644
--- a/src/pages/master/provider/hooks/ManageProviderContext.tsx
+++ b/src/pages/master/provider/hooks/ManageProviderContext.tsx
@@ -194,7 +194,7 @@ const ManageProviderContextProvider = ({ children }: { children: React.ReactNode
 
       <DataGridProvider
         columns={columns}
-        pagination={{ size: 25 }}
+        pagination={{ size: 10 }}
         toolbar={<ListToolbar />}
         layout={{ card: true }}
         sorting={[{ id: 'id', desc: false }]}

From 2909fadc01e5bece2e12dc9bb1a976f356c0ae23 Mon Sep 17 00:00:00 2001
From: Raja Oktafrianto <rajaoktafrianto3.com>
Date: Wed, 19 Mar 2025 09:31:42 +0700
Subject: [PATCH 12/19] update refresh, add data, navigasi all master

---
 src/pages/master/aldeias/AldeiasMaster.tsx    |  17 ++-
 src/pages/master/municipios/Municipios.tsx    |  14 ++
 .../master/postoadms/PostoAdmsMaster.tsx      |  14 ++
 src/pages/master/products/ProductsMaster.tsx  |  14 ++
 .../master/profession/ProfessionMaster.tsx    |  14 ++
 src/pages/master/provider/ProviderMaster.tsx  |  14 ++
 src/pages/master/sucos/SucosMaster.tsx        |  18 ++-
 src/pages/master/sucos/blocks/EditDialog.tsx  | 136 +++++++++++++++---
 .../master/sucos/hooks/ManageSucosContext.tsx |  50 +------
 src/pages/menu/manage-menu/ManageMenu.tsx     |  14 ++
 10 files changed, 237 insertions(+), 68 deletions(-)

diff --git a/src/pages/master/aldeias/AldeiasMaster.tsx b/src/pages/master/aldeias/AldeiasMaster.tsx
index 7ec7c77..3ebb197 100644
--- a/src/pages/master/aldeias/AldeiasMaster.tsx
+++ b/src/pages/master/aldeias/AldeiasMaster.tsx
@@ -3,12 +3,27 @@ import { ManageAldeiasContextProvider } from './hooks/ManageAldeiasContext';
 import AddDialog from './blocks/AddDialog';
 import EditDialog from './blocks/EditDialog';
 import DeleteDialog from './blocks/DeleteDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const AldeiasMaster = () => {
   return (
     <ManageAldeiasContextProvider>
       <Container>
-        <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">Aldeias</h1>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Aldeias</h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Master Data</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Aldeias</span>
+          </Link>
+        </Breadcrumbs>
+
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
diff --git a/src/pages/master/municipios/Municipios.tsx b/src/pages/master/municipios/Municipios.tsx
index 820900c..fd0f24c 100644
--- a/src/pages/master/municipios/Municipios.tsx
+++ b/src/pages/master/municipios/Municipios.tsx
@@ -4,12 +4,26 @@ import AddDialog from './blocks/AddDialog';
 import SearchDialog from './blocks/SearchDialog';
 import EditDialog from './blocks/EditDialog';
 import DeleteDialog from './blocks/DeleteDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const Municipios = () => {
   return (
     <ManageMunicipiosProvider>
       <Container className="mb-7">
         <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">MUNICIPIOS</h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Master Data</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Municipios</span>
+          </Link>
+        </Breadcrumbs>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
diff --git a/src/pages/master/postoadms/PostoAdmsMaster.tsx b/src/pages/master/postoadms/PostoAdmsMaster.tsx
index 3ff1138..886c856 100644
--- a/src/pages/master/postoadms/PostoAdmsMaster.tsx
+++ b/src/pages/master/postoadms/PostoAdmsMaster.tsx
@@ -4,6 +4,7 @@ import EditDialog from './blocks/EditDialog';
 import SearchDialog from './blocks/SearchDialog';
 import { ManagePostoAdmsContextProvider } from './hooks/ManagePostoAdmsContext';
 import { Container, DataGridInner } from '@/components';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const PostoAdmsMaster = () => {
   return (
@@ -12,6 +13,19 @@ const PostoAdmsMaster = () => {
         <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">
           Postu Administrativo
         </h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Master Data</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Postu Administrativo</span>
+          </Link>
+        </Breadcrumbs>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
diff --git a/src/pages/master/products/ProductsMaster.tsx b/src/pages/master/products/ProductsMaster.tsx
index 49f5eee..a75f02c 100644
--- a/src/pages/master/products/ProductsMaster.tsx
+++ b/src/pages/master/products/ProductsMaster.tsx
@@ -3,12 +3,26 @@ import { ManageProductsContextProvider } from './hooks/ManageProductsContext';
 import AddDialog from './blocks/AddDialog';
 import EditDialog from './blocks/EditDialog';
 import DeleteDialog from './blocks/DeleteDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const ProductsMaster = () => {
   return (
     <ManageProductsContextProvider>
       <Container>
         <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">Manage Products</h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Master Data</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Products</span>
+          </Link>
+        </Breadcrumbs>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
diff --git a/src/pages/master/profession/ProfessionMaster.tsx b/src/pages/master/profession/ProfessionMaster.tsx
index 5f43e43..2507d2d 100644
--- a/src/pages/master/profession/ProfessionMaster.tsx
+++ b/src/pages/master/profession/ProfessionMaster.tsx
@@ -3,12 +3,26 @@ import { ManageProfessionContextProvider } from './hooks/ManageProfessionContext
 import AddDialog from './blocks/AddDialog';
 import EditDialog from './blocks/EditDialog';
 import DeleteDialog from './blocks/DeleteDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const ProfessionMaster = () => {
   return (
     <ManageProfessionContextProvider>
       <Container>
         <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">Manage Profession</h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Master Data</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Profession</span>
+          </Link>
+        </Breadcrumbs>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
diff --git a/src/pages/master/provider/ProviderMaster.tsx b/src/pages/master/provider/ProviderMaster.tsx
index a073e82..03ed47c 100644
--- a/src/pages/master/provider/ProviderMaster.tsx
+++ b/src/pages/master/provider/ProviderMaster.tsx
@@ -3,12 +3,26 @@ import { ManageProviderContextProvider } from './hooks/ManageProviderContext';
 import AddDialog from './blocks/AddDialog';
 import EditDialog from './blocks/EditDialog';
 import DeleteDialog from './blocks/DeleteDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const ProviderMaster = () => {
   return (
     <ManageProviderContextProvider>
       <Container>
         <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">Manage Provider</h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Master Data</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Provider</span>
+          </Link>
+        </Breadcrumbs>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
diff --git a/src/pages/master/sucos/SucosMaster.tsx b/src/pages/master/sucos/SucosMaster.tsx
index 15043dc..ac7b7e5 100644
--- a/src/pages/master/sucos/SucosMaster.tsx
+++ b/src/pages/master/sucos/SucosMaster.tsx
@@ -4,15 +4,31 @@ import AddDialog from './blocks/AddDialog';
 import EditDialog from './blocks/EditDialog';
 import DeleteDialog from './blocks/DeleteDialog';
 import SearchDialog from './blocks/SearchDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const SucosMaster = () => {
   return (
     <ManageSucosContextProvider>
       <Container>
-        <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">Sucos</h1>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Sucos</h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Master Data</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Sucos</span>
+          </Link>
+        </Breadcrumbs>
+
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
+
         <AddDialog />
         <EditDialog />
         <DeleteDialog />
diff --git a/src/pages/master/sucos/blocks/EditDialog.tsx b/src/pages/master/sucos/blocks/EditDialog.tsx
index 64c8b94..24dafb5 100644
--- a/src/pages/master/sucos/blocks/EditDialog.tsx
+++ b/src/pages/master/sucos/blocks/EditDialog.tsx
@@ -2,7 +2,7 @@ import { Alert, useDataGrid } from '@/components';
 import { useManageSucosContext } from '../hooks/useManageSucosContext';
 import { useCallApi } from '@/hooks';
 import { getAuth } from '@/auth';
-import React, { useCallback, useEffect, useState } from 'react';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { apiConfig } from '@/config/api.config';
 import { toast } from 'sonner';
 import {
@@ -15,21 +15,40 @@ import {
 } from '@/components/ui/dialog';
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList
+} from '@/components/ui/command';
+
+interface PostoAdmsProps {
+  PostoAdms_id: number; // Ubah ke PostoAdms_id
+  PostoAdms_name: string; // Ubah ke PostoAdms_name
+}
 
 const API_URL = apiConfig.service_master_data;
 
 const EditDialog = () => {
-  const { showEditDialog, handleEditDialog, selectedSucos } = useManageSucosContext();
+  const parentRef = useRef<any | null>(null);
+  const { showEditDialog, handleEditDialog, selectedSucos, sucos } = useManageSucosContext();
   const { reload } = useDataGrid();
-  const { PutData } = useCallApi();
+  const { PutData, GetData } = useCallApi();
   const parsedUser = getAuth()?.user;
+  const [open, setOpen] = useState(false);
+  const [postoadms, setPostoadms] = useState<PostoAdmsProps[]>([]);
+
   const [alert, setAlert] = useState({
     show: false,
     message: ''
   });
+
   const initialState = {
     name: '',
-    posto_adm_id: 0,
+    posto_adm_id: 0, // Pastikan ini sesuai dengan PostoAdms_id
     updated_by: '',
     updated_at: ''
   };
@@ -65,6 +84,42 @@ const EditDialog = () => {
     [selectedSucos, formField]
   );
 
+  const doFetchPostoAdms = useCallback(async (sorting: any) => {
+    try {
+      sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
+      const response = await GetData(`${API_URL}/postoadms/list`, {
+        limit: 100,
+        page: 1,
+        with_deleted: false,
+        order_field: sorting[0].id,
+        order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
+      });
+
+      setPostoadms(response?.data.list);
+      console.log('Data Posto Adms:', response?.data.list); // Log data postoadms
+    } catch (error) {
+      console.log('Error fetching postoadms', error);
+    }
+  }, []);
+
+  const doFetchData = useCallback(async (id: string) => {
+    const response = await GetData(`${API_URL}/sucos/getdata/${id}`, { id });
+    console.log('Data Sucos:', response?.data); // Log data sucos
+
+    if (response?.status) {
+      setFormField((prev) => ({
+        ...prev,
+        name: response.data.name,
+        posto_adm_id: response.data.posto.id // Pastikan ini sesuai dengan PostoAdms_id
+      }));
+    } else {
+      setFormField((prev) => ({
+        ...prev,
+        name: ''
+      }));
+    }
+  }, []);
+
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
@@ -73,21 +128,40 @@ const EditDialog = () => {
       return;
     }
 
+    console.log('Form Field before update:', formField); // Log formField sebelum update
     doUpdateSucos(e);
-    console.log(formField);
     setAlert({ show: false, message: '' });
   };
 
   useEffect(() => {
     if (showEditDialog) {
+      resetForm();
+      console.log('Edit Dialog Opened'); // Log ketika dialog dibuka
+    }
+  }, [showEditDialog]);
+
+  useEffect(() => {
+    if (selectedSucos) {
+      doFetchData(selectedSucos);
+      console.log('Selected Sucos ID:', selectedSucos); // Log selectedSucos ID
+    }
+  }, [selectedSucos]);
+
+  useEffect(() => {
+    if (selectedSucos) {
       setFormField({
         ...formField,
-        updated_by: parsedUser.username,
+        updated_by: parsedUser?.username,
         updated_at: formattedTime
       });
+      console.log('Form Field after update:', formField); // Log formField setelah update
     }
   }, [formattedTime]);
 
+  useEffect(() => {
+    doFetchPostoAdms([{ id: 'name', desc: false }]);
+  }, []);
+
   return (
     <Dialog open={showEditDialog} onOpenChange={(open) => handleEditDialog(open, null)}>
       <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
@@ -122,23 +196,49 @@ const EditDialog = () => {
                 <div className="w-full">
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">
-                      Posto Adm ID
+                      Posto Administrativo Name
                       <span className="text-red-500">*</span>
                     </label>
-                    <Input
-                      className="input"
-                      type="number"
-                      min={0}
-                      value={formField.posto_adm_id === 0 ? '' : formField.posto_adm_id}
-                      onChange={(e) => {
-                        const value = parseInt(e.target.value, 10);
-                        setFormField({ ...formField, posto_adm_id: isNaN(value) ? 0 : value });
-                      }}
-                    />
+                    <Popover open={open} onOpenChange={setOpen}>
+                      <PopoverTrigger asChild>
+                        <button type="button" className="input col-span-5 text-left">
+                          {postoadms.find((posto) => posto.PostoAdms_id === formField.posto_adm_id)
+                            ?.PostoAdms_name || 'Select Posto Adms'}
+                        </button>
+                      </PopoverTrigger>
+                      <PopoverContent className="w-[400px] p-0">
+                        <Command>
+                          <CommandInput placeholder="Search Posto Adms..." />
+                          <CommandList>
+                            <CommandEmpty>No Posto Adms Found.</CommandEmpty>
+                            <CommandGroup>
+                              {postoadms.map((posto) => (
+                                <CommandItem
+                                  key={posto.PostoAdms_id}
+                                  value={posto.PostoAdms_name}
+                                  onSelect={() => {
+                                    setFormField({
+                                      ...formField,
+                                      posto_adm_id: posto.PostoAdms_id // Gunakan PostoAdms_id
+                                    });
+                                    setOpen(false);
+                                  }}
+                                >
+                                  {posto.PostoAdms_name}
+                                </CommandItem>
+                              ))}
+                            </CommandGroup>
+                          </CommandList>
+                        </Command>
+                      </PopoverContent>
+                    </Popover>
                   </div>
                 </div>
 
-                <div className="flex justify-end">
+                <div className="flex justify-end gap-5">
+                  <Button type="button" variant="outline" onClick={resetForm}>
+                    Reset
+                  </Button>
                   <Button className="btn btn-primary">Save Changes</Button>
                 </div>
               </div>
diff --git a/src/pages/master/sucos/hooks/ManageSucosContext.tsx b/src/pages/master/sucos/hooks/ManageSucosContext.tsx
index 212be5a..48bee6c 100644
--- a/src/pages/master/sucos/hooks/ManageSucosContext.tsx
+++ b/src/pages/master/sucos/hooks/ManageSucosContext.tsx
@@ -86,7 +86,7 @@ const ManageSucosContextProvider = ({ children }: { children: React.ReactNode })
   const columns = useMemo<ColumnDef<any>[]>(
     () => [
       {
-        accessorFn: (row) => row.sucos_id,
+        accessorKey: 'sucos_id',
         id: 'id',
         header: ({ column }) => <DataGridColumnHeader title="ID" column={column} />,
         enableSorting: true,
@@ -168,52 +168,6 @@ const ManageSucosContextProvider = ({ children }: { children: React.ReactNode })
     }
   };
 
-  const getAldeiasBySucos = async (name: string) => {
-    try {
-      const response = await axios.get(`${API_URL}/sucos/aldeias/${name}`);
-      const data = response.data;
-      console.log(data);
-    } catch (error) {
-      console.log(`Error fetching sucos by ${name}`, error);
-    }
-  };
-
-  const createSucos = async (data: Partial<SucosProps>) => {
-    try {
-      await axios.post(`${API_URL}/sucos/create`, data);
-      // getMunicipiosLists(10, 1, false, 'name', 'ASC');
-    } catch (error) {
-      console.error('Error creating municipios', error);
-    }
-  };
-
-  const updateSucos = async (id: number, data: Partial<SucosProps>) => {
-    try {
-      await axios.put(`${API_URL}/sucos/update/${id}`, data);
-      // getSucosLists(10, 1, false, 'name', 'ASC');
-    } catch (error) {
-      console.error('Error updating sucos', error);
-    }
-  };
-
-  const deleteSucos = async (id: number, hardDelete?: boolean) => {
-    try {
-      await axios.delete(`${API_URL}/sucos/delete/${id}/${hardDelete}`);
-      // getSucosLists(10, 1, false, 'name', 'ASC');
-    } catch (error) {
-      console.error('Error deleting sucos', error);
-    }
-  };
-
-  const restoreSucos = async (id: number) => {
-    try {
-      await axios.put(`${API_URL}/sucos/restore/${id}`);
-      // getSucosLists(10, 1, false, 'name', 'ASC');
-    } catch (error) {
-      console.error('Error restoring sucos', error);
-    }
-  };
-
   return (
     <ManageSucosContext.Provider
       value={{
@@ -234,7 +188,7 @@ const ManageSucosContextProvider = ({ children }: { children: React.ReactNode })
 
       <DataGridProvider
         columns={columns}
-        pagination={{ size: 25 }}
+        pagination={{ size: 10 }}
         toolbar={<ListToolbar />}
         layout={{ card: true }}
         sorting={[{ id: 'id', desc: false }]}
diff --git a/src/pages/menu/manage-menu/ManageMenu.tsx b/src/pages/menu/manage-menu/ManageMenu.tsx
index 75e0925..7dac58a 100644
--- a/src/pages/menu/manage-menu/ManageMenu.tsx
+++ b/src/pages/menu/manage-menu/ManageMenu.tsx
@@ -3,12 +3,26 @@ import { ManageMenusContextProvider } from './hooks/ManageMenusContext';
 import AddDialog from './blocks/AddDIalog';
 import EditDialog from './blocks/EditDialog';
 import DeleteDialog from './blocks/DeleteDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const ManageMenu = () => {
   return (
     <ManageMenusContextProvider>
       <Container>
         <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">Manage Menus</h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Master Data</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Menus</span>
+          </Link>
+        </Breadcrumbs>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>

From 621cae6694fab7cd077177321f893944b1f10edb Mon Sep 17 00:00:00 2001
From: Raja Oktafrianto <rajaoktafrianto3.com>
Date: Wed, 19 Mar 2025 09:44:25 +0700
Subject: [PATCH 13/19] update delete & edit data

---
 src/pages/master/sucos/blocks/EditDialog.tsx        | 1 +
 src/pages/master/sucos/blocks/ListToolbar.tsx       | 2 +-
 src/pages/master/sucos/hooks/ManageSucosContext.tsx | 4 ++--
 3 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/pages/master/sucos/blocks/EditDialog.tsx b/src/pages/master/sucos/blocks/EditDialog.tsx
index 24dafb5..0e08201 100644
--- a/src/pages/master/sucos/blocks/EditDialog.tsx
+++ b/src/pages/master/sucos/blocks/EditDialog.tsx
@@ -162,6 +162,7 @@ const EditDialog = () => {
     doFetchPostoAdms([{ id: 'name', desc: false }]);
   }, []);
 
+  console.log(selectedSucos);
   return (
     <Dialog open={showEditDialog} onOpenChange={(open) => handleEditDialog(open, null)}>
       <DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
diff --git a/src/pages/master/sucos/blocks/ListToolbar.tsx b/src/pages/master/sucos/blocks/ListToolbar.tsx
index f5cd607..313188e 100644
--- a/src/pages/master/sucos/blocks/ListToolbar.tsx
+++ b/src/pages/master/sucos/blocks/ListToolbar.tsx
@@ -16,7 +16,7 @@ const ListToolbar = () => {
               <input
                 type="text"
                 placeholder="Search Sucos"
-                value={table.getColumn(`sucos_id`)?.getFilterValue() as string}
+                value={table.getColumn(`id`)?.getFilterValue() as string}
                 onChange={(event) =>
                   table.getColumn('sucos_name')?.setFilterValue(event.target.value)
                 }
diff --git a/src/pages/master/sucos/hooks/ManageSucosContext.tsx b/src/pages/master/sucos/hooks/ManageSucosContext.tsx
index 48bee6c..ddcd6c6 100644
--- a/src/pages/master/sucos/hooks/ManageSucosContext.tsx
+++ b/src/pages/master/sucos/hooks/ManageSucosContext.tsx
@@ -126,13 +126,13 @@ const ManageSucosContextProvider = ({ children }: { children: React.ReactNode })
             <>
               <button
                 className="btn btn-sm btn-icon btn-clear btn-light"
-                onClick={() => handleEditDialog(true, row.id)}
+                onClick={() => handleEditDialog(true, row.sucos_id)}
               >
                 <KeenIcon icon="notepad-edit" />
               </button>
               <button
                 className="btn btn-sm btn-icon btn-clear btn-light"
-                onClick={() => handleDeleteDialog(true, row.id)}
+                onClick={() => handleDeleteDialog(true, row.sucos_id)}
               >
                 <KeenIcon icon="trash" />
               </button>

From f019316fb3405734486b613599de095509b2d232 Mon Sep 17 00:00:00 2001
From: Raja Oktafrianto <rajaoktafrianto3.com>
Date: Wed, 19 Mar 2025 10:15:15 +0700
Subject: [PATCH 14/19] Revert yarn.lock to previous state

---
 yarn.lock | 402 ++++++++++++++++--------------------------------------
 1 file changed, 115 insertions(+), 287 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index f128329..644ce57 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -39,7 +39,7 @@
   resolved "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.26.0.tgz"
   integrity sha512-qETICbZSLe7uXv9VE8T/RWOdIE5qqyTucOt4zLYMafj2MRO271VGgLd4RACJMeBO37UPWhXiKMBk7YlJ0fOzQA==
 
-"@babel/core@^7.25.2":
+"@babel/core@^7.0.0", "@babel/core@^7.0.0-0", "@babel/core@^7.25.2":
   version "7.26.0"
   resolved "https://registry.npmjs.org/@babel/core/-/core-7.26.0.tgz"
   integrity sha512-i1SLeK+DzNnQ3LL/CswPCa/E5u4lh1k6IAEphON8F+cXt0t9euTshDru0q7/IqMa1PMPz5RnHuHscF8/ZJsStg==
@@ -540,13 +540,6 @@
   resolved "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz"
   integrity sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==
 
-"@emotion/is-prop-valid@1.2.2":
-  version "1.2.2"
-  resolved "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.2.tgz"
-  integrity sha512-uNsoYd37AFmaCdXlg6EYD1KaPOaRWRByMCYzbKUX4+hhMfrxdVSelShywL4JVaAeM/eHUOSprYBQls+/neX3pw==
-  dependencies:
-    "@emotion/memoize" "^0.8.1"
-
 "@emotion/is-prop-valid@^1.3.0":
   version "1.3.1"
   resolved "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.3.1.tgz"
@@ -554,6 +547,13 @@
   dependencies:
     "@emotion/memoize" "^0.9.0"
 
+"@emotion/is-prop-valid@1.2.2":
+  version "1.2.2"
+  resolved "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.2.tgz"
+  integrity sha512-uNsoYd37AFmaCdXlg6EYD1KaPOaRWRByMCYzbKUX4+hhMfrxdVSelShywL4JVaAeM/eHUOSprYBQls+/neX3pw==
+  dependencies:
+    "@emotion/memoize" "^0.8.1"
+
 "@emotion/memoize@^0.8.1":
   version "0.8.1"
   resolved "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.1.tgz"
@@ -564,7 +564,7 @@
   resolved "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz"
   integrity sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==
 
-"@emotion/react@^11.13.3":
+"@emotion/react@^11.0.0-rc.0", "@emotion/react@^11.13.3", "@emotion/react@^11.4.1", "@emotion/react@^11.5.0":
   version "11.13.3"
   resolved "https://registry.npmjs.org/@emotion/react/-/react-11.13.3.tgz"
   integrity sha512-lIsdU6JNrmYfJ5EbUCf4xW1ovy5wKQ2CkPRM4xogziOxH1nXxBSjpC9YqbFAP7circxMfYp+6x676BqWcEiixg==
@@ -594,7 +594,7 @@
   resolved "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.4.0.tgz"
   integrity sha512-fTBW9/8r2w3dXWYM4HCB1Rdp8NLibOw2+XELH5m5+AkWiL/KqYX6dc0kKYlaYyKjrQ6ds33MCdMPEwgs2z1rqg==
 
-"@emotion/styled@^11.13.0":
+"@emotion/styled@^11.13.0", "@emotion/styled@^11.3.0":
   version "11.13.0"
   resolved "https://registry.npmjs.org/@emotion/styled/-/styled-11.13.0.tgz"
   integrity sha512-tkzkY7nQhW/zC4hztlwucpT8QEZ6eUzpXDRhww/Eej4tFfO0FxQYWRyg/c5CCXa4d/f174kqeXYjuQRnhzf6dA==
@@ -606,16 +606,16 @@
     "@emotion/use-insertion-effect-with-fallbacks" "^1.1.0"
     "@emotion/utils" "^1.4.0"
 
-"@emotion/unitless@0.8.1":
-  version "0.8.1"
-  resolved "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.1.tgz"
-  integrity sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==
-
 "@emotion/unitless@^0.10.0":
   version "0.10.0"
   resolved "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.10.0.tgz"
   integrity sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==
 
+"@emotion/unitless@0.8.1":
+  version "0.8.1"
+  resolved "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.1.tgz"
+  integrity sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==
+
 "@emotion/use-insertion-effect-with-fallbacks@^1.1.0":
   version "1.1.0"
   resolved "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.1.0.tgz"
@@ -631,121 +631,11 @@
   resolved "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.4.0.tgz"
   integrity sha512-snKqtPW01tN0ui7yu9rGv69aJXr/a/Ywvl11sUjNtEcRc+ng/mQriFL0wLXMef74iHa/EkftbDzU9F8iFbH+zg==
 
-"@esbuild/aix-ppc64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz#c7184a326533fcdf1b8ee0733e21c713b975575f"
-  integrity sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==
-
-"@esbuild/android-arm64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.21.5.tgz#09d9b4357780da9ea3a7dfb833a1f1ff439b4052"
-  integrity sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==
-
-"@esbuild/android-arm@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.21.5.tgz#9b04384fb771926dfa6d7ad04324ecb2ab9b2e28"
-  integrity sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==
-
-"@esbuild/android-x64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.21.5.tgz#29918ec2db754cedcb6c1b04de8cd6547af6461e"
-  integrity sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==
-
 "@esbuild/darwin-arm64@0.21.5":
   version "0.21.5"
   resolved "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.21.5.tgz"
   integrity sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==
 
-"@esbuild/darwin-x64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.21.5.tgz#c13838fa57372839abdddc91d71542ceea2e1e22"
-  integrity sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==
-
-"@esbuild/freebsd-arm64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.21.5.tgz#646b989aa20bf89fd071dd5dbfad69a3542e550e"
-  integrity sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==
-
-"@esbuild/freebsd-x64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.21.5.tgz#aa615cfc80af954d3458906e38ca22c18cf5c261"
-  integrity sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==
-
-"@esbuild/linux-arm64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.21.5.tgz#70ac6fa14f5cb7e1f7f887bcffb680ad09922b5b"
-  integrity sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==
-
-"@esbuild/linux-arm@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.21.5.tgz#fc6fd11a8aca56c1f6f3894f2bea0479f8f626b9"
-  integrity sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==
-
-"@esbuild/linux-ia32@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.21.5.tgz#3271f53b3f93e3d093d518d1649d6d68d346ede2"
-  integrity sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==
-
-"@esbuild/linux-loong64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.21.5.tgz#ed62e04238c57026aea831c5a130b73c0f9f26df"
-  integrity sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==
-
-"@esbuild/linux-mips64el@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.21.5.tgz#e79b8eb48bf3b106fadec1ac8240fb97b4e64cbe"
-  integrity sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==
-
-"@esbuild/linux-ppc64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.21.5.tgz#5f2203860a143b9919d383ef7573521fb154c3e4"
-  integrity sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==
-
-"@esbuild/linux-riscv64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.21.5.tgz#07bcafd99322d5af62f618cb9e6a9b7f4bb825dc"
-  integrity sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==
-
-"@esbuild/linux-s390x@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.21.5.tgz#b7ccf686751d6a3e44b8627ababc8be3ef62d8de"
-  integrity sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==
-
-"@esbuild/linux-x64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.21.5.tgz#6d8f0c768e070e64309af8004bb94e68ab2bb3b0"
-  integrity sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==
-
-"@esbuild/netbsd-x64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.21.5.tgz#bbe430f60d378ecb88decb219c602667387a6047"
-  integrity sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==
-
-"@esbuild/openbsd-x64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.21.5.tgz#99d1cf2937279560d2104821f5ccce220cb2af70"
-  integrity sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==
-
-"@esbuild/sunos-x64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.21.5.tgz#08741512c10d529566baba837b4fe052c8f3487b"
-  integrity sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==
-
-"@esbuild/win32-arm64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.21.5.tgz#675b7385398411240735016144ab2e99a60fc75d"
-  integrity sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==
-
-"@esbuild/win32-ia32@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.21.5.tgz#1bfc3ce98aa6ca9a0969e4d2af72144c59c1193b"
-  integrity sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==
-
-"@esbuild/win32-x64@0.21.5":
-  version "0.21.5"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.21.5.tgz#acad351d582d157bb145535db2a6ff53dd514b5c"
-  integrity sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==
-
 "@eslint-community/eslint-utils@^4.2.0", "@eslint-community/eslint-utils@^4.4.0":
   version "4.4.1"
   resolved "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.1.tgz"
@@ -787,16 +677,16 @@
     minimatch "^3.1.2"
     strip-json-comments "^3.1.1"
 
-"@eslint/js@9.13.0":
-  version "9.13.0"
-  resolved "https://registry.npmjs.org/@eslint/js/-/js-9.13.0.tgz"
-  integrity sha512-IFLyoY4d72Z5y/6o/BazFBezupzI/taV8sGumxTAVw3lXG9A6md1Dc34T9s1FoD/an9pJH8RHbAxsaEbBed9lA==
-
 "@eslint/js@^9.14.0":
   version "9.14.0"
   resolved "https://registry.npmjs.org/@eslint/js/-/js-9.14.0.tgz"
   integrity sha512-pFoEtFWCPyDOl+C6Ift+wC7Ro89otjigCf5vcuWqWgqNSQbRrpjSvdeE6ofLz4dHmyxD5f7gIdGT4+p36L6Twg==
 
+"@eslint/js@9.13.0":
+  version "9.13.0"
+  resolved "https://registry.npmjs.org/@eslint/js/-/js-9.13.0.tgz"
+  integrity sha512-IFLyoY4d72Z5y/6o/BazFBezupzI/taV8sGumxTAVw3lXG9A6md1Dc34T9s1FoD/an9pJH8RHbAxsaEbBed9lA==
+
 "@eslint/object-schema@^2.1.4":
   version "2.1.4"
   resolved "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-2.1.4.tgz"
@@ -814,7 +704,7 @@
   resolved "https://registry.npmjs.org/@faker-js/faker/-/faker-9.1.0.tgz"
   integrity sha512-GJvX9iM9PBtKScJVlXQ0tWpihK3i0pha/XAhzQa1hPK/ILLa1Wq3I63Ij7lRtqTwmdTxRCyrUhLC5Sly9SLbug==
 
-"@firebase/app@^0.10.15":
+"@firebase/app@^0.10.15", "@firebase/app@0.x":
   version "0.10.15"
   resolved "https://registry.npmjs.org/@firebase/app/-/app-0.10.15.tgz"
   integrity sha512-he6qlG3pmwL+LHdG/BrSMBQeJzzutciq4fpXN3lGa1uSwYSijJ24VtakS/bP2X9SiDf8jGywJ4u+OgXAenJsNg==
@@ -1094,13 +984,6 @@
   resolved "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-6.1.6.tgz"
   integrity sha512-nz1SlR9TdBYYPz4qKoNasMPRiGb4PaIHFkzLzhju0YVYS5QSuFF2+n7CsiHMIDcHv3piPu/xDWI53ruhOqvZwQ==
 
-"@mui/icons-material@^6.4.6":
-  version "6.4.7"
-  resolved "https://registry.yarnpkg.com/@mui/icons-material/-/icons-material-6.4.7.tgz#078406b61c7d17230b8633643dbb458f89e02059"
-  integrity sha512-Rk8cs9ufQoLBw582Rdqq7fnSXXZTqhYRbpe1Y5SAz9lJKZP3CIdrj0PfG8HJLGw1hrsHFN/rkkm70IDzhJsG1g==
-  dependencies:
-    "@babel/runtime" "^7.26.0"
-
 "@mui/material@^6.1.6":
   version "6.1.6"
   resolved "https://registry.npmjs.org/@mui/material/-/material-6.1.6.tgz"
@@ -1191,7 +1074,7 @@
     "@nodelib/fs.stat" "2.0.5"
     run-parallel "^1.1.9"
 
-"@nodelib/fs.stat@2.0.5", "@nodelib/fs.stat@^2.0.2":
+"@nodelib/fs.stat@^2.0.2", "@nodelib/fs.stat@2.0.5":
   version "2.0.5"
   resolved "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz"
   integrity sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==
@@ -1415,7 +1298,7 @@
     "@radix-ui/react-primitive" "2.0.0"
     "@radix-ui/react-use-callback-ref" "1.1.0"
 
-"@radix-ui/react-id@1.1.0", "@radix-ui/react-id@^1.1.0":
+"@radix-ui/react-id@^1.1.0", "@radix-ui/react-id@1.1.0":
   version "1.1.0"
   resolved "https://registry.npmjs.org/@radix-ui/react-id/-/react-id-1.1.0.tgz"
   integrity sha512-EJUrI8yYh7WOjNOqpoJaf1jlFIH2LvtgAl+YcFqNCa+4hj64ZXmPkAKOFs/ukjz3byN6bdb/AVUqHkI8/uWWMA==
@@ -1499,7 +1382,7 @@
     "@radix-ui/react-compose-refs" "1.1.0"
     "@radix-ui/react-use-layout-effect" "1.1.0"
 
-"@radix-ui/react-primitive@2.0.0", "@radix-ui/react-primitive@^2.0.0":
+"@radix-ui/react-primitive@^2.0.0", "@radix-ui/react-primitive@2.0.0":
   version "2.0.0"
   resolved "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-2.0.0.tgz"
   integrity sha512-ZSpFm0/uHa8zTvKBDjLFWLo8dkr4MBsiDLz0g3gMUwqgLHz9rTaRRGYDgvZPtBJgYCBKXkS9fzmoySgr8CO6Cw==
@@ -1587,7 +1470,7 @@
     "@radix-ui/react-use-previous" "1.1.0"
     "@radix-ui/react-use-size" "1.1.0"
 
-"@radix-ui/react-slot@1.1.0", "@radix-ui/react-slot@^1.1.0":
+"@radix-ui/react-slot@^1.1.0", "@radix-ui/react-slot@1.1.0":
   version "1.1.0"
   resolved "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.1.0.tgz"
   integrity sha512-FUCf5XMfmW4dtYl69pdS4DbxKy8nj4M7SafBgPllysxmdachynNflAdp/gCsnYWNDnge6tI9onzMp5ARYc1KNw==
@@ -1690,96 +1573,11 @@
   resolved "https://registry.npmjs.org/@remix-run/router/-/router-1.21.0.tgz"
   integrity sha512-xfSkCAchbdG5PnbrKqFWwia4Bi61nH+wm8wLEqfHDyp7Y3dZzgqS2itV8i4gAq9pC2HsTpwyBC6Ds8VHZ96JlA==
 
-"@rollup/rollup-android-arm-eabi@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.24.2.tgz#07db37fcd9d401aae165f662c0069efd61d4ffcc"
-  integrity sha512-ufoveNTKDg9t/b7nqI3lwbCG/9IJMhADBNjjz/Jn6LxIZxD7T5L8l2uO/wD99945F1Oo8FvgbbZJRguyk/BdzA==
-
-"@rollup/rollup-android-arm64@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.24.2.tgz#160975402adf85ecd58a0721ad60ae1779a68147"
-  integrity sha512-iZoYCiJz3Uek4NI0J06/ZxUgwAfNzqltK0MptPDO4OR0a88R4h0DSELMsflS6ibMCJ4PnLvq8f7O1d7WexUvIA==
-
 "@rollup/rollup-darwin-arm64@4.24.2":
   version "4.24.2"
   resolved "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.24.2.tgz"
   integrity sha512-/UhrIxobHYCBfhi5paTkUDQ0w+jckjRZDZ1kcBL132WeHZQ6+S5v9jQPVGLVrLbNUebdIRpIt00lQ+4Z7ys4Rg==
 
-"@rollup/rollup-darwin-x64@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.24.2.tgz#3f4987eff6195532037c50b8db92736e326b5bb2"
-  integrity sha512-1F/jrfhxJtWILusgx63WeTvGTwE4vmsT9+e/z7cZLKU8sBMddwqw3UV5ERfOV+H1FuRK3YREZ46J4Gy0aP3qDA==
-
-"@rollup/rollup-freebsd-arm64@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.24.2.tgz#15fe184ecfafc635879500f6985c954e57697c44"
-  integrity sha512-1YWOpFcGuC6iGAS4EI+o3BV2/6S0H+m9kFOIlyFtp4xIX5rjSnL3AwbTBxROX0c8yWtiWM7ZI6mEPTI7VkSpZw==
-
-"@rollup/rollup-freebsd-x64@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.24.2.tgz#c72d37315d36b6e0763b7aabb6ae53c361b45e05"
-  integrity sha512-3qAqTewYrCdnOD9Gl9yvPoAoFAVmPJsBvleabvx4bnu1Kt6DrB2OALeRVag7BdWGWLhP1yooeMLEi6r2nYSOjg==
-
-"@rollup/rollup-linux-arm-gnueabihf@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.24.2.tgz#f274f81abf845dcca5f1f40d434a09a79a3a73a0"
-  integrity sha512-ArdGtPHjLqWkqQuoVQ6a5UC5ebdX8INPuJuJNWRe0RGa/YNhVvxeWmCTFQ7LdmNCSUzVZzxAvUznKaYx645Rig==
-
-"@rollup/rollup-linux-arm-musleabihf@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.24.2.tgz#9edaeb1a9fa7d4469917cb0614f665f1cf050625"
-  integrity sha512-B6UHHeNnnih8xH6wRKB0mOcJGvjZTww1FV59HqJoTJ5da9LCG6R4SEBt6uPqzlawv1LoEXSS0d4fBlHNWl6iYw==
-
-"@rollup/rollup-linux-arm64-gnu@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.24.2.tgz#6eb6851f594336bfa00f074f58a00a61e9751493"
-  integrity sha512-kr3gqzczJjSAncwOS6i7fpb4dlqcvLidqrX5hpGBIM1wtt0QEVtf4wFaAwVv8QygFU8iWUMYEoJZWuWxyua4GQ==
-
-"@rollup/rollup-linux-arm64-musl@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.24.2.tgz#9d8dc8e80df8f156d2888ecb8d6c96d653580731"
-  integrity sha512-TDdHLKCWgPuq9vQcmyLrhg/bgbOvIQ8rtWQK7MRxJ9nvaxKx38NvY7/Lo6cYuEnNHqf6rMqnivOIPIQt6H2AoA==
-
-"@rollup/rollup-linux-powerpc64le-gnu@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.24.2.tgz#358e3e7dda2d60c46ff7c74f7075045736df5b50"
-  integrity sha512-xv9vS648T3X4AxFFZGWeB5Dou8ilsv4VVqJ0+loOIgDO20zIhYfDLkk5xoQiej2RiSQkld9ijF/fhLeonrz2mw==
-
-"@rollup/rollup-linux-riscv64-gnu@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.24.2.tgz#b08461ace599c3f0b5f27051f1756b6cf1c78259"
-  integrity sha512-tbtXwnofRoTt223WUZYiUnbxhGAOVul/3StZ947U4A5NNjnQJV5irKMm76G0LGItWs6y+SCjUn/Q0WaMLkEskg==
-
-"@rollup/rollup-linux-s390x-gnu@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.24.2.tgz#daab36c9b5c8ac4bfe5a9c4c39ad711464b7dfee"
-  integrity sha512-gc97UebApwdsSNT3q79glOSPdfwgwj5ELuiyuiMY3pEWMxeVqLGKfpDFoum4ujivzxn6veUPzkGuSYoh5deQ2Q==
-
-"@rollup/rollup-linux-x64-gnu@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.24.2.tgz#4cc3a4f31920bdb028dbfd7ce0e972a17424a63c"
-  integrity sha512-jOG/0nXb3z+EM6SioY8RofqqmZ+9NKYvJ6QQaa9Mvd3RQxlH68/jcB/lpyVt4lCiqr04IyaC34NzhUqcXbB5FQ==
-
-"@rollup/rollup-linux-x64-musl@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.24.2.tgz#59800e26c538517ee05f4645315d9e1aded93200"
-  integrity sha512-XAo7cJec80NWx9LlZFEJQxqKOMz/lX3geWs2iNT5CHIERLFfd90f3RYLLjiCBm1IMaQ4VOX/lTC9lWfzzQm14Q==
-
-"@rollup/rollup-win32-arm64-msvc@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.24.2.tgz#c80e2c33c952b6b171fa6ad9a97dfbb2e4ebee44"
-  integrity sha512-A+JAs4+EhsTjnPQvo9XY/DC0ztaws3vfqzrMNMKlwQXuniBKOIIvAAI8M0fBYiTCxQnElYu7mLk7JrhlQ+HeOw==
-
-"@rollup/rollup-win32-ia32-msvc@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.24.2.tgz#a1e9d275cb16f6d5feb9c20aee7e897b1e193359"
-  integrity sha512-ZhcrakbqA1SCiJRMKSU64AZcYzlZ/9M5LaYil9QWxx9vLnkQ9Vnkve17Qn4SjlipqIIBFKjBES6Zxhnvh0EAEw==
-
-"@rollup/rollup-win32-x64-msvc@4.24.2":
-  version "4.24.2"
-  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.24.2.tgz#0610af0fb8fec52be779d5b163bbbd6930150467"
-  integrity sha512-2mLH46K1u3r6uwc95hU+OR9q/ggYMpnS7pSp83Ece1HUQgF9Nh/QwTK5rcgbFnV9j+08yBrU5sA/P0RK2MSBNA==
-
 "@tanstack/query-core@5.59.20":
   version "5.59.20"
   resolved "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.59.20.tgz"
@@ -1837,7 +1635,7 @@
   dependencies:
     "@babel/types" "^7.20.7"
 
-"@types/estree@1.0.6", "@types/estree@^1.0.6":
+"@types/estree@^1.0.6", "@types/estree@1.0.6":
   version "1.0.6"
   resolved "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz"
   integrity sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==
@@ -1847,7 +1645,7 @@
   resolved "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.14.tgz"
   integrity sha512-WCfD5Ht3ZesJUsONdhvm84dmzWOiOzOAqOncN0++w0lBw1o8OuDNJF2McvvCef/yBqb/HYRahp1BYtODFQ8bRg==
 
-"@types/hoist-non-react-statics@*", "@types/hoist-non-react-statics@3", "@types/hoist-non-react-statics@^3.3.1":
+"@types/hoist-non-react-statics@*", "@types/hoist-non-react-statics@^3.3.1", "@types/hoist-non-react-statics@3":
   version "3.3.5"
   resolved "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.5.tgz"
   integrity sha512-SbcrWzkKBw2cdwRTwQAswfpB9g9LJWfjtUeW/jvNwbhC8cpmmNYVePa+ncbUe0rGTQ7G3Ff6mYUN2VMfLVr+Sg==
@@ -1867,7 +1665,7 @@
   dependencies:
     "@types/geojson" "*"
 
-"@types/node@>=12.12.47", "@types/node@>=13.7.0", "@types/node@^22.9.0":
+"@types/node@^18.0.0 || >=20.0.0", "@types/node@^22.9.0", "@types/node@>=12.12.47", "@types/node@>=13.7.0":
   version "22.9.0"
   resolved "https://registry.npmjs.org/@types/node/-/node-22.9.0.tgz"
   integrity sha512-vuyHg81vvWA1Z1ELfvLko2c8f34gyA0zaic0+Rllc5lbCnbSyuvb2Oxpm6TAUAC/2xZN3QGqxBNggD1nNR2AfQ==
@@ -1884,7 +1682,7 @@
   resolved "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.13.tgz"
   integrity sha512-hCZTSvwbzWGvhqxp/RqVqwU999pBf2vp7hzIjiYOsl8wqOmUxkQ6ddw1cV3l8811+kdUFus/q4d1Y3E3SyEifA==
 
-"@types/react-dom@^18.3.1":
+"@types/react-dom@*", "@types/react-dom@^18.3.1":
   version "18.3.1"
   resolved "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.1.tgz"
   integrity sha512-qW1Mfv8taImTthu4KoXgDfLuk4bydU6Q/TkADnDWWHwi4NX4BR+LWfTp2sVmTqRrsHvyDDTelgelxJ+SsejKKQ==
@@ -1905,7 +1703,7 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react@*", "@types/react@16 || 17 || 18", "@types/react@^18.3.12":
+"@types/react@*", "@types/react@^16.8.0 || ^17.0.0 || ^18.0.0", "@types/react@^16.9.0 || ^17.0.0 || ^18.0.0", "@types/react@^17.0.0 || ^18.0.0", "@types/react@^17.0.0 || ^18.0.0 || ^19.0.0", "@types/react@^18.3.12", "@types/react@16 || 17 || 18":
   version "18.3.12"
   resolved "https://registry.npmjs.org/@types/react/-/react-18.3.12.tgz"
   integrity sha512-D2wOSq/d6Agt28q7rSI3jhU7G6aiuzljDGZ2hTZHIkrTLUI+AF3WMeKkEZ9nN2fkBAlcktT6vcZjDFiIhMYEQw==
@@ -1922,17 +1720,17 @@
     "@types/react" "*"
     csstype "^3.0.2"
 
-"@types/stylis@4.2.5":
-  version "4.2.5"
-  resolved "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.5.tgz"
-  integrity sha512-1Xve+NMN7FWjY14vLoY5tL3BVEQ/n42YLwaqJIPYhotZ9uBHt87VceMwWQpzmdEt2TNXIorIFG+YeCUUW7RInw==
-
 "@types/stylis@^4.2.6":
   version "4.2.6"
   resolved "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.6.tgz"
   integrity sha512-4nebF2ZJGzQk0ka0O6+FZUWceyFv4vWq/0dXBMmrSeAwzOuOd/GxE5Pa64d/ndeNLG73dXoBsRzvtsVsYUv6Uw==
 
-"@typescript-eslint/eslint-plugin@8.14.0", "@typescript-eslint/eslint-plugin@^8.14.0":
+"@types/stylis@4.2.5":
+  version "4.2.5"
+  resolved "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.5.tgz"
+  integrity sha512-1Xve+NMN7FWjY14vLoY5tL3BVEQ/n42YLwaqJIPYhotZ9uBHt87VceMwWQpzmdEt2TNXIorIFG+YeCUUW7RInw==
+
+"@typescript-eslint/eslint-plugin@^8.14.0", "@typescript-eslint/eslint-plugin@8.14.0":
   version "8.14.0"
   resolved "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.14.0.tgz"
   integrity sha512-tqp8H7UWFaZj0yNO6bycd5YjMwxa6wIHOLZvWPkidwbgLCsBMetQoGj7DPuAlWa2yGO3H48xmPwjhsSPPCGU5w==
@@ -1947,7 +1745,7 @@
     natural-compare "^1.4.0"
     ts-api-utils "^1.3.0"
 
-"@typescript-eslint/parser@8.14.0", "@typescript-eslint/parser@^8.14.0":
+"@typescript-eslint/parser@^8.0.0 || ^8.0.0-alpha.0", "@typescript-eslint/parser@^8.14.0", "@typescript-eslint/parser@8.14.0":
   version "8.14.0"
   resolved "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.14.0.tgz"
   integrity sha512-2p82Yn9juUJq0XynBXtFCyrBDb6/dJombnz6vbo6mgQEtWHfvHbQuEa9kAOVIt1c9YFwi7H6WxtPj1kg+80+RA==
@@ -2056,7 +1854,7 @@ acorn-jsx@^5.3.2:
   resolved "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz"
   integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
 
-acorn@^8.12.0:
+"acorn@^6.0.0 || ^7.0.0 || ^8.0.0", acorn@^8.12.0:
   version "8.14.0"
   resolved "https://registry.npmjs.org/acorn/-/acorn-8.14.0.tgz"
   integrity sha512-cl669nCJTZBsL97OF4kUQm5g5hC2uihk0NxY3WENAC0TYdILVkAyHymAntgxGkl7K+t0cXIrH5siy5S4XkFycA==
@@ -2106,7 +1904,7 @@ anymatch@~3.1.2:
     normalize-path "^3.0.0"
     picomatch "^2.0.4"
 
-apexcharts@3.52.0:
+apexcharts@^3.41.0, apexcharts@3.52.0:
   version "3.52.0"
   resolved "https://registry.npmjs.org/apexcharts/-/apexcharts-3.52.0.tgz"
   integrity sha512-7dg0ADKs8AA89iYMZMe2sFDG0XK5PfqllKV9N+i3hKHm3vEtdhwz8AlXGm+/b0nJ6jKiaXsqci5LfVxNhtB+dA==
@@ -2222,7 +2020,7 @@ broadcast-channel@^3.4.1:
     rimraf "3.0.2"
     unload "2.2.0"
 
-browserslist@^4.23.1, browserslist@^4.23.3, browserslist@^4.24.0:
+browserslist@^4.23.1, browserslist@^4.23.3, browserslist@^4.24.0, "browserslist@>= 4.21.0":
   version "4.24.2"
   resolved "https://registry.npmjs.org/browserslist/-/browserslist-4.24.2.tgz"
   integrity sha512-ZIc+Q62revdMcqC6aChtW4jz3My3klmCO1fEmINZY/8J3EpBg5/A/D0AKmBveUh6pgoeycoMkVMko84tuYS+Gg==
@@ -2302,11 +2100,6 @@ cliui@^8.0.1:
     strip-ansi "^6.0.1"
     wrap-ansi "^7.0.0"
 
-clsx@2.0.0:
-  version "2.0.0"
-  resolved "https://registry.npmjs.org/clsx/-/clsx-2.0.0.tgz"
-  integrity sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==
-
 clsx@^1.1.0:
   version "1.2.1"
   resolved "https://registry.npmjs.org/clsx/-/clsx-1.2.1.tgz"
@@ -2317,6 +2110,11 @@ clsx@^2.1.0, clsx@^2.1.1:
   resolved "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz"
   integrity sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==
 
+clsx@2.0.0:
+  version "2.0.0"
+  resolved "https://registry.npmjs.org/clsx/-/clsx-2.0.0.tgz"
+  integrity sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==
+
 cmdk@^1.0.4:
   version "1.0.4"
   resolved "https://registry.npmjs.org/cmdk/-/cmdk-1.0.4.tgz"
@@ -2436,12 +2234,12 @@ cssjanus@^2.0.1:
   resolved "https://registry.npmjs.org/cssjanus/-/cssjanus-2.3.0.tgz"
   integrity sha512-ZZXXn51SnxRxAZ6fdY7mBDPmA4OZd83q/J9Gdqz3YmE9TUq+9tZl+tdOnCi7PpNygI6PEkehj9rgifv5+W8a5A==
 
-csstype@3.1.3, csstype@^3.0.2, csstype@^3.1.3:
+csstype@^3.0.10, csstype@^3.0.2, csstype@^3.1.3, csstype@3.1.3:
   version "3.1.3"
   resolved "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz"
   integrity sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==
 
-date-fns@^3.0.0:
+"date-fns@^2.28.0 || ^3.0.0", date-fns@^3.0.0:
   version "3.6.0"
   resolved "https://registry.npmjs.org/date-fns/-/date-fns-3.6.0.tgz"
   integrity sha512-fRHTG8g/Gif+kSh50gaGEdToemgfj74aRX3swtiouboip5JDLAyDE9F11nHMIcvOaXeOC6D7SpNhi7uFyB7Uww==
@@ -2583,7 +2381,7 @@ escape-string-regexp@^4.0.0:
   resolved "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz"
   integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==
 
-eslint-config-prettier@^9.1.0:
+eslint-config-prettier@*, eslint-config-prettier@^9.1.0:
   version "9.1.0"
   resolved "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.1.0.tgz"
   integrity sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==
@@ -2624,7 +2422,7 @@ eslint-visitor-keys@^4.1.0:
   resolved "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.1.0.tgz"
   integrity sha512-Q7lok0mqMUSf5a/AdAZkA5a/gHcO6snwQClVNNvFKCAVlxXucdU8pKydU5ZVZjBx5xr37vGbFFWtLQYreLzrZg==
 
-eslint@^9.13.0:
+"eslint@^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0 || ^9.0.0", "eslint@^6.0.0 || ^7.0.0 || >=8.0.0", "eslint@^8.57.0 || ^9.0.0", eslint@^9.13.0, eslint@>=7, eslint@>=7.0.0, eslint@>=8.0.0:
   version "9.13.0"
   resolved "https://registry.npmjs.org/eslint/-/eslint-9.13.0.tgz"
   integrity sha512-EYZK6SX6zjFHST/HRytOdA/zE72Cq/bfw45LSyuwrdvcclb/gqV8RRQxywOBEWO2+WDpva6UZa4CcDeJKzUCFA==
@@ -2824,12 +2622,10 @@ fs.realpath@^1.0.0:
 
 fsevents@~2.3.2, fsevents@~2.3.3:
   version "2.3.3"
-  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.3.tgz#cac6407785d03675a2a5e1a5305c697b347d90d6"
+  resolved "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz"
   integrity sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==
-
-function-bind@^1.1.2:
   version "1.1.2"
-  resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.2.tgz#2c02d864d97f3ea6c8830c464cbd11ab6eab7a1c"
+  resolved "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz"
   integrity sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==
 
 gensync@^1.0.0-beta.2:
@@ -2858,7 +2654,7 @@ get-nonce@^1.0.0:
   resolved "https://registry.npmjs.org/get-nonce/-/get-nonce-1.0.1.tgz"
   integrity sha512-FJhYRoDaiatfEkUK8HKlicmu/3SGFD51q3itKDGoSTysQJBnfOcxU5GxnhE1E6soB76MbT0MBtnKJuXyAx+96Q==
 
-glob-parent@^5.1.2, glob-parent@~5.1.2:
+glob-parent@^5.1.2:
   version "5.1.2"
   resolved "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz"
   integrity sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==
@@ -2872,6 +2668,13 @@ glob-parent@^6.0.2:
   dependencies:
     is-glob "^4.0.3"
 
+glob-parent@~5.1.2:
+  version "5.1.2"
+  resolved "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz"
+  integrity sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==
+  dependencies:
+    is-glob "^4.0.1"
+
 glob@^10.3.10:
   version "10.4.5"
   resolved "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz"
@@ -2952,7 +2755,7 @@ hasown@^2.0.0, hasown@^2.0.2:
   dependencies:
     function-bind "^1.1.2"
 
-hoist-non-react-statics@3, hoist-non-react-statics@^3.3.0, hoist-non-react-statics@^3.3.1:
+hoist-non-react-statics@^3.3.0, hoist-non-react-statics@^3.3.1, hoist-non-react-statics@3:
   version "3.3.2"
   resolved "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz"
   integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
@@ -3072,7 +2875,7 @@ jackspeak@^3.1.2:
   optionalDependencies:
     "@pkgjs/parseargs" "^0.11.0"
 
-jiti@^1.18.2, jiti@^1.21.0:
+jiti@*, jiti@^1.18.2, jiti@^1.21.0:
   version "1.21.6"
   resolved "https://registry.npmjs.org/jiti/-/jiti-1.21.6.tgz"
   integrity sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w==
@@ -3136,7 +2939,7 @@ kolorist@^1.8.0:
   resolved "https://registry.npmjs.org/kolorist/-/kolorist-1.8.0.tgz"
   integrity sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==
 
-leaflet@^1.9.4:
+leaflet@^1.9.0, leaflet@^1.9.4:
   version "1.9.4"
   resolved "https://registry.npmjs.org/leaflet/-/leaflet-1.9.4.tgz"
   integrity sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA==
@@ -3270,7 +3073,14 @@ mini-svg-data-uri@^1.4.4:
   resolved "https://registry.npmjs.org/mini-svg-data-uri/-/mini-svg-data-uri-1.4.4.tgz"
   integrity sha512-r9deDe9p5FJUPZAk3A59wGH7Ii9YrjjWw0jmw/liSbHl2CHiyXj6FcDXDu2K3TjVAXqiJdaw3xxwlZZr9E6nHg==
 
-minimatch@^3.1.1, minimatch@^3.1.2:
+minimatch@^3.1.1:
+  version "3.1.2"
+  resolved "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz"
+  integrity sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==
+  dependencies:
+    brace-expansion "^1.1.7"
+
+minimatch@^3.1.2:
   version "3.1.2"
   resolved "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz"
   integrity sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==
@@ -3771,7 +3581,15 @@ postcss-selector-not@^8.0.1:
   dependencies:
     postcss-selector-parser "^7.0.0"
 
-postcss-selector-parser@^6.0.11, postcss-selector-parser@^6.1.1:
+postcss-selector-parser@^6.0.11:
+  version "6.1.2"
+  resolved "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz"
+  integrity sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==
+  dependencies:
+    cssesc "^3.0.0"
+    util-deprecate "^1.0.2"
+
+postcss-selector-parser@^6.1.1:
   version "6.1.2"
   resolved "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz"
   integrity sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==
@@ -3792,6 +3610,15 @@ postcss-value-parser@^4.0.0, postcss-value-parser@^4.0.2, postcss-value-parser@^
   resolved "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz"
   integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==
 
+postcss@^8, postcss@^8.0.0, postcss@^8.0.3, postcss@^8.1.0, postcss@^8.2.14, postcss@^8.4, postcss@^8.4.21, postcss@^8.4.23, postcss@^8.4.43, postcss@^8.4.49, postcss@^8.4.6, postcss@>=8.0.9:
+  version "8.4.49"
+  resolved "https://registry.npmjs.org/postcss/-/postcss-8.4.49.tgz"
+  integrity sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==
+  dependencies:
+    nanoid "^3.3.7"
+    picocolors "^1.1.1"
+    source-map-js "^1.2.1"
+
 postcss@8.4.38:
   version "8.4.38"
   resolved "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz"
@@ -3801,15 +3628,6 @@ postcss@8.4.38:
     picocolors "^1.0.0"
     source-map-js "^1.2.0"
 
-postcss@^8.4.23, postcss@^8.4.43, postcss@^8.4.49:
-  version "8.4.49"
-  resolved "https://registry.npmjs.org/postcss/-/postcss-8.4.49.tgz"
-  integrity sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==
-  dependencies:
-    nanoid "^3.3.7"
-    picocolors "^1.1.1"
-    source-map-js "^1.2.1"
-
 prelude-ls@^1.2.1:
   version "1.2.1"
   resolved "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz"
@@ -3822,7 +3640,7 @@ prettier-linter-helpers@^1.0.0:
   dependencies:
     fast-diff "^1.1.2"
 
-prettier@^3.3.3:
+prettier@^3.3.3, prettier@>=3.0.0:
   version "3.3.3"
   resolved "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz"
   integrity sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==
@@ -3893,7 +3711,7 @@ react-day-picker@^8.10.1:
   resolved "https://registry.npmjs.org/react-day-picker/-/react-day-picker-8.10.1.tgz"
   integrity sha512-TMx7fNbhLk15eqcMt+7Z7S2KF7mfTId/XJDjKE8f+IUcFn0l08/kI4FiYTL/0yuOLmEcbR4Fwe3GJf/NiiMnPA==
 
-react-dom@^18.3.1:
+"react-dom@^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc", "react-dom@^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", "react-dom@^16.8.0 || ^17.0.0 || ^18.0.0", "react-dom@^17.0.0 || ^18.0.0", "react-dom@^17.0.0 || ^18.0.0 || ^19.0.0", "react-dom@^18 || ^19 || ^19.0.0-rc", react-dom@^18.0.0, "react-dom@^18.0.0 || ^19.0.0 || ^19.0.0-rc", react-dom@^18.3.1, "react-dom@>= 16.8.0", react-dom@>=16.6.0, react-dom@>=16.8, react-dom@>=16.8.0:
   version "18.3.1"
   resolved "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz"
   integrity sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==
@@ -3906,7 +3724,12 @@ react-fast-compare@^2.0.1:
   resolved "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-2.0.4.tgz"
   integrity sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==
 
-react-fast-compare@^3.1.1, react-fast-compare@^3.2.2:
+react-fast-compare@^3.1.1:
+  version "3.2.2"
+  resolved "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.2.tgz"
+  integrity sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==
+
+react-fast-compare@^3.2.2:
   version "3.2.2"
   resolved "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.2.tgz"
   integrity sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==
@@ -3958,7 +3781,12 @@ react-intl@^6.8.7:
     intl-messageformat "10.7.6"
     tslib "2"
 
-react-is@^16.13.1, react-is@^16.7.0:
+react-is@^16.13.1:
+  version "16.13.1"
+  resolved "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
+  integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
+
+react-is@^16.7.0:
   version "16.13.1"
   resolved "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
   integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
@@ -4016,7 +3844,7 @@ react-router-dom@^6.28.0:
     "@remix-run/router" "1.21.0"
     react-router "6.28.0"
 
-react-router@6.28.0, react-router@^6.28.0:
+react-router@^6.28.0, react-router@6.28.0:
   version "6.28.0"
   resolved "https://registry.npmjs.org/react-router/-/react-router-6.28.0.tgz"
   integrity sha512-HrYdIFqdrnhDw0PqG/AKjAqEqM7AvxCz0DQ4h2W8k6nqmc5uRBYDag0SBxx9iYz5G8gnuNVLzUe13wl9eAsXXg==
@@ -4047,7 +3875,7 @@ react-transition-group@^4.4.5:
     loose-envify "^1.4.0"
     prop-types "^15.6.2"
 
-react@^18.3.1:
+"react@^16.3.0 || ^17.0.0 || ^18.0.0", "react@^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0-rc", "react@^16.6.0 || ^17.0.0 || ^18.0.0", "react@^16.6.0 || 17 || 18", "react@^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc", "react@^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", "react@^16.8.0 || ^17.0.0 || ^18.0.0", "react@^17.0.0 || ^18.0.0", "react@^17.0.0 || ^18.0.0 || ^19.0.0", "react@^18 || ^19", "react@^18 || ^19 || ^19.0.0-rc", react@^18.0.0, "react@^18.0.0 || ^19.0.0 || ^19.0.0-rc", react@^18.3.1, "react@>= 16.8.0", react@>=0.13, react@>=16.3.0, react@>=16.6.0, react@>=16.8, react@>=16.8.0, "react@16.8 - 18":
   version "18.3.1"
   resolved "https://registry.npmjs.org/react/-/react-18.3.1.tgz"
   integrity sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==
@@ -4172,7 +4000,7 @@ set-function-length@^1.2.1:
     gopd "^1.0.1"
     has-property-descriptors "^1.0.2"
 
-shallowequal@1.1.0, shallowequal@^1.1.0:
+shallowequal@^1.1.0, shallowequal@1.1.0:
   version "1.1.0"
   resolved "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz"
   integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
@@ -4294,6 +4122,11 @@ stylis-plugin-rtl@^2.1.1:
   dependencies:
     cssjanus "^2.0.1"
 
+stylis@^4.3.4, stylis@4.x:
+  version "4.3.4"
+  resolved "https://registry.npmjs.org/stylis/-/stylis-4.3.4.tgz"
+  integrity sha512-osIBl6BGUmSfDkyH2mB7EFvCJntXDrLhKjHTRj/rK6xLH0yuPrHULDRQzKokSOD4VoorhtKpfcfW1GAntu8now==
+
 stylis@4.2.0:
   version "4.2.0"
   resolved "https://registry.npmjs.org/stylis/-/stylis-4.2.0.tgz"
@@ -4304,11 +4137,6 @@ stylis@4.3.2:
   resolved "https://registry.npmjs.org/stylis/-/stylis-4.3.2.tgz"
   integrity sha512-bhtUjWd/z6ltJiQwg0dUfxEJ+W+jdqQd8TbWLWyeIJHlnsqmGLRFFd8e5mA0AZi/zx90smXRlN66YMTcaSFifg==
 
-stylis@^4.3.4:
-  version "4.3.4"
-  resolved "https://registry.npmjs.org/stylis/-/stylis-4.3.4.tgz"
-  integrity sha512-osIBl6BGUmSfDkyH2mB7EFvCJntXDrLhKjHTRj/rK6xLH0yuPrHULDRQzKokSOD4VoorhtKpfcfW1GAntu8now==
-
 sucrase@^3.32.0:
   version "3.35.0"
   resolved "https://registry.npmjs.org/sucrase/-/sucrase-3.35.0.tgz"
@@ -4355,7 +4183,7 @@ svg.filter.js@^2.0.2:
   dependencies:
     svg.js "^2.2.5"
 
-svg.js@>=2.3.x, svg.js@^2.0.1, svg.js@^2.2.5, svg.js@^2.4.0, svg.js@^2.6.5:
+svg.js@^2.0.1, svg.js@^2.2.5, svg.js@^2.4.0, svg.js@^2.6.5, svg.js@>=2.3.x:
   version "2.7.1"
   resolved "https://registry.npmjs.org/svg.js/-/svg.js-2.7.1.tgz"
   integrity sha512-ycbxpizEQktk3FYvn/8BH+6/EuWXg7ZpQREJvgacqn46gIddG24tNNe4Son6omdXCnSOaApnpZw6MPCBA1dODA==
@@ -4407,7 +4235,7 @@ tailwindcss-animate@^1.0.7:
   resolved "https://registry.npmjs.org/tailwindcss-animate/-/tailwindcss-animate-1.0.7.tgz"
   integrity sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA==
 
-tailwindcss@^3.4.14:
+tailwindcss@^3.4.14, "tailwindcss@>=3.0.0 || insiders":
   version "3.4.14"
   resolved "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.14.tgz"
   integrity sha512-IcSvOcTRcUtQQ7ILQL5quRDg7Xs93PdJEk1ZLbhhvJc7uj/OAhYOnruEiwnGgBvUtaUAJ8/mhSw1o8L2jCiENA==
@@ -4486,7 +4314,7 @@ ts-interface-checker@^0.1.9:
   resolved "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz"
   integrity sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==
 
-tslib@2, tslib@^2.0.0, tslib@^2.1.0, tslib@^2.6.2:
+tslib@^2.0.0, tslib@^2.1.0, tslib@^2.6.2, tslib@2:
   version "2.8.0"
   resolved "https://registry.npmjs.org/tslib/-/tslib-2.8.0.tgz"
   integrity sha512-jWVzBLplnCmoaTr13V9dYbiQ99wvZRd0vNWaDRg+aVYRcjDF3nDksxFDE/+fkXnKhpnUUkmx5pK/v8mCtLVqZA==
@@ -4517,7 +4345,7 @@ typescript-eslint@^8.14.0:
     "@typescript-eslint/parser" "8.14.0"
     "@typescript-eslint/utils" "8.14.0"
 
-typescript@^5.6.3:
+"typescript@^4.7 || 5", typescript@^5.6.3, typescript@>=4.2.0:
   version "5.6.3"
   resolved "https://registry.npmjs.org/typescript/-/typescript-5.6.3.tgz"
   integrity sha512-hjcS1mhfuyi4WW8IWtjP7brDrG2cuDZukyrYrSauoXGNgx0S7zceP07adYkJycEr56BOUTNPzbInooiN3fn1qw==
@@ -4585,7 +4413,7 @@ vite-plugin-windicss@^1.9.3:
     kolorist "^1.8.0"
     windicss "^3.5.6"
 
-vite@^5.4.11:
+"vite@^2.0.1 || ^3.0.0 || ^4.0.0 || ^5.0.0", "vite@^4.2.0 || ^5.0.0", vite@^5.4.11:
   version "5.4.11"
   resolved "https://registry.npmjs.org/vite/-/vite-5.4.11.tgz"
   integrity sha512-c7jFQRklXua0mTzneGW9QVyxFjUgwcihC4bXEtujIo2ouWCe1Ajt/amn2PCxYnhYfd5k09JX3SB7OYWFKYqj8Q==

From db3a9bcda0d5b66a6b6b553a9ba84ea5a2d1386d Mon Sep 17 00:00:00 2001
From: wayanrivan <wayan.rivan@shiblysolution.id>
Date: Wed, 19 Mar 2025 11:42:03 +0800
Subject: [PATCH 15/19] delete env

---
 .env | 7 -------
 1 file changed, 7 deletions(-)
 delete mode 100644 .env

diff --git a/.env b/.env
deleted file mode 100644
index 04d3402..0000000
--- a/.env
+++ /dev/null
@@ -1,7 +0,0 @@
-VITE_APP_NAME=tpay-dashboard-tl
-VITE_APP_VERSION=1=9.1.1
-GENERATE_SOURCEMAP=false
-
-VITE_APP_API_URL=https://tpay.shiblysolution.id/api
-# VITE_APP_API_URL=http://0.0.0.0:4001/api
-VITE_ENV=default
\ No newline at end of file

From 0904c612e95faf64c59bd8f22a8646a5020d2ee4 Mon Sep 17 00:00:00 2001
From: Wikzyy <alwi.erdi4@gmail.com>
Date: Wed, 19 Mar 2025 11:08:40 +0700
Subject: [PATCH 16/19] add .env on gitignore

---
 .gitignore | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.gitignore b/.gitignore
index baee0cd..d2a16d3 100644
--- a/.gitignore
+++ b/.gitignore
@@ -7,6 +7,7 @@ yarn-error.log*
 pnpm-debug.log*
 lerna-debug.log*
 
+.env
 node_modules
 dist
 dist-ssr

From cc5332eee8fe49a9b54001eae33b4111598eea50 Mon Sep 17 00:00:00 2001
From: Wikzyy <alwi.erdi4@gmail.com>
Date: Wed, 19 Mar 2025 11:23:10 +0700
Subject: [PATCH 17/19] fix padding and margin table

---
 .../account/manage-account/ManageAccount.tsx  |   2 +-
 .../manage-currency/ManageCurrency.tsx        |   5 +-
 .../hooks/ManageCurrencyContext.tsx           |   3 -
 src/pages/groups/ManageGroups.tsx             | 122 ++++++++++++------
 src/pages/master/aldeias/AldeiasMaster.tsx    |   2 +-
 src/pages/master/sucos/SucosMaster.tsx        |   2 +-
 src/pages/members/kyc/Kyc.tsx                 |   4 +-
 .../members/manage-members/ManageMembers.tsx  |   4 +-
 8 files changed, 89 insertions(+), 55 deletions(-)

diff --git a/src/pages/account/manage-account/ManageAccount.tsx b/src/pages/account/manage-account/ManageAccount.tsx
index 6fd1190..20dcf35 100644
--- a/src/pages/account/manage-account/ManageAccount.tsx
+++ b/src/pages/account/manage-account/ManageAccount.tsx
@@ -74,7 +74,7 @@ const ManageAccount = () => {
 
   return (
     <div>
-      <div className="container mx-auto p-5">
+      <div className="container mx-auto">
         <h1 className="text-xl font-medium leading-none text-gray-900 p-5">Manage Account</h1>
         <DataTable
           columns={columns}
diff --git a/src/pages/account/manage-currency/ManageCurrency.tsx b/src/pages/account/manage-currency/ManageCurrency.tsx
index a9b89e9..30cbf70 100644
--- a/src/pages/account/manage-currency/ManageCurrency.tsx
+++ b/src/pages/account/manage-currency/ManageCurrency.tsx
@@ -5,12 +5,13 @@ import AddDialog from './blocks/AddDialog';
 const ManageCurrency = () => {
   return (
     <ManageCurrencyContextProvider>
-      <Container>
+      <div className="container mx-auto">
+        <h1 className="text-xl font-medium leading-none text-gray-900 p-5">Manage Currency</h1>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
         <AddDialog />
-      </Container>
+      </div>
     </ManageCurrencyContextProvider>
   );
 };
diff --git a/src/pages/account/manage-currency/hooks/ManageCurrencyContext.tsx b/src/pages/account/manage-currency/hooks/ManageCurrencyContext.tsx
index c5cd102..5549b4b 100644
--- a/src/pages/account/manage-currency/hooks/ManageCurrencyContext.tsx
+++ b/src/pages/account/manage-currency/hooks/ManageCurrencyContext.tsx
@@ -220,9 +220,6 @@ const ManageCurrencyContextProvider = ({ children }: { children: React.ReactNode
   console.log(currencies);
   return (
     <div>
-      <div className="container mx-auto py-5">
-        <h1>Manage Currency</h1>
-      </div>
       <ManageCurrencyContext.Provider
         value={{
           showEditDialog,
diff --git a/src/pages/groups/ManageGroups.tsx b/src/pages/groups/ManageGroups.tsx
index cbd9fe0..ef73fd8 100644
--- a/src/pages/groups/ManageGroups.tsx
+++ b/src/pages/groups/ManageGroups.tsx
@@ -2,8 +2,19 @@ import { DataTable } from '@/components/ui/DataTable';
 import { columns, Group } from './Column';
 import { apiConfig } from '@/config/api.config';
 import axios, { AxiosResponse } from 'axios';
-import { DialogContent, MenuItem, Radio, RadioGroup, FormControlLabel, FormControl,
-  Dialog, DialogTitle, Typography, Button, Box } from '@mui/material';
+import {
+  DialogContent,
+  MenuItem,
+  Radio,
+  RadioGroup,
+  FormControlLabel,
+  FormControl,
+  Dialog,
+  DialogTitle,
+  Typography,
+  Button,
+  Box
+} from '@mui/material';
 import { useState, useEffect } from 'react';
 // import IconButton from '@mui/material/IconButton';
 import CloseIcon from '@mui/icons-material/Close';
@@ -21,7 +32,7 @@ let initGroup = {
   pin_length: '',
   max_pin_attempts: '',
   default_notification: ''
-}
+};
 
 const ManageGroups = () => {
   const [isDialogOpen, setIsDialogOpen] = useState(false);
@@ -31,9 +42,9 @@ const ManageGroups = () => {
   const [pageSize, setPageSize] = useState(10);
   const [dialogType, setDialogType] = useState('');
   const [dialogOpen, setDialogOpen] = useState(false);
-  
+
   useEffect(() => {
-    fetchGroups()
+    fetchGroups();
   }, []);
 
   async function fetchGroups() {
@@ -47,29 +58,29 @@ const ManageGroups = () => {
           order_direction: 'ASC'
         }
       });
-      let temp = 1
+      let temp = 1;
       let resGroups = groups.data.data.list.map((el: any) => {
-        el.no = temp++
-        return el
-      })
-      setDataGroup(resGroups)
+        el.no = temp++;
+        return el;
+      });
+      setDataGroup(resGroups);
     } catch (error: any) {
-      alert(error.message)
+      alert(error.message);
       console.log(error);
     }
   }
 
   const openDialog = () => setIsDialogOpen(true);
   const closeDialog = () => {
-    setIsDialogOpen(false)
-    setFormData(initGroup)
+    setIsDialogOpen(false);
+    setFormData(initGroup);
   };
 
   const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     setFormData({
       ...formData,
       [e.target.name]: e.target.value
-    })
+    });
   };
 
   const handleSubmit = async (e: React.FormEvent) => {
@@ -89,9 +100,9 @@ const ManageGroups = () => {
       groupName: group.name,
       status: group.status,
       description: group.description
-    })
+    });
     setDialogType('update');
-    setIsDialogOpen(true)
+    setIsDialogOpen(true);
   };
 
   const handleDelete = (group: any) => {
@@ -101,27 +112,27 @@ const ManageGroups = () => {
       groupName: group.name,
       status: group.status,
       description: group.description
-    })
+    });
     setDialogType('delete');
-    setDialogOpen(true)
+    setDialogOpen(true);
   };
 
   const handleYes = async () => {
     try {
       if (dialogType === 'create') {
         await axios.post(`${BASE_URL}/groups/create`, {
-          "name": formData.groupName,
-          "status": formData.status,
-          "created_at": new Date()
-        })
+          name: formData.groupName,
+          status: formData.status,
+          created_at: new Date()
+        });
       } else if (dialogType === 'update') {
         await axios.put(`${BASE_URL}/groups/update/${formData.id}`, {
-          "name": formData.groupName,
-          "status": formData.status,
-          "updated_at": new Date()
-        })
+          name: formData.groupName,
+          status: formData.status,
+          updated_at: new Date()
+        });
       } else if (dialogType === 'delete') {
-        await axios.delete(`${BASE_URL}/groups/delete/${formData.id}/true`)
+        await axios.delete(`${BASE_URL}/groups/delete/${formData.id}/true`);
       }
       await fetchGroups();
       closeDialog();
@@ -135,26 +146,41 @@ const ManageGroups = () => {
 
   return (
     <div>
-      <div className="container mx-auto pt-2">
-      <ConfirmDialog
-        open={dialogOpen}
-        onClose={() => setDialogOpen(false)}
-        title="Confirm Action"
-        content={`Are you sure you want to `+( dialogType === 'create' ? "create?" : ( dialogType === 'update' ? "update?" : "delete?"))}
-        onYes={handleYes}
-        onNo={() => setDialogOpen(false)}
-      />
-        <h1 className="text-xl font-medium leading-none text-gray-900 p-5">Groups</h1>
-        <DataTable data={dataGroup} columns={columns} createData={createGroup} onUpdate={handleUpdate} onDelete={handleDelete} />
+      <div className="container mx-auto">
+        <ConfirmDialog
+          open={dialogOpen}
+          onClose={() => setDialogOpen(false)}
+          title="Confirm Action"
+          content={
+            `Are you sure you want to ` +
+            (dialogType === 'create' ? 'create?' : dialogType === 'update' ? 'update?' : 'delete?')
+          }
+          onYes={handleYes}
+          onNo={() => setDialogOpen(false)}
+        />
+        <h1 className="text-xl font-medium leading-none text-gray-900 p-5">Manage Groups</h1>
+        <DataTable
+          data={dataGroup}
+          columns={columns}
+          createData={createGroup}
+          onUpdate={handleUpdate}
+          onDelete={handleDelete}
+        />
         <Dialog open={isDialogOpen} onClose={closeDialog}>
           <DialogContent className="w-[600px]">
             <div className="flex justify-between">
               <DialogTitle>Create New Group</DialogTitle>
               <Box display="flex" justifyContent="flex-end">
-                <Button variant="outlined" sx={{ borderColor: "white", color: 'grey' }} onClick={closeDialog}><CloseIcon/></Button>
+                <Button
+                  variant="outlined"
+                  sx={{ borderColor: 'white', color: 'grey' }}
+                  onClick={closeDialog}
+                >
+                  <CloseIcon />
+                </Button>
               </Box>
             </div>
-            <Divider/>
+            <Divider />
             <div className="p-5 mt-5">
               <form onSubmit={handleSubmit} className="flex flex-col gap-4 w-full">
                 <div className="grid grid-cols-4 items-center gap-4 w-full">
@@ -174,9 +200,19 @@ const ManageGroups = () => {
                     <span className="text-red-500">*</span>Active Status:
                   </label>
                   <FormControl>
-                    <RadioGroup name='status' row value={formData.status} onChange={handleChange}>
-                      <FormControlLabel value="Y" checked={formData.status === 'Y'} control={<Radio />} label="Yes" />
-                      <FormControlLabel value="N" checked={formData.status === 'N'} control={<Radio />} label="No" />
+                    <RadioGroup name="status" row value={formData.status} onChange={handleChange}>
+                      <FormControlLabel
+                        value="Y"
+                        checked={formData.status === 'Y'}
+                        control={<Radio />}
+                        label="Yes"
+                      />
+                      <FormControlLabel
+                        value="N"
+                        checked={formData.status === 'N'}
+                        control={<Radio />}
+                        label="No"
+                      />
                     </RadioGroup>
                   </FormControl>
                 </div>
diff --git a/src/pages/master/aldeias/AldeiasMaster.tsx b/src/pages/master/aldeias/AldeiasMaster.tsx
index 3ebb197..a3d0ad7 100644
--- a/src/pages/master/aldeias/AldeiasMaster.tsx
+++ b/src/pages/master/aldeias/AldeiasMaster.tsx
@@ -9,7 +9,7 @@ const AldeiasMaster = () => {
   return (
     <ManageAldeiasContextProvider>
       <Container>
-        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Aldeias</h1>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">Aldeias</h1>
         <Breadcrumbs sx={{ mb: 2 }}>
           <Link underline="none" color="inherit" href="/">
             <span className="text-sm hover:underline">Dashboard</span>
diff --git a/src/pages/master/sucos/SucosMaster.tsx b/src/pages/master/sucos/SucosMaster.tsx
index ac7b7e5..c698cfa 100644
--- a/src/pages/master/sucos/SucosMaster.tsx
+++ b/src/pages/master/sucos/SucosMaster.tsx
@@ -10,7 +10,7 @@ const SucosMaster = () => {
   return (
     <ManageSucosContextProvider>
       <Container>
-        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Sucos</h1>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">Sucos</h1>
         <Breadcrumbs sx={{ mb: 2 }}>
           <Link underline="none" color="inherit" href="/">
             <span className="text-sm hover:underline">Dashboard</span>
diff --git a/src/pages/members/kyc/Kyc.tsx b/src/pages/members/kyc/Kyc.tsx
index e346889..a458350 100644
--- a/src/pages/members/kyc/Kyc.tsx
+++ b/src/pages/members/kyc/Kyc.tsx
@@ -140,7 +140,7 @@ const Kyc = () => {
 
   return (
     <div>
-      <div className="container mx-auto py-5">
+      <div className="container mx-auto">
         <ConfirmDialog
           open={dialogOpen}
           onClose={() => setDialogOpen(false)}
@@ -151,7 +151,7 @@ const Kyc = () => {
         />
         <CustomerDialog open={isDialogOpen} handleClose={closeDialog} handleReject={handleReject}
         handleSubmit={handleSubmit} initialData={member} viewStats={true} page={"kyc"}/>
-        <h1 className="text-xl font-medium leading-none text-gray-900 mb-7">Manage Member KYC</h1>
+        <h1 className="text-xl font-medium leading-none text-gray-900 p-5">Manage Member KYC</h1>
         <DataTable data={members} columns={columns} onUpdate={handleUpdate} onDelete={null}/>
       </div>
     </div>
diff --git a/src/pages/members/manage-members/ManageMembers.tsx b/src/pages/members/manage-members/ManageMembers.tsx
index 2258819..7370a19 100644
--- a/src/pages/members/manage-members/ManageMembers.tsx
+++ b/src/pages/members/manage-members/ManageMembers.tsx
@@ -113,7 +113,7 @@ const ManageMembers = () => {
 
   return (
     <div>
-      <div className="container mx-auto p-5">
+      <div className="container mx-auto">
       <ConfirmDialog
         open={dialogOpen}
         onClose={() => setDialogOpen(false)}
@@ -123,7 +123,7 @@ const ManageMembers = () => {
         onNo={() => setDialogOpen(false)}
       />
         <CustomerDialog open={isDialogOpen} handleClose={closeDialog} handleSubmit={handleSubmit} initialData={member}/>
-        <h1 className="text-xl font-medium leading-none text-gray-900">Manage Members</h1>
+        <h1 className="text-xl font-medium leading-none text-gray-900 p-5">Manage Members</h1>
         <DataTable data={members} createData={createMember} columns={columns} onUpdate={handleUpdate} onDelete={null}/>
       </div>
     </div>

From 5e8109cceab3bb62b76ed06bb79d24186b969da4 Mon Sep 17 00:00:00 2001
From: Raja Oktafrianto <rajaoktafrianto3.com>
Date: Wed, 19 Mar 2025 13:04:16 +0700
Subject: [PATCH 18/19] enter login & navigate all menu

---
 src/auth/pages/jwt/Login.tsx                  |   8 ++
 .../account/manage-account/ManageAccount.tsx  |  18 +++-
 .../manage-currency/ManageCurrency.tsx        |   4 +-
 src/pages/groups/ManageGroups.tsx             |  21 +++-
 src/pages/master/municipios/Municipios.tsx    |   2 +-
 .../master/postoadms/PostoAdmsMaster.tsx      |   2 +-
 src/pages/master/products/ProductsMaster.tsx  |   2 +-
 .../master/profession/ProfessionMaster.tsx    |   2 +-
 src/pages/master/provider/ProviderMaster.tsx  |   2 +-
 src/pages/members/kyc/Kyc.tsx                 |  96 ++++++++++-------
 .../members/manage-members/ManageMembers.tsx  | 102 +++++++++++-------
 src/pages/notification/ManageNotification.tsx |  17 +++
 .../hooks/ManageNotificationContext.tsx       |   3 -
 .../user/log-activity/LogActivityPage.tsx     |  19 ++++
 .../manage-position/ManagePositionPage.tsx    |  19 ++++
 .../user/manage-user/ManageUserPage.tsx       |  19 ++++
 src/pages/transfer/TransferType.tsx           |  15 +++
 .../hooks/ManageTransferTypeContext.tsx       |   3 -
 18 files changed, 261 insertions(+), 93 deletions(-)

diff --git a/src/auth/pages/jwt/Login.tsx b/src/auth/pages/jwt/Login.tsx
index a7824cc..bea522e 100644
--- a/src/auth/pages/jwt/Login.tsx
+++ b/src/auth/pages/jwt/Login.tsx
@@ -69,6 +69,12 @@ const Login = () => {
     setShowPassword(!showPassword);
   };
 
+  const handleKeyPress = (e: { key: string }) => {
+    if (e.key === 'Enter') {
+      formik.handleSubmit();
+    }
+  };
+
   return (
     <div className="card max-w-[390px] w-full">
       <form
@@ -90,6 +96,7 @@ const Login = () => {
               className={clsx('form-control', {
                 'is-invalid': formik.touched.username && formik.errors.username
               })}
+              onKeyPress={handleKeyPress}
             />
           </label>
           {formik.touched.username && formik.errors.username && (
@@ -112,6 +119,7 @@ const Login = () => {
               className={clsx('form-control', {
                 'is-invalid': formik.touched.password && formik.errors.password
               })}
+              onKeyPress={handleKeyPress}
             />
             <button className="btn btn-icon" onClick={togglePassword}>
               <KeenIcon icon="eye" className={clsx('text-gray-500', { hidden: showPassword })} />
diff --git a/src/pages/account/manage-account/ManageAccount.tsx b/src/pages/account/manage-account/ManageAccount.tsx
index 20dcf35..f6398dc 100644
--- a/src/pages/account/manage-account/ManageAccount.tsx
+++ b/src/pages/account/manage-account/ManageAccount.tsx
@@ -5,6 +5,7 @@ import { useEffect, useState } from 'react';
 import { getData } from '@/utils';
 import { useCallApi } from '@/hooks';
 import { DataTable } from '@/components/ui/DataTable';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const API_URL = apiConfig.service_dashboard;
 
@@ -74,8 +75,21 @@ const ManageAccount = () => {
 
   return (
     <div>
-      <div className="container mx-auto">
-        <h1 className="text-xl font-medium leading-none text-gray-900 p-5">Manage Account</h1>
+      <div className="container mx-auto p-5">
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Account</h1>
+        <Breadcrumbs>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Accounts</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Account</span>
+          </Link>
+        </Breadcrumbs>
         <DataTable
           columns={columns}
           data={dataAccount}
diff --git a/src/pages/account/manage-currency/ManageCurrency.tsx b/src/pages/account/manage-currency/ManageCurrency.tsx
index 30cbf70..77b5b0d 100644
--- a/src/pages/account/manage-currency/ManageCurrency.tsx
+++ b/src/pages/account/manage-currency/ManageCurrency.tsx
@@ -1,12 +1,12 @@
 import { Container, DataGridInner } from '@/components';
 import { ManageCurrencyContextProvider } from './hooks/ManageCurrencyContext';
 import AddDialog from './blocks/AddDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const ManageCurrency = () => {
   return (
     <ManageCurrencyContextProvider>
-      <div className="container mx-auto">
-        <h1 className="text-xl font-medium leading-none text-gray-900 p-5">Manage Currency</h1>
+      <Container>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
diff --git a/src/pages/groups/ManageGroups.tsx b/src/pages/groups/ManageGroups.tsx
index ef73fd8..3b5a832 100644
--- a/src/pages/groups/ManageGroups.tsx
+++ b/src/pages/groups/ManageGroups.tsx
@@ -13,7 +13,9 @@ import {
   DialogTitle,
   Typography,
   Button,
-  Box
+  Box,
+  Breadcrumbs,
+  Link
 } from '@mui/material';
 import { useState, useEffect } from 'react';
 // import IconButton from '@mui/material/IconButton';
@@ -146,7 +148,7 @@ const ManageGroups = () => {
 
   return (
     <div>
-      <div className="container mx-auto">
+      <div className="container mx-auto pt-2">
         <ConfirmDialog
           open={dialogOpen}
           onClose={() => setDialogOpen(false)}
@@ -158,7 +160,20 @@ const ManageGroups = () => {
           onYes={handleYes}
           onNo={() => setDialogOpen(false)}
         />
-        <h1 className="text-xl font-medium leading-none text-gray-900 p-5">Manage Groups</h1>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Groups</h1>
+        <Breadcrumbs>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Groups</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Groups</span>
+          </Link>
+        </Breadcrumbs>
         <DataTable
           data={dataGroup}
           columns={columns}
diff --git a/src/pages/master/municipios/Municipios.tsx b/src/pages/master/municipios/Municipios.tsx
index fd0f24c..388b269 100644
--- a/src/pages/master/municipios/Municipios.tsx
+++ b/src/pages/master/municipios/Municipios.tsx
@@ -10,7 +10,7 @@ const Municipios = () => {
   return (
     <ManageMunicipiosProvider>
       <Container className="mb-7">
-        <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">MUNICIPIOS</h1>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">MUNICIPIOS</h1>
         <Breadcrumbs sx={{ mb: 2 }}>
           <Link underline="none" color="inherit" href="/">
             <span className="text-sm hover:underline">Dashboard</span>
diff --git a/src/pages/master/postoadms/PostoAdmsMaster.tsx b/src/pages/master/postoadms/PostoAdmsMaster.tsx
index 886c856..163b97f 100644
--- a/src/pages/master/postoadms/PostoAdmsMaster.tsx
+++ b/src/pages/master/postoadms/PostoAdmsMaster.tsx
@@ -10,7 +10,7 @@ const PostoAdmsMaster = () => {
   return (
     <ManagePostoAdmsContextProvider>
       <Container>
-        <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">
           Postu Administrativo
         </h1>
         <Breadcrumbs sx={{ mb: 2 }}>
diff --git a/src/pages/master/products/ProductsMaster.tsx b/src/pages/master/products/ProductsMaster.tsx
index a75f02c..b0b9792 100644
--- a/src/pages/master/products/ProductsMaster.tsx
+++ b/src/pages/master/products/ProductsMaster.tsx
@@ -9,7 +9,7 @@ const ProductsMaster = () => {
   return (
     <ManageProductsContextProvider>
       <Container>
-        <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">Manage Products</h1>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Products</h1>
         <Breadcrumbs sx={{ mb: 2 }}>
           <Link underline="none" color="inherit" href="/">
             <span className="text-sm hover:underline">Dashboard</span>
diff --git a/src/pages/master/profession/ProfessionMaster.tsx b/src/pages/master/profession/ProfessionMaster.tsx
index 2507d2d..07583f5 100644
--- a/src/pages/master/profession/ProfessionMaster.tsx
+++ b/src/pages/master/profession/ProfessionMaster.tsx
@@ -9,7 +9,7 @@ const ProfessionMaster = () => {
   return (
     <ManageProfessionContextProvider>
       <Container>
-        <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">Manage Profession</h1>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Profession</h1>
         <Breadcrumbs sx={{ mb: 2 }}>
           <Link underline="none" color="inherit" href="/">
             <span className="text-sm hover:underline">Dashboard</span>
diff --git a/src/pages/master/provider/ProviderMaster.tsx b/src/pages/master/provider/ProviderMaster.tsx
index 03ed47c..dce73d1 100644
--- a/src/pages/master/provider/ProviderMaster.tsx
+++ b/src/pages/master/provider/ProviderMaster.tsx
@@ -9,7 +9,7 @@ const ProviderMaster = () => {
   return (
     <ManageProviderContextProvider>
       <Container>
-        <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">Manage Provider</h1>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Provider</h1>
         <Breadcrumbs sx={{ mb: 2 }}>
           <Link underline="none" color="inherit" href="/">
             <span className="text-sm hover:underline">Dashboard</span>
diff --git a/src/pages/members/kyc/Kyc.tsx b/src/pages/members/kyc/Kyc.tsx
index a458350..e2cf0a7 100644
--- a/src/pages/members/kyc/Kyc.tsx
+++ b/src/pages/members/kyc/Kyc.tsx
@@ -11,6 +11,7 @@ import axios from 'axios';
 import { toast } from 'sonner';
 const BASE_URL = apiConfig.service_customer;
 import CustomerDialog from '../manage-members/CustomerDetailModal';
+import { Breadcrumbs, Link } from '@mui/material';
 
 export interface IDataGridContextProps<TData extends object> {
   props: TDataGridProps<TData>;
@@ -42,7 +43,7 @@ const Kyc = () => {
   const { getUser } = useAuthContext();
 
   useEffect(() => {
-    fetchGroups()
+    fetchGroups();
   }, []);
 
   async function fetchGroups() {
@@ -54,37 +55,37 @@ const Kyc = () => {
           with_deleted: false,
           order_field: 'fullname',
           order_direction: 'ASC',
-          type: "kyc"
+          type: 'kyc'
         }
       });
-      let temp = 1
+      let temp = 1;
       let resMembers = groups.data.data.list.map((el: any) => {
-        el.no = temp++
-        el.name = el.fullname
-        return el
-      })
-      setMembers(resMembers)
+        el.no = temp++;
+        el.name = el.fullname;
+        return el;
+      });
+      setMembers(resMembers);
     } catch (error: any) {
-      alert(error.message)
+      alert(error.message);
       console.log(error);
     }
   }
-  
+
   const handleUpdate = (data: any) => {
-    setMember(data)
-    setIsDialogOpen(true)
-  }
+    setMember(data);
+    setIsDialogOpen(true);
+  };
 
   async function handleSubmit(data: any) {
-    setDialogType('update')
-    setMember(data)
-    setDialogOpen(true)
+    setDialogType('update');
+    setMember(data);
+    setDialogOpen(true);
   }
 
   function handleReject(data: any) {
-    setDialogType('reject')
-    setMember(data)
-    setDialogOpen(true)
+    setDialogType('reject');
+    setMember(data);
+    setDialogOpen(true);
   }
 
   const handleYes = async () => {
@@ -92,7 +93,7 @@ const Kyc = () => {
     const updateData: any = member;
     const customerId = member.id;
     const description = member.description;
-    updateData.updated_by = userLogin.data ? userLogin.data.id : ''
+    updateData.updated_by = userLogin.data ? userLogin.data.id : '';
     let today = new Date();
     updateData.updated_at = today.toString();
     delete updateData.id;
@@ -117,26 +118,27 @@ const Kyc = () => {
     delete updateData.group_deleted_at;
     try {
       if (dialogType === 'reject') {
-        await axios.post(`${BASE_URL}/customer/reject`, {customerid: customerId})
+        await axios.post(`${BASE_URL}/customer/reject`, { customerid: customerId });
       }
       if (dialogType === 'update') {
-        await axios.put(`${BASE_URL}/customer/update/${customerId}`, updateData)
-        if (updateData.isneedapproval == 1) await axios.post(`${BASE_URL}/customer/approve`, {
-          customerid: customerId,
-          description: description
-        })
+        await axios.put(`${BASE_URL}/customer/update/${customerId}`, updateData);
+        if (updateData.isneedapproval == 1)
+          await axios.post(`${BASE_URL}/customer/approve`, {
+            customerid: customerId,
+            description: description
+          });
       }
       await fetchGroups();
-      setDialogOpen(false)
-      setIsDialogOpen(false)
+      setDialogOpen(false);
+      setIsDialogOpen(false);
       toast.success('Success Update Kyc Member');
     } catch (error: any) {
-      alert(error.message)
-      setDialogOpen(false)
-      setIsDialogOpen(false)
-      toast.error(error.message)
+      alert(error.message);
+      setDialogOpen(false);
+      setIsDialogOpen(false);
+      toast.error(error.message);
     }
-  }
+  };
 
   return (
     <div>
@@ -149,10 +151,30 @@ const Kyc = () => {
           onYes={handleYes}
           onNo={() => setDialogOpen(false)}
         />
-        <CustomerDialog open={isDialogOpen} handleClose={closeDialog} handleReject={handleReject}
-        handleSubmit={handleSubmit} initialData={member} viewStats={true} page={"kyc"}/>
-        <h1 className="text-xl font-medium leading-none text-gray-900 p-5">Manage Member KYC</h1>
-        <DataTable data={members} columns={columns} onUpdate={handleUpdate} onDelete={null}/>
+        <CustomerDialog
+          open={isDialogOpen}
+          handleClose={closeDialog}
+          handleReject={handleReject}
+          handleSubmit={handleSubmit}
+          initialData={member}
+          viewStats={true}
+          page={'kyc'}
+        />
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Member KYC</h1>
+        <Breadcrumbs>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Members</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Member KYC</span>
+          </Link>
+        </Breadcrumbs>
+        <DataTable data={members} columns={columns} onUpdate={handleUpdate} onDelete={null} />
       </div>
     </div>
   );
diff --git a/src/pages/members/manage-members/ManageMembers.tsx b/src/pages/members/manage-members/ManageMembers.tsx
index 7370a19..e3ede28 100644
--- a/src/pages/members/manage-members/ManageMembers.tsx
+++ b/src/pages/members/manage-members/ManageMembers.tsx
@@ -8,6 +8,7 @@ import ConfirmDialog from '@/components/confirm';
 import { useAuthContext } from '@/auth';
 import { ScreenLoader } from '@/components';
 import { toast } from 'sonner';
+import { Breadcrumbs, Link } from '@mui/material';
 const BASE_URL = apiConfig.service_customer;
 
 const ManageMembers = () => {
@@ -21,9 +22,9 @@ const ManageMembers = () => {
   const { getUser } = useAuthContext();
 
   useEffect(() => {
-    setLoading(true)
-    fetchGroups()
-    setLoading(false)
+    setLoading(true);
+    fetchGroups();
+    setLoading(false);
   }, []);
 
   async function fetchGroups() {
@@ -34,27 +35,27 @@ const ManageMembers = () => {
           page: 1,
           with_deleted: false,
           order_field: 'fullname',
-          order_direction: 'ASC',
+          order_direction: 'ASC'
         }
       });
-      let temp = 1
+      let temp = 1;
       let resMembers = groups.data.data.list.map((el: any) => {
-        el.no = temp++
-        el.name = el.fullname
-        return el
-      })
-      setMembers(resMembers)
+        el.no = temp++;
+        el.name = el.fullname;
+        return el;
+      });
+      setMembers(resMembers);
     } catch (error: any) {
-      alert(error.message)
+      alert(error.message);
       console.log(error);
     }
   }
 
   const handleUpdate = (data: any) => {
     setDialogType('update');
-    setMember(data)
-    setIsDialogOpen(true)
-  }
+    setMember(data);
+    setIsDialogOpen(true);
+  };
 
   function createMember() {
     setDialogType('create');
@@ -63,15 +64,15 @@ const ManageMembers = () => {
   }
 
   async function handleSubmit(data: any) {
-    setMember(data)
-    setDialogOpen(true)
+    setMember(data);
+    setDialogOpen(true);
   }
 
   const handleYes = async () => {
     const userLogin: any = await getUser();
     const updateData: any = member;
     const customerId = member.id;
-    updateData.updated_by = userLogin.data ? userLogin.data.id : ''
+    updateData.updated_by = userLogin.data ? userLogin.data.id : '';
     let today = new Date();
     updateData.updated_at = today.toString();
     delete updateData.id;
@@ -95,36 +96,61 @@ const ManageMembers = () => {
     delete updateData.group_deleted_by;
     delete updateData.group_deleted_at;
     try {
-      if (dialogType === 'update') await axios.put(`${BASE_URL}/customer/update/${customerId}`, updateData)
+      if (dialogType === 'update')
+        await axios.put(`${BASE_URL}/customer/update/${customerId}`, updateData);
       // if (dialogType === 'create') await axios.post(`${BASE_URL}/customers/create`, member)
       await fetchGroups();
-      setDialogOpen(false)
-      setIsDialogOpen(false)
+      setDialogOpen(false);
+      setIsDialogOpen(false);
       toast.success('Success Update Member');
     } catch (error: any) {
-      alert(error.message)
-      setDialogOpen(false)
-      setIsDialogOpen(false)
-      toast.error(error.message)
+      alert(error.message);
+      setDialogOpen(false);
+      setIsDialogOpen(false);
+      toast.error(error.message);
     }
-  }
+  };
 
-  if (loading) return (<ScreenLoader/>)
+  if (loading) return <ScreenLoader />;
 
   return (
     <div>
-      <div className="container mx-auto">
-      <ConfirmDialog
-        open={dialogOpen}
-        onClose={() => setDialogOpen(false)}
-        title="Confirm Action"
-        content={`Are you sure you want to ${dialogType}?`}
-        onYes={handleYes}
-        onNo={() => setDialogOpen(false)}
-      />
-        <CustomerDialog open={isDialogOpen} handleClose={closeDialog} handleSubmit={handleSubmit} initialData={member}/>
-        <h1 className="text-xl font-medium leading-none text-gray-900 p-5">Manage Members</h1>
-        <DataTable data={members} createData={createMember} columns={columns} onUpdate={handleUpdate} onDelete={null}/>
+      <div className="container mx-auto p-5">
+        <ConfirmDialog
+          open={dialogOpen}
+          onClose={() => setDialogOpen(false)}
+          title="Confirm Action"
+          content={`Are you sure you want to ${dialogType}?`}
+          onYes={handleYes}
+          onNo={() => setDialogOpen(false)}
+        />
+        <CustomerDialog
+          open={isDialogOpen}
+          handleClose={closeDialog}
+          handleSubmit={handleSubmit}
+          initialData={member}
+        />
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Members</h1>
+        <Breadcrumbs>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Members</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Members</span>
+          </Link>
+        </Breadcrumbs>
+        <DataTable
+          data={members}
+          createData={createMember}
+          columns={columns}
+          onUpdate={handleUpdate}
+          onDelete={null}
+        />
       </div>
     </div>
   );
diff --git a/src/pages/notification/ManageNotification.tsx b/src/pages/notification/ManageNotification.tsx
index 3f26388..088627b 100644
--- a/src/pages/notification/ManageNotification.tsx
+++ b/src/pages/notification/ManageNotification.tsx
@@ -1,11 +1,28 @@
 import { Container, DataGridInner } from '@/components';
 import { ManageNotifContextProvider } from './hooks/ManageNotificationContext';
 import AddDialog from './blocks/AddDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const ManageNotification = () => {
   return (
     <ManageNotifContextProvider>
       <Container>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">
+          Manage Notifications
+        </h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Notification</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Notification</span>
+          </Link>
+        </Breadcrumbs>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
diff --git a/src/pages/notification/hooks/ManageNotificationContext.tsx b/src/pages/notification/hooks/ManageNotificationContext.tsx
index 238922f..f0ece52 100644
--- a/src/pages/notification/hooks/ManageNotificationContext.tsx
+++ b/src/pages/notification/hooks/ManageNotificationContext.tsx
@@ -108,9 +108,6 @@ const ManageNotifContextProvider = ({ children }: { children: React.ReactNode })
 
   return (
     <div>
-      <div className="container mx-auto py-5">
-        <h1>Manage Notifications</h1>
-      </div>
       <ManageNotifContext.Provider
         value={{
           handleAddDialog,
diff --git a/src/pages/settings/user/log-activity/LogActivityPage.tsx b/src/pages/settings/user/log-activity/LogActivityPage.tsx
index 98d6831..c9a9525 100644
--- a/src/pages/settings/user/log-activity/LogActivityPage.tsx
+++ b/src/pages/settings/user/log-activity/LogActivityPage.tsx
@@ -1,10 +1,29 @@
 import { Container, DataGridInner } from '@/components';
 import { LogActivityContextProvider } from './hooks';
+import { Breadcrumbs, Link } from '@mui/material';
 
 export default function LogActivityPage() {
   return (
     <LogActivityContextProvider>
       <Container>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Log Activity</h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Settings</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">User Management</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Log Activity</span>
+          </Link>
+        </Breadcrumbs>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
diff --git a/src/pages/settings/user/manage-position/ManagePositionPage.tsx b/src/pages/settings/user/manage-position/ManagePositionPage.tsx
index d151f44..6ddcd6d 100644
--- a/src/pages/settings/user/manage-position/ManagePositionPage.tsx
+++ b/src/pages/settings/user/manage-position/ManagePositionPage.tsx
@@ -3,11 +3,30 @@ import { EditDialog } from './blocks';
 import { ManagePositionContextProvider } from './hooks';
 import { AddDialog } from './blocks/AddDialog';
 import { DeleteDialog } from './blocks/DeleteDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 export default function ManagePositionPage() {
   return (
     <ManagePositionContextProvider>
       <Container>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Positions</h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Settings</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">User Management</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Position</span>
+          </Link>
+        </Breadcrumbs>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
diff --git a/src/pages/settings/user/manage-user/ManageUserPage.tsx b/src/pages/settings/user/manage-user/ManageUserPage.tsx
index 1d9703e..5f318b0 100644
--- a/src/pages/settings/user/manage-user/ManageUserPage.tsx
+++ b/src/pages/settings/user/manage-user/ManageUserPage.tsx
@@ -3,11 +3,30 @@ import { EditDialog } from './blocks';
 import { ManageUserContextProvider } from './hooks';
 import { AddDialog } from './blocks/AddDialog';
 import { DeleteDialog } from './blocks/DeleteDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 export default function ManageUserPage() {
   return (
     <ManageUserContextProvider>
       <Container>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage User</h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Settings</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">User Management</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage User</span>
+          </Link>
+        </Breadcrumbs>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
diff --git a/src/pages/transfer/TransferType.tsx b/src/pages/transfer/TransferType.tsx
index 2e5d03e..031c462 100644
--- a/src/pages/transfer/TransferType.tsx
+++ b/src/pages/transfer/TransferType.tsx
@@ -4,11 +4,26 @@ import {
   ManageTransferTypeContextProvider
 } from './hooks/ManageTransferTypeContext';
 import AddDialog from './blocks/AddDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const TransferType = () => {
   return (
     <ManageTransferTypeContextProvider>
       <Container>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Access Type</h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Transfer Type</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Access Type</span>
+          </Link>
+        </Breadcrumbs>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
diff --git a/src/pages/transfer/hooks/ManageTransferTypeContext.tsx b/src/pages/transfer/hooks/ManageTransferTypeContext.tsx
index 5a3d5d3..f41c7fd 100644
--- a/src/pages/transfer/hooks/ManageTransferTypeContext.tsx
+++ b/src/pages/transfer/hooks/ManageTransferTypeContext.tsx
@@ -145,9 +145,6 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React
 
   return (
     <div>
-      <div className="container mx-auto py-5">
-        <h1>Manage Access Type</h1>
-      </div>
       <ManageTransferTypeContext.Provider
         value={{
           showEditDialog,

From 7df819f746ddbd4420293f7e6d50f5d6755a58e4 Mon Sep 17 00:00:00 2001
From: Raja Oktafrianto <rajaoktafrianto3.com>
Date: Wed, 19 Mar 2025 14:17:21 +0700
Subject: [PATCH 19/19] update

---
 .../account/manage-currency/ManageCurrency.tsx   | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/pages/account/manage-currency/ManageCurrency.tsx b/src/pages/account/manage-currency/ManageCurrency.tsx
index 77b5b0d..eead33a 100644
--- a/src/pages/account/manage-currency/ManageCurrency.tsx
+++ b/src/pages/account/manage-currency/ManageCurrency.tsx
@@ -7,11 +7,25 @@ const ManageCurrency = () => {
   return (
     <ManageCurrencyContextProvider>
       <Container>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Currency</h1>
+        <Breadcrumbs>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Accounts</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Currency</span>
+          </Link>
+        </Breadcrumbs>
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>
         <AddDialog />
-      </div>
+      </Container>
     </ManageCurrencyContextProvider>
   );
 };