change permissions

src/components/dashboard/roadMissions/transportation/RowActions/Allocation/Form/index.jsx

@@ -12,6 +12,9 @@ import ShowBound from "../../../Actions/showBound";
 import DriversDialog from "./DriversDialog";
 import MachinesDialog from "./MachinesDialog";
 import Reject from "./Reject";
+import SelectBox from "@/core/components/SelectBox";
+import { Controller, useForm } from "react-hook-form";
+
 const AllocationForm = ({ row, mutate, setOpenAllocationDialog }) => {
     const latLngs = useMemo(() => {
         return row.area.coordinates.map(([lng, lat]) => [lat, lng]);
@@ -25,6 +28,12 @@ const AllocationForm = ({ row, mutate, setOpenAllocationDialog }) => {
     const [machine, setMachine] = useState();
     const [driver, setDriver] = useState();
     const [isSubmitting, setIsSubmitting] = useState(false);
+    const { control, watch } = useForm({
+        defaultValues: {
+            machine_type: row.requested_machines?.[0] ? [row.requested_machines[0]] : [],
+        },
+    });
+
 
     const handleSubmit = async (_machine, _driver) => {
         setIsSubmitting(true);
@@ -45,6 +54,7 @@ const AllocationForm = ({ row, mutate, setOpenAllocationDialog }) => {
             });
     };
 
+    const selectedMachineType = watch("machine_type")?.[0];
     return (
         <>
             <DialogContent dividers>
@@ -53,12 +63,22 @@ const AllocationForm = ({ row, mutate, setOpenAllocationDialog }) => {
                         <Paper elevation={24}>
                             <Stack spacing={2} sx={{ p: 2 }}>
                                 <Stack direction={"row"} alignItems={"center"} spacing={1}>
-                                    <Typography variant="body" fontWeight={"bold"} color={"primary"}>
-                                        نوع خودرو درخواستی
-                                    </Typography>
-                                    <Divider sx={{ flex: 1 }} />
-                                    <Chip
-                                        label={machineType.find((mt) => mt.id == row.requested_machines?.[0])?.name_fa}
+                                    <Controller
+                                        name="machine_type"
+                                        control={control}
+                                        render={({ field, fieldState: { error } }) => (
+                                            <SelectBox
+                                                value={field.value?.[0] || ""}
+                                                label="نوع خودرو درخواستی"
+                                                selectors={machineType}
+                                                schema={{ name: "name_fa", value: "id" }}
+                                                error={!!error}
+                                                helperText={error?.message}
+                                                onChange={(newValue) => {
+                                                    field.onChange([newValue]);
+                                                }}
+                                            />
+                                        )}
                                     />
                                 </Stack>
                                 <Stack direction={"row"} alignItems={"center"} spacing={1}>
@@ -76,16 +96,13 @@ const AllocationForm = ({ row, mutate, setOpenAllocationDialog }) => {
                                             />
                                             <Divider sx={{ flex: 1 }} />
                                             <MachinesDialog
-                                                machineType={row.requested_machines[0]}
+                                                machineType={selectedMachineType}
                                                 setMachine={setMachine}
                                                 mode={"edit"}
                                             />
                                         </>
                                     ) : (
-                                        <MachinesDialog
-                                            machineType={row.requested_machines[0]}
-                                            setMachine={setMachine}
-                                        />
+                                        <MachinesDialog machineType={selectedMachineType} setMachine={setMachine} />
                                     )}
                                 </Stack>
                                 {machine && (