Merge branch 'master' of https://git.shiblysolution.id/TPAY/dashboard

src/pages/members/kyc-delete-member/ManageKycDeletion.tsx

@@ -1,5 +1,5 @@
 import { Container, DataGridInner } from '@/components';
-import { ManageKycDeletionContextProvider } from './hooks/ManageKycDeletionContext';
+import { ManageKycDeletionContextProvider } from './hooks';
 import { Breadcrumbs, Link } from '@mui/material';
 import { Helmet } from 'react-helmet';
 

src/pages/members/kyc-delete-member/blocks/DetailDialog.tsx

@@ -9,11 +9,12 @@ import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
 import { useManageKycDeletionContext } from '../hooks';
 import { apiConfig } from '@/config/api.config';
-import axios from 'axios';
+import { useDataGrid } from '@/components';
 
 const API_URL = apiConfig.service_customer;
 const DetailDialog = () => {
 	const { showDetailDialog, setShowDetailDialog, detailKyc, handleApproveReject } = useManageKycDeletionContext();
+	const { reload } = useDataGrid();
 
 	return (
 		<Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}>
@@ -38,8 +39,14 @@ const DetailDialog = () => {
 
 							<div className="flex justify-end gap-2 mt-3">
 								<Button type="button" variant="outline" onClick={() => setShowDetailDialog(false)}>Cancel</Button>
-								<Button onClick={() => handleApproveReject(detailKyc.id, 'N')} variant="destructive" color="warning">Reject</Button>
-								<Button onClick={() => handleApproveReject(detailKyc.id, 'Y')} variant="default" color="primary">Approve</Button>
+								<Button onClick={async() => {
+									await handleApproveReject(detailKyc.id, 'N')
+									reload()
+								}} variant="destructive" color="warning">Reject</Button>
+								<Button onClick={async() => {
+									await handleApproveReject(detailKyc.id, 'Y')
+									reload()
+								}} variant="default" color="primary">Approve</Button>
 							</div>
 						</div>
 					) : (<div></div>)}

src/pages/members/kyc-delete-member/hooks/ManageKycDeletionContext.tsx

@@ -37,7 +37,7 @@ interface ContextProps {
   selectedIdCustomer: string | null;
   detailKyc: any | null;
   setDetailKyc: React.Dispatch<React.SetStateAction<any>>;
-  handleApproveReject: (customerDeletionId: string, status_approve: string) => {};
+  handleApproveReject: (customerDeletionId: string, status_approve: string) => Promise<any>;
 }
 
 const initialProps: ContextProps = {
@@ -50,7 +50,7 @@ const initialProps: ContextProps = {
   setShowDetailDialog: () => { },
   detailKyc: async () => {},
   setDetailKyc: () => { },
-  handleApproveReject: () => ({customerDeletionId: '0', status_approve: 'Y'}),
+  handleApproveReject: async () => ({customerDeletionId: '0', status_approve: 'Y'}),
 };
 
 const ManageKycDeletionContext = createContext<ContextProps>(initialProps);
@@ -271,7 +271,6 @@ const ManageKycDeletionContextProvider = ({ children }: { children: React.ReactN
       }}
     >
       <Toaster expand visibleToasts={9} duration={3000} />
-      <DetailDialog />
 
       <DataGridProvider
         columns={columns}
@@ -285,6 +284,7 @@ const ManageKycDeletionContextProvider = ({ children }: { children: React.ReactN
         }
       >
         {children}
+        <DetailDialog />
       </DataGridProvider>
     </ManageKycDeletionContext.Provider>
   );

src/pages/members/kyc/Kyc.tsx

@@ -212,41 +212,37 @@ const Kyc = () => {
         ) : (
           ''
         )}
-        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3 grid gap-5 lg:gap-7.5 mx-8 w-auto">
-          KYC Upgrade Members
-        </h1>
-        <div className="grid gap-5 lg:gap-7.5 mx-8 w-auto">
-          <Breadcrumbs>
-            <Link underline="none" color="inherit" href="/">
-              <span className="text-sm hover:underline">Dashboard</span>
-            </Link>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">KYC Upgrade 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">Members</span>
+          </Link>
 
-            <Link underline="none" color="inherit">
-              <span className="text-sm">KYC Upgrade Members</span>
-            </Link>
-          </Breadcrumbs>
-        </div>
-        <div className="w-full overflow-x-auto px-4">
-          <div className="min-w-[800px]">
-            <DataGridProvider
-              data={members}
-              columns={getColumns(handleUpdate)}
-              pagination={{ size: 25 }}
-              toolbar={<ListToolBar />}
-              layout={{ card: true }}
-              sorting={[{ id: 'created_at', desc: true }]}
-              serverSide={false}
-              onRowSelectionChange={(selected, table: any) => {
-                const selectedRow = table.getSelectedRowModel().rows[0];
-                if (selectedRow) handleUpdate(selectedRow.original);
-              }}
-            ></DataGridProvider>
-          </div>
+          <Link underline="none" color="inherit">
+            <span className="text-sm">KYC Upgrade Members</span>
+          </Link>
+        </Breadcrumbs>
+        {/* <div className="w-full overflow-x-auto"> */}
+        <div className="grid gap-5 lg:gap-7.5 mt-5">
+          <DataGridProvider
+            data={members}
+            columns={getColumns(handleUpdate)}
+            pagination={{ size: 25 }}
+            toolbar={<ListToolBar />}
+            layout={{ card: true }}
+            sorting={[{ id: 'created_at', desc: true }]}
+            serverSide={false}
+            onRowSelectionChange={(selected, table: any) => {
+              const selectedRow = table.getSelectedRowModel().rows[0];
+              if (selectedRow) handleUpdate(selectedRow.original);
+            }}
+          ></DataGridProvider>
         </div>
+        {/* </div> */}
       </Container>
     </>
   );

src/pages/members/manage-members/ManageMembers.tsx

@@ -7,7 +7,7 @@ import axios from 'axios';
 import DetailMember from './blocks/DetailMember';
 import ConfirmDialog from '@/components/confirm';
 import { useAuthContext } from '@/auth';
-import { DataGridInner, LoaderTransparant } from '@/components';
+import { Container, DataGridInner, LoaderTransparant } from '@/components';
 import { DataGridProvider } from '@/components';
 import { toast } from 'sonner';
 import { Breadcrumbs, Link } from '@mui/material';
@@ -189,67 +189,59 @@ const ManageMembers = () => {
       <Helmet>
         <title>TPAY | Manage Members</title>
       </Helmet>
-      <div>
-        <div className="container mx-auto w-full">
-          <ConfirmDialog
-            open={dialogOpen}
-            onClose={() => setDialogOpen(false)}
-            title="Confirm Action"
-            content={`Are you sure you want to ${dialogType}?`}
-            onYes={handleYes}
-            onNo={() => setDialogOpen(false)}
+      <Container>
+        <ConfirmDialog
+          open={dialogOpen}
+          onClose={() => setDialogOpen(false)}
+          title="Confirm Action"
+          content={`Are you sure you want to ${dialogType}?`}
+          onYes={handleYes}
+          onNo={() => setDialogOpen(false)}
+        />
+        {member.id !== '' || dialogType === 'create' ? (
+          <DetailMember
+            showAddDialog={isDialogOpen}
+            setShowAddDialog={setShowAddDialog}
+            handleClose={closeDialog}
+            handleSubmit={handleSubmit}
+            initialData={member}
+            fetchCustomers={fetchCustomers}
+            profession={profession}
+            dialogType={dialogType}
           />
-          {member.id !== '' || dialogType === 'create' ? (
-            <DetailMember
-              showAddDialog={isDialogOpen}
-              setShowAddDialog={setShowAddDialog}
-              handleClose={closeDialog}
-              handleSubmit={handleSubmit}
-              initialData={member}
-              fetchCustomers={fetchCustomers}
-              profession={profession}
-              dialogType={dialogType}
-            />
-          ) : (
-            ''
-          )}
-          <h1 className="text-xl font-medium leading-none text-gray-900 mb-3 grid gap-5 lg:gap-7.5 mx-8 w-auto">
-            Manage Members
-          </h1>
-          <div className="grid gap-5 lg:gap-7.5 mx-8 w-auto">
-            <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>
+        ) : (
+          ''
+        )}
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">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>
-          </div>
-          <div className="w-full overflow-x-auto px-4">
-            <div className="min-w-[800px]">
-              <DataGridProvider
-                data={members}
-                columns={getColumns(handleUpdate)}
-                layout={{ card: true }}
-                serverSide={false}
-                toolbar={
-                  <ListToolbar createMember={createMember} />
-                }
-                onRowSelectionChange={(selected, table: any) => {
-                  const selectedRow = table.getSelectedRowModel().rows[0];
-                  if (selectedRow) handleUpdate(selectedRow.original);
-                }}
-              >
-              </DataGridProvider>
-            </div>
-          </div>
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Members</span>
+          </Link>
+        </Breadcrumbs>
+        {/* <div className="w-full overflow-x-auto px-4"> */}
+        <div className="grid gap-5 lg:gap-7.5 mt-5">
+          <DataGridProvider
+            data={members}
+            pagination={{ size: 25 }}
+            columns={getColumns(handleUpdate)}
+            layout={{ card: true }}
+            serverSide={false}
+            toolbar={<ListToolbar createMember={createMember} />}
+            onRowSelectionChange={(selected, table: any) => {
+              const selectedRow = table.getSelectedRowModel().rows[0];
+              if (selectedRow) handleUpdate(selectedRow.original);
+            }}
+          ></DataGridProvider>
         </div>
-      </div>
+        {/* </div> */}
+      </Container>
     </>
   );
 };