import { useMutation } from "@tanstack/react-query";
import axios from "axios";
import { FC, useState } from "react";
import { toast } from "react-toastify";
import { Select } from "../forms/Inputs";
type Props = {
  setting: any;
  option?: any;
};

const ReminderDayBefore: FC<Props> = ({ setting, option }) => {
  const [reminder, setReminder] = useState<number | string>(
    setting?.settings[option] ?? 2
  );

  const { mutate: updateStatus, isPending } = useMutation<any>({
    mutationFn: async (settingData) => {
      const { data } = await axios({
        method: "post",
        url: "/api/company",
        data: settingData,
      });
      return data.data;
    },
    onSuccess: (data) => {
      toast.success(`Setting update successfully!`);
    },
    onError: () => {},
  });

  const update = (scheduleTime: number) => {
    const data = {
      settings: {
        [option]: scheduleTime,
      },
    };
    updateStatus(data as any);
  };
  return (
    <div className="relative">
      <div
        className={`flex items-center`}
        onChange={(e: any) => update(e?.target?.value)}
      >
        <div>
          <Select
            defaultValue={reminder}
            options={[
              { value: 1, label: "1 Day" },
              { value: 2, label: "2 Day" },
              { value: 3, label: "3 Day" },
              { value: 4, label: "4 Day" },
              { value: 5, label: "5 Day" },
              { value: 6, label: "6 Day" },
              { value: 7, label: "7 Day" },
              { value: 8, label: "8 Day" },
              { value: 9, label: "9 Day" },
              { value: 10, label: "10 Day" },
              { value: 11, label: "11 Day" },
              { value: 12, label: "12 Day" },
              { value: 13, label: "13 Day" },
              { value: 14, label: "14 Day" },
              { value: 15, label: "15 Day" },
            ]}
            name={option}
          />
        </div>
        <div className="ml-2 w-36 inline">Before Deadline</div>
      </div>
    </div>
  );
};

export default ReminderDayBefore;