"use client";

import {
    Button,
    Dialog,
    DialogActions,
    DialogContent,
    FormControl,
    FormHelperText,
    InputLabel,
    OutlinedInput,
} from "@mui/material";
import { object, string } from "yup";
import useRequest from "@/lib/hooks/useRequest";
import { useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import StyledForm from "@/core/components/StyledForm";
import ApplicantRequestDetail from "@/core/components/ApplicantRequestDetail";

const fakeData = {
    id: 1,
    shomareh_darkhast: "2124",
    ostan: "ostan",
    shahr: "shahr",
    shahrestan: "shahrestan",
    bakhsh: "bakhsh",
    roosta: "roosta",
    tarikh_darkhast: "tarikh_darkhast",
    sazman: "sazman",
    masahat_zamin: "masahat_zamin",
    masahat_tarh: "masahat_tarh",
    gorooh_tarh: "gorooh_tarh",
    onvane_tarh: "onvane_tarh",
    address: "کرج - فلان جا - جنب پاساژ - نزدیک اونجا - اونور خیابون - زیر رو گذر - روی زیر گذر",
    file_mosavab: "file",
    polygon: [
        [51.515, -0.09],
        [51.52, -0.1],
        [51.52, -0.12],
    ],
};

const validationSchema = object({
    description: string().required("وارد کردن توضیحات الزامیست!"),
});

const DetailDialog = ({ taskModal, setTaskModal, rowId, mutate }) => {
    const requestServer = useRequest({ auth: true });
    const defaultValues = {
        description: "",
    };
    const handleClose = () => {
        setTaskModal(false);
    };

    const {
        register,
        handleSubmit,
        formState: { isSubmitting, errors, touchedFields },
    } = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });

    const onSubmit = async (data) => {
        const formData = new FormData();
        formData.append("description", data.description);
        requestServer(`api-for-send-to-harim/${rowId}`, "post", {
            data: formData,
        })
            .then(() => {
                handleClose();
                mutate();
            })
            .catch(() => {});
    };
    return (
        <StyledForm onSubmit={handleSubmit(onSubmit)}>
            <Dialog open={taskModal} onClose={handleClose} maxWidth="lg" fullWidth>
                <DialogContent dividers>
                    <ApplicantRequestDetail data={fakeData} />
                    <FormControl error={!!errors.description} size="small" fullWidth variant="outlined">
                        <InputLabel sx={{ pt: 1 }} htmlFor="description">
                            توضیحات
                        </InputLabel>
                        <OutlinedInput
                            id="description"
                            label={"توضیحات"}
                            multiline
                            rows={8}
                            autoComplete="off"
                            {...register("description")}
                            size="small"
                            fullWidth
                            sx={{ mt: 1 }}
                            type="text"
                        />
                        <FormHelperText id="description">
                            {errors.description ? errors.description.message : null}
                        </FormHelperText>
                    </FormControl>
                </DialogContent>
                <DialogActions sx={{ justifyContent: "center", py: 2 }}>
                    <Button size="large" variant="contained">
                        ارسال به دفتر حریم
                    </Button>
                </DialogActions>
            </Dialog>
        </StyledForm>
    );
};
export default DetailDialog;