From f11ace54c40be5270b39b3fca029e0b71a44124e Mon Sep 17 00:00:00 2001 From: wayanrivan Date: Tue, 25 Mar 2025 13:23:47 +0700 Subject: [PATCH] cleaning code --- src/pages/transaction/blocks/AddDialog.tsx | 172 ----------------- src/pages/transaction/blocks/DeleteDialog.tsx | 87 --------- src/pages/transaction/blocks/EditDialog.tsx | 173 ----------------- src/pages/transaction/blocks/ListToolbar.tsx | 8 - src/pages/transaction/blocks/SearchDialog.tsx | 178 ------------------ .../transaction/hooks/TransactionContext.tsx | 81 +++----- src/pages/transaction/transaction.tsx | 50 +++-- 7 files changed, 45 insertions(+), 704 deletions(-) delete mode 100644 src/pages/transaction/blocks/AddDialog.tsx delete mode 100644 src/pages/transaction/blocks/DeleteDialog.tsx delete mode 100644 src/pages/transaction/blocks/EditDialog.tsx delete mode 100644 src/pages/transaction/blocks/SearchDialog.tsx diff --git a/src/pages/transaction/blocks/AddDialog.tsx b/src/pages/transaction/blocks/AddDialog.tsx deleted file mode 100644 index 22cee5a..0000000 --- a/src/pages/transaction/blocks/AddDialog.tsx +++ /dev/null @@ -1,172 +0,0 @@ -import React, { useCallback, useEffect, useRef, useState } from 'react'; -import { useTransactionContext } from '../hooks/useTransactionContext'; -import { - Dialog, - DialogBody, - DialogContent, - DialogDescription, - DialogHeader, - DialogTitle -} from '@/components/ui/dialog'; -import { Alert, KeenIcon, useDataGrid } from '@/components'; -import { Input } from '@/components/ui/input'; -import { Button } from '@/components/ui/button'; -import axios from 'axios'; -import { apiConfig } from '@/config/api.config'; -import { toast } from 'sonner'; -import { getAuth, useAuthContext } from '@/auth'; -import { useCallApi } from '@/hooks'; -import { doSaveLogActivity } from '@/actions/GlobalActions'; - -const API_URL = apiConfig.service_master_data; - -const AddDialog = () => { - const parentRef = useRef(null); - const { reload } = useDataGrid(); - const { PostData } = useCallApi(); - const parsedUser = getAuth()?.user; - const { showAddDialog, handleAddDialog, selectedMunicipios } = useTransactionContext(); - const [alert, setAlert] = useState({ - show: false, - message: '' - }); - const initialState = { - name: '', - created_by: '', - created_at: '' - }; - - const [formField, setFormField] = useState(initialState); - const created_time = new Date(); - const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' '); - - const resetForm = () => { - setFormField(initialState); - setAlert({ show: false, message: '' }); - }; - - const doCreateMunicipio = useCallback( - async (e: React.FormEvent) => { - e.preventDefault(); - const response = await PostData(`${API_URL}/municipios/create`, formField); - - if (response?.status) { - handleAddDialog(false); - resetForm(); - reload(); - toast.success('Municipio created successfully!'); - // const createActivity = { - // module: 'Manage Municipio', - // description: `Create Municipio => ${selectedMunicipios}`, - // action: 'C' - // }; - - // doSaveLogActivity(createActivity); - } else { - toast.error('Failed to create municipio.'); - setAlert({ show: true, message: 'Failed to create municipio. Please try again.' }); - } - }, - [formField] - ); - - const handleSubmit = (e: React.FormEvent) => { - e.preventDefault(); - - if (formField.name.trim() === '') { - setAlert({ show: true, message: 'Please fill name field.' }); - return; - } - - doCreateMunicipio(e); - console.log(parsedUser.email); - console.log(formField); - setAlert({ show: false, message: '' }); - }; - - const handleReset = () => { - resetForm(); - setAlert({ show: false, message: '' }); - }; - - useEffect(() => { - if (showAddDialog) { - setFormField({ - name: formField.name, - created_by: parsedUser?.username, - created_at: formattedTime - }); - } - }, [formattedTime]); - - useEffect(() => { - if (showAddDialog === false) { - resetForm(); - } - }, [showAddDialog]); - - return ( - handleAddDialog(open)}> - - - - -
-
-

Add Municipios

-
-
-
{ - handleAddDialog(false); - resetForm(); - }} - > - -
-
- - -
- {alert.show && ( - - {alert.message} - - )} -
-
-
- - - - setFormField((prev) => ({ ...prev, name: target.value })) - } - /> -
- -
- - -
-
-
-
- - - - ); -}; - -export default AddDialog; diff --git a/src/pages/transaction/blocks/DeleteDialog.tsx b/src/pages/transaction/blocks/DeleteDialog.tsx deleted file mode 100644 index 2e8f25d..0000000 --- a/src/pages/transaction/blocks/DeleteDialog.tsx +++ /dev/null @@ -1,87 +0,0 @@ -import { Alert, useDataGrid } from '@/components'; -import { useTransactionContext } from '../hooks/useTransactionContext'; -import { ChangeEvent, useCallback, useState } from 'react'; -import axios from 'axios'; -import { apiConfig } from '@/config/api.config'; -import { useCallApi } from '@/hooks'; -import { toast } from 'sonner'; -import { Dialog, DialogContent, DialogFooter, DialogHeader } from '@/components/ui/dialog'; -import { EnforceSwitch } from '@/components/switch'; -import { Button } from '@/components/ui/button'; -import { doSaveLogActivity } from '@/actions/GlobalActions'; - -const API_URL = apiConfig.service_master_data; - -const DeleteDialog = () => { - const { showDeleteDialog, handleDeleteDialog, selectedMunicipios, municipios } = - useTransactionContext(); - const { reload } = useDataGrid(); - const { DeleteData } = useCallApi(); - const [enforce, setEnforce] = useState(false); - const [alert, setAlert] = useState({ - show: false, - message: '' - }); - - const doDeleteMunicipio = useCallback(async () => { - const response = await DeleteData( - `${API_URL}/municipios/delete/${selectedMunicipios}/${enforce}`, - { - id: selectedMunicipios - } - ); - - if (response?.status) { - setAlert((prev) => ({ ...prev, show: false, message: '' })); - handleDeleteDialog(false, null); - toast.success('Success Delete Municipio'); - reload(); - // const createActivity = { - // module: 'Manage Municipio', - // description: `Delete Municipio => ${selectedMunicipios}`, - // action: 'D' - // }; - - // doSaveLogActivity(createActivity); - } else { - setAlert((prev) => ({ ...prev, show: true, message: response?.message })); - } - }, [selectedMunicipios, enforce]); - - return ( - handleDeleteDialog(open, null)}> - - - -

Are you sure?

- you will delete this data! -
- - ) => { - setEnforce(e.target.checked); - }} - /> -
- - {alert.show && ( - -

{alert.message}

- - )} - - - - - - - - ); -}; - -export default DeleteDialog; diff --git a/src/pages/transaction/blocks/EditDialog.tsx b/src/pages/transaction/blocks/EditDialog.tsx deleted file mode 100644 index 0ab2a46..0000000 --- a/src/pages/transaction/blocks/EditDialog.tsx +++ /dev/null @@ -1,173 +0,0 @@ -import React, { useCallback, useEffect, useRef, useState } from 'react'; -import { useTransactionContext } from '../hooks/useTransactionContext'; -import { Alert, useDataGrid } from '@/components'; -import axios from 'axios'; -import { apiConfig } from '@/config/api.config'; -import { toast } from 'sonner'; -import { - Dialog, - DialogBody, - DialogContent, - DialogDescription, - DialogHeader, - DialogTitle -} from '@/components/ui/dialog'; -import { Input } from '@/components/ui/input'; -import { Button } from '@/components/ui/button'; -import { getAuth, useAuthContext } from '@/auth'; -import { useCallApi } from '@/hooks'; -import { doSaveLogActivity } from '@/actions/GlobalActions'; - -const API_URL = apiConfig.service_master_data; - -const EditDialog = () => { - const parentRef = useRef(null); - const { showEditDialog, handleEditDialog, selectedMunicipios, municipios } = - useTransactionContext(); - const { reload } = useDataGrid(); - const { PutData, GetData } = useCallApi(); - const parsedUser = getAuth()?.user; - const [alert, setAlert] = useState({ - show: false, - message: '' - }); - - const initialState = { - name: '', - updated_by: '', - updated_at: '' - }; - - const [formField, setFormField] = useState(initialState); - const created_time = new Date(); - const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' '); - - const resetForm = () => { - setFormField(initialState); - setAlert({ show: false, message: '' }); - }; - - const doUpdateMunicipios = useCallback( - async (e: React.FormEvent) => { - e.preventDefault(); - const response = await PutData( - `${API_URL}/municipios/update/${selectedMunicipios}`, - formField - ); - - if (response?.status) { - handleEditDialog(false, null); - resetForm(); - toast.success('Success update municipio'); - reload(); - // const createActivity = { - // module: 'Manage Municipio', - // description: `Edit Municipio => ${selectedMunicipios}`, - // action: 'U' - // }; - - // doSaveLogActivity(createActivity); - } else { - toast.error('Failed update user'); - setAlert({ show: true, message: 'Failed to update municipio. Please try again.' }); - } - }, - [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) => { - e.preventDefault(); - - if (formField.name.trim() === '') { - setAlert({ show: true, message: 'Please fill name field.' }); - return; - } - - doUpdateMunicipios(e); - console.log(formField); - setAlert({ show: false, message: '' }); - }; - - useEffect(() => { - if (selectedMunicipios) { - doFetchData(selectedMunicipios); - } - }, [selectedMunicipios]); - - useEffect(() => { - if (showEditDialog === false) { - resetForm(); - } - }, [showEditDialog]); - - useEffect(() => { - if (selectedMunicipios) { - setFormField({ - name: formField.name, - updated_by: parsedUser.email, - updated_at: formattedTime - }); - } - }, [formattedTime]); - - // console.log(selectedMunicipios); - return ( - handleEditDialog(open, null)}> - - - Municipios - Update - - - -
- {alert.show && ( - -

{alert.message}

- - )} - -
-
-
-
- - setFormField({ ...formField, name: e.target.value })} - /> -
-
- -
- -
-
-
-
- - - - ); -}; - -export default EditDialog; diff --git a/src/pages/transaction/blocks/ListToolbar.tsx b/src/pages/transaction/blocks/ListToolbar.tsx index cb71f6d..afc8ac5 100644 --- a/src/pages/transaction/blocks/ListToolbar.tsx +++ b/src/pages/transaction/blocks/ListToolbar.tsx @@ -6,7 +6,6 @@ import { toast } from 'sonner'; const ListToolbar = () => { const { table, reload } = useDataGrid(); - const { handleAddDialog, handleSearchDialog } = useTransactionContext(); // Set the initial state for trxDate const [trxDate, settrxDate] = useState({ from: '', to: '' }); @@ -74,13 +73,6 @@ const ListToolbar = () => { /> -
- - - -
diff --git a/src/pages/transaction/blocks/SearchDialog.tsx b/src/pages/transaction/blocks/SearchDialog.tsx deleted file mode 100644 index a5d84f7..0000000 --- a/src/pages/transaction/blocks/SearchDialog.tsx +++ /dev/null @@ -1,178 +0,0 @@ -import { 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 { useTransactionContext } from '../hooks/useTransactionContext'; -import { apiConfig } from '@/config/api.config'; -import axios from 'axios'; -import { - Select, - SelectContent, - SelectItem, - SelectTrigger, - SelectValue -} from '@/components/ui/select'; - -interface trxDate { - from: string; - to: string; -} - -const API_URL = apiConfig.service_master_data; - -const SearchDialog = () => { - const parentRef = useRef(null); - const { showSearchDialog, handleSearchDialog, municipios } = useTransactionContext(); - const [alert, setAlert] = useState({ - show: false, - message: '' - }); - const initialState = { - from: '', - to: '' - }; - - const [formField, setFormField] = useState(initialState); - const resetForm = () => { - setFormField(initialState); - }; - const [trxDate, settrxDate] = useState([]); - const [isFound, setIsFound] = useState(false); - - const handleSubmit = async (e: React.FormEvent) => { - e.preventDefault(); - const from = String(formField.from); - const to = String(formField.to); - - // if (formField.id === 0) { - // setAlert({ show: true, message: 'Please fill name field.' }); - // return; - // } - - try { - // const response = await axios.get(`${API_URL}/municipios/postoadms/${id}`); - - // if (response.data.status) { - // setPostoadms(response.data.data); - // setIsFound(true); - // // console.log('Found postoadms: ', response.data.data); - // } else { - // setPostoadms([]); - // setIsFound(false); - // setAlert({ show: true, message: 'No postoadms found.' }); - // } - } catch (error) { - console.error('Error fetching postoadms', error); - setAlert({ show: true, message: 'Failed to fetch postoadms. Please try again.' }); - } - setAlert({ show: false, message: '' }); - }; - - const handleReset = () => { - setFormField(initialState); - setIsFound(false); - settrxDate([]); - }; - // console.log(municipios); - return ( - handleSearchDialog(open)}> - - - - -
-
-

- Search Postoadms -

-
-
-
{ - handleSearchDialog(false); - resetForm(); - }} - > - -
-
- - -
- {alert.show && ( - - {alert.message} - - )} -
-
-
- - - {/* */} -
- - {/* {isFound && postoadms.length > 0 && ( -
-

Postu Administravo:

-
-
- - {postoadms.map((posto) => posto.name).join(', ')} - -
-
- )} */} - -
- - -
-
-
-
- - - - ); -}; - -export default SearchDialog; diff --git a/src/pages/transaction/hooks/TransactionContext.tsx b/src/pages/transaction/hooks/TransactionContext.tsx index 61a70d8..c8b4943 100644 --- a/src/pages/transaction/hooks/TransactionContext.tsx +++ b/src/pages/transaction/hooks/TransactionContext.tsx @@ -15,16 +15,6 @@ interface TransactionProps { } interface ContextProps { - municipios: TransactionProps[]; - showSearchDialog: boolean; - handleSearchDialog: (show: boolean) => void; - showEditDialog: boolean; - handleEditDialog: (show: boolean, selected_user: string | null) => void; - showAddDialog: boolean; - handleAddDialog: (show: boolean) => void; - showDeleteDialog: boolean; - handleDeleteDialog: (show: boolean, selected_user: string | null) => void; - selectedMunicipios: string | null; getTransactionLists: ( limit: number, page: number, @@ -36,16 +26,6 @@ interface ContextProps { } const initialProps: ContextProps = { - municipios: [], - showSearchDialog: false, - handleSearchDialog: (show: boolean) => { }, - showEditDialog: false, - handleEditDialog: (show: boolean, selected_user: string | null) => { }, - showAddDialog: false, - handleAddDialog: (show: boolean) => { }, - showDeleteDialog: false, - handleDeleteDialog: (show: boolean, selected_user: string | null) => { }, - selectedMunicipios: null, getTransactionLists: async () => ({ data: [], totalCount: 0 }) }; @@ -53,33 +33,9 @@ const ManageTransactionContext = createContext(initialProps); const API_URL = apiConfig.transaction; const TransactionProvider = ({ children }: { children: React.ReactNode }) => { - const [showSearchDialog, setShowSearchDialog] = useState(false); - const [showEditDialog, setShowEditDialog] = useState(false); - const [showAddDialog, setShowAddDialog] = useState(false); - const [showDeleteDialog, setShowDeleteDialog] = useState(false); - const [selectedMunicipios, setSelectedMunicipios] = useState(null); - const [municipios, setTransaction] = useState([]); + const [transaction, setTransaction] = useState([]); const { GetData } = useCallApi(); const navigate = useNavigate(); - - const handleSearchDialog = useCallback((show: boolean) => { - setShowSearchDialog(show); - }, []); - - const handleAddDialog = useCallback((show: boolean) => { - setShowAddDialog(show); - }, []); - - const handleEditDialog = useCallback((show: boolean, selected_municipios: string | null) => { - setSelectedMunicipios(show ? selected_municipios : null); - setShowEditDialog(show); - }, []); - - const handleDeleteDialog = useCallback((show: boolean, selected_municipios: string | null) => { - setSelectedMunicipios(show ? selected_municipios : null); - setShowDeleteDialog(show); - }, []); - const handleNavigate = (path: string) => { const url = navigate(`${API_URL}/transaction/history/${path}`); }; @@ -136,6 +92,28 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => { headerClassName: 'w-[250px]', }, }, + { + accessorFn: (row) => { + let status; + if (row.status === 'C') { + status = 'COMPLETE'; + } else if(row.status === 'F') { + status = 'FAILED'; + } else if(row.status === 'O') { + status = 'ON PROCESS'; + } else { + status = 'PENDING'; + } + return status; + }, + accessorKey: 'status', + header: ({ column }) => , + enableSorting: false, + enableHiding: false, + meta: { + headerClassName: 'w-[250px]', + }, + }, { accessorKey: 'description', header: ({ column }) => , @@ -175,8 +153,7 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => { } } ], - [handleEditDialog, handleDeleteDialog] - ); + []); const getTransactionLists = async (page: number, limit: number, sorting: any, filter: any) => { try { @@ -222,16 +199,6 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => { return ( diff --git a/src/pages/transaction/transaction.tsx b/src/pages/transaction/transaction.tsx index dda8418..7466c60 100644 --- a/src/pages/transaction/transaction.tsx +++ b/src/pages/transaction/transaction.tsx @@ -1,39 +1,31 @@ import { Container, DataGridInner } from '@/components'; import { TransactionProvider } from './hooks/TransactionContext'; -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 Transaction = () => { - return ( - - -

TRANSACTION

- - - Dashboard - + return ( + + +

TRANSACTION

+ + + Dashboard + - - Master Data - + + Master Data + - - Transaction - - -
- -
- - - - - - - ); + + Transaction + + +
+ +
+ + + ); }; export default Transaction;