Update

frontend/dashboard/src/pages/UserManagement/UserAccess/Form.tsx

@@ -1,7 +1,7 @@
 import * as Yup from 'yup';
 import { LoadingButton } from "@mui/lab";
 import { Box, Card, Grid, Stack, Typography } from "@mui/material";
-import { Role, UserAccess } from "../../../@types/user";
+import { Role, UserAccess, Organization } from "../../../@types/user";
 import { FormProvider, RHFSelect, RHFSwitch, RHFTextField } from "../../../components/hook-form";
 import { useEffect, useMemo } from 'react';
 import { useForm } from 'react-hook-form';
@@ -14,10 +14,11 @@ import palette from '@/theme/palette';
 type Props = {
   isEdit: boolean;
   currentUserAccess?: UserAccess;
-  roles: Role 
+  roles: Role;
+  organizations: Organization;
 };
 
-export default function AccsessForm({ isEdit, currentUserAccess, roles }: Props) {
+export default function AccsessForm({ isEdit, currentUserAccess, roles, organizations }: Props) {
 
   const { enqueueSnackbar } = useSnackbar();
   const navigate = useNavigate();
@@ -34,6 +35,7 @@ export default function AccsessForm({ isEdit, currentUserAccess, roles }: Props)
       username:  currentUserAccess?.username || '',
       email: currentUserAccess?.email || '',
       roles: currentUserAccess?.role?.id || [],
+      organizations: currentUserAccess?.organization_id || [],
       password: '',
     }),
     [currentUserAccess]
@@ -107,11 +109,20 @@ export default function AccsessForm({ isEdit, currentUserAccess, roles }: Props)
     value: item.id,
     label: item.name
   })) ?? [];
-  
+
   if (optionsRoles.length > 0) {
     optionsRoles.unshift({ value: '', label: '' });
   }
 
+  const optionsOrganization = organizations?.data?.map(item => ({
+    value: item.id,
+    label: item.name
+  })) ?? [];
+
+  if (optionsOrganization.length > 0) {
+    optionsOrganization.unshift({ value: '', label: '' });
+  }
+
   return (
     <FormProvider methods={methods} onSubmit={handleSubmit(onSubmit)}>
         <Box sx={{ px: 2 }}>
@@ -131,6 +142,13 @@ export default function AccsessForm({ isEdit, currentUserAccess, roles }: Props)
                               </option>
                             ))}
                           </RHFSelect>
+                          <RHFSelect name="organizations" label="organizations">
+                            {optionsOrganization.map((option, index) => (
+                              <option key={index} value={option.value}>
+                                {option.label}
+                              </option>
+                            ))}
+                          </RHFSelect>
 
 
                           <LoadingButton type="submit" variant="contained" size="large" fullWidth={true} loading={isSubmitting}>