LFFE-18 validation on confirm img in machinary expert

src/components/dashboard/machinary-office/Form/ConfirmForm/ConfirmContent.jsx

@@ -1,7 +1,15 @@
 import UploadSystem from "@/core/components/UploadSystem";
 import useNotification from "@/lib/app/hooks/useNotification";
 import useRequest from "@/lib/app/hooks/useRequest";
-import {Button, DialogActions, DialogContent, Stack, TextField, Typography} from "@mui/material"
+import {
+    Button,
+    DialogActions,
+    DialogContent,
+    FormHelperText,
+    Stack,
+    TextField,
+    Typography
+} from "@mui/material"
 import {useFormik} from "formik";
 import {useTranslations} from "next-intl";
 import {CONFIRM_MACHINARY_OFFICE} from "@/core/data/apiRoutes";
@@ -25,7 +33,18 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog}) => {
             `${t("ConfirmDialog.proposed_amount_number")}`,
             (value) => !isNaN(value)
         ).test("positive", `${t("ConfirmDialog.proposed_amount_positive")}`, (value) => value >= 0)
-            .required(t("ConfirmDialog.proposed_amount_error"))
+            .required(t("ConfirmDialog.proposed_amount_error")),
+        confirm_img: Yup.mixed()
+            .required(t("MachinaryOffice.upload_file_required"))
+            .test('fileSize', `${t("MachinaryOffice.upload_file_unit")}`, (value) => {
+                // if (!value) return true; // Skip if no file is provided
+                return value.size <= 2 * 1024 * 1024; // 100KB limit (adjust as needed)
+            })
+            .test('fileType', `${t("MachinaryOffice.upload_file_format")}`, (value) => {
+                // if (!value) return true; // Skip if no file is provided
+                const allowedTypes = ['image/jpg', 'image/png', 'application/pdf']; // Define your allowed file types
+                return allowedTypes.includes(value.type);
+            })
     });
 
     const formik = useFormik({
@@ -129,7 +148,7 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog}) => {
                         />
                     </Stack>
                     <Stack>
-                        <Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
+                        <Typography>{t("MachinaryOffice.upload_file")}</Typography>
                         <UploadSystem
                             selectedImage={selectedImage}
                             handleUploadChange={handleUploadChange} // Pass the updated function directly
@@ -140,9 +159,22 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog}) => {
                             fileName={fileName}
                             imageAlt={t("app_name")}
                             imageSize={[250, 150]}
+                            onBlur={formik.handleBlur("confirm_img")}
+                            error={
+                                formik.touched.confirm_img &&
+                                Boolean(formik.errors.confirm_img)
+                            }
+                            helperText={
+                                formik.touched.confirm_img && formik.errors.confirm_img
+                            }
                             setShowAddIcon={setShowAddIcon}
                             showAddIcon={showAddIcon}
                         />
+                        <FormHelperText
+                            error={Boolean(formik.errors.confirm_img)}
+                        >
+                            {formik.errors.confirm_img ? formik.errors.confirm_img : null}
+                        </FormHelperText>
                     </Stack>
                 </Stack>
             </DialogContent>