add dialog confirm

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

@@ -18,15 +18,37 @@ import { useManageKycDeletionContext } from '../hooks';
 import { apiConfig } from '@/config/api.config';
 import { useDataGrid } from '@/components';
 import { useState } from 'react';
+import ConfirmDialog from '@/components/confirm';
 
 const API_URL = apiConfig.service_customer;
 const DetailDialog = () => {
 	const { showDetailDialog, setShowDetailDialog, detailKyc, handleApproveReject } = useManageKycDeletionContext();
 	const [genders] = useState([ { name: 'Male',id: 'M' }, { name: 'Female',id: 'F' }])
+	const [dialogOpen, setDialogOpen] = useState(false);
+  	const [dialogType, setDialogType] = useState('');
 	const { reload } = useDataGrid();
 
+	async function handleYes() {
+		await handleApproveReject(detailKyc.id, dialogType)
+		setDialogOpen(false)
+		reload()
+	}
+
+	function onSubmit(type:string) {
+		setDialogType(type)
+		setDialogOpen(true)
+	}
+
 	return (
 		<Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}>
+			<ConfirmDialog
+				open={dialogOpen}
+				onClose={() => setDialogOpen(false)}
+				title="Confirm Action"
+				content={`Are you sure you want to ${dialogType === 'Y' ? 'Approve' : 'Reject'}?`}
+				onYes={handleYes}
+				onNo={() => setDialogOpen(false)}
+			/>
 			<DialogContent className="container-fixed max-w-[1024px] flex flex-col p-5 overflow-hidden max-h-[90vh] overflow-y-auto">
 				<DialogHeader>
 					<DialogTitle>Customer Deletion Details </DialogTitle>
@@ -49,12 +71,14 @@ const DetailDialog = () => {
 							<div className="flex justify-end gap-2 mt-3">
 								<Button type="button" variant="outline" onClick={() => setShowDetailDialog(false)}>Cancel</Button>
 								<Button onClick={async() => {
-									await handleApproveReject(detailKyc.id, 'N')
-									reload()
+									// await handleApproveReject(detailKyc.id, 'N')
+									// reload()
+									onSubmit('N')
 								}} variant="destructive" color="warning" disabled={detailKyc.status_approve==='Waiting Approval'?false:true}>Reject</Button>
 								<Button onClick={async() => {
-									await handleApproveReject(detailKyc.id, 'Y')
-									reload()
+									// await handleApproveReject(detailKyc.id, 'Y')
+									// reload()
+									onSubmit('Y')
 								}} variant="default" color="primary" disabled={detailKyc.status_approve==='Waiting Approval'?false:true}>Approve</Button>
 							</div>
 						</div>