description in cinfirm form

public/locales/fa/app.json

@@ -130,7 +130,8 @@
     "context": "آیا از تایید این آیتم اطمینان دارید",
     "button-confirm": "تایید",
     "button-cancel": "بستن",
-    "amount_error": "وارد کردن مقدار پیشنهادی الزامیست"
+    "amount_error": "وارد کردن مقدار پیشنهادی الزامیست",
+    "description_error": "وارد کردن توضیحات الزامی است!"
   },
   "RejectDialog": {
     "reject": "عدم تایید",

src/components/dashboard/passenger-office/Form/ConfirmForm.jsx

@@ -6,11 +6,36 @@ import {
   DialogContentText,
   DialogActions,
   Button,
+  TextField,
 } from "@mui/material";
+import { useFormik } from "formik";
 import { useTranslations } from "next-intl";
+import { useState } from "react";
 
 const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
   const t = useTranslations();
+  const [description, setDescription] = useState("");
+
+  const formik = useFormik({
+    initialValues: {
+      description: "",
+      fileData: null,
+    },
+    onSubmit: () => {
+      const formData = new FormData();
+      if (description !== "")
+        formData.append("expert_description", description);
+      // if (fileData !== null) formData.append("file", fileData);
+      handleClose();
+      confirmData(CONFIRM_PASSENGER_OFFICE, rowId, formData);
+    },
+  });
+
+  const handleDescriptionChange = (event) => {
+    setDescription(event.target.value);
+    formik.handleChange(event);
+  };
+
   const handleConfirm = () => {
     handleClose();
     confirmData(CONFIRM_PASSENGER_OFFICE, rowId);
@@ -20,6 +45,18 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
       <DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
       <DialogContent>
         <DialogContentText>{t("ConfirmDialog.context")}</DialogContentText>
+        <TextField
+          name="description"
+          multiline
+          rows={8}
+          placeholder={t("RejectDialog.description")}
+          value={description}
+          onChange={handleDescriptionChange}
+          onBlur={formik.handleBlur("description")}
+          fullWidth
+          variant="outlined"
+          sx={{ mt: 1 }}
+        />
       </DialogContent>
       <DialogActions>
         <Button onClick={handleConfirm} color="primary">