member and kyc

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

@@ -6,9 +6,11 @@ import axios from 'axios';
 import CustomerDialog from './CustomerDetailModal';
 import ConfirmDialog from '@/components/confirm';
 import { useAuthContext } from '@/auth';
+import { ScreenLoader } from '@/components';
 const BASE_URL = apiConfig.service_customer;
 
 const ManageMembers = () => {
+  const [loading, setLoading] = useState(false);
   const [members, setMembers] = useState([]);
   const [member, setMember] = useState(initialMember);
   const [isDialogOpen, setIsDialogOpen] = useState(false);
@@ -18,7 +20,9 @@ const ManageMembers = () => {
   const { getUser } = useAuthContext();
 
   useEffect(() => {
+    setLoading(true)
     fetchGroups()
+    setLoading(false)
   }, []);
 
   async function fetchGroups() {
@@ -46,20 +50,26 @@ const ManageMembers = () => {
   }
 
   const handleUpdate = (data: any) => {
+    setDialogType('update');
     setMember(data)
     setIsDialogOpen(true)
   }
 
+  function createMember() {
+    setDialogType('create');
+    setMember(initialMember);
+    setIsDialogOpen(true);
+  }
+
   async function handleSubmit(data: any) {
-    setDialogType('update')
     setMember(data)
     setDialogOpen(true)
   }
 
   const handleYes = async () => {
-    let userLogin: any = await getUser();
-    let updateData: any = member;
-    let customerId = member.id;
+    const userLogin: any = await getUser();
+    const updateData: any = member;
+    const customerId = member.id;
     updateData.updated_by = userLogin.data ? userLogin.data.id : ''
     let today = new Date();
     updateData.updated_at = today.toString();
@@ -70,6 +80,8 @@ const ManageMembers = () => {
     delete updateData.latitude;
     delete updateData.created_at;
     delete updateData.no;
+    delete updateData.destinationGroup;
+    delete updateData.statusApproval;
     delete updateData.group_id;
     delete updateData.group_name;
     delete updateData.group_description;
@@ -81,15 +93,20 @@ const ManageMembers = () => {
     delete updateData.group_deleted_by;
     delete updateData.group_deleted_at;
     try {
-      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)
     } catch (error: any) {
       alert(error.message)
+      setDialogOpen(false)
       setIsDialogOpen(false)
     }
   }
 
+  if (loading) return (<ScreenLoader/>)
+
   return (
     <div>
       <div className="container mx-auto p-5">
@@ -97,13 +114,13 @@ const ManageMembers = () => {
         open={dialogOpen}
         onClose={() => setDialogOpen(false)}
         title="Confirm Action"
-        content={`Are you sure you want to `+( dialogType === 'create' ? "create?" : ( dialogType === 'update' ? "update?" : "delete?"))}
+        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">Manage Members</h1>
-        <DataTable data={members} columns={columns} onUpdate={handleUpdate} onDelete={null}/>
+        <DataTable data={members} createData={createMember} columns={columns} onUpdate={handleUpdate} onDelete={null}/>
       </div>
     </div>
   );