"use client";

import React, { useContext, useEffect, useRef, useState } from "react";
import { BottomSheet } from "react-spring-bottom-sheet";
import Input from "plugins/Input/page";
import AppContext from "@ctx/AppContext";
import SimpleReactValidator from "simple-react-validator";
import CheckBoxBriz from "plugins/CheckBoxBriz/page";
import Buttonbriz from "plugins/Buttonbriz/page";
import { toast } from "react-toastify";

const BottomSheetReport = (props) => {
  const CTX = useContext(AppContext);
  const reportDetail = CTX.state.reportDetail;

  const handleSendReport_SHIFTPLAN = () => {
    CTX.ReportShiftPlan(reportDetail?.shiftId);
    CTX.setBottomSheetReportOpen(false);
  };

  const handleSendReport_TASK = () => {
    CTX.ReportTask();
    CTX.setBottomSheetReportOpen(false);
  };

  return (
    <BottomSheet
      open={CTX.state.BottomSheetReportOpen}
      onDismiss={() => CTX.setBottomSheetReportOpen(false)}
      blocking={true}
    >
      <div className="text-center py-2 bg-secondary-950  ">
        <p className="mb-0 text-primary-300 relative top-[-5px]">گزارشات </p>
      </div>

      <div className="px-3 pt-10 ">
        <p className="mb-0 text-center text-sm font-light">
          شما در حال گرفتن گزارش برای
          <small className="text-sm font-medium"> {reportDetail?.title} </small>
          هستید
        </p>
      </div>

      <div className=" p-4">
        <Buttonbriz
          title="گرفتن گزارش"
          color="INFO"
          icon="CHECK"
          buttonEvent={() => {
            if (reportDetail.typeReport == "TASK") {
              handleSendReport_TASK();
            } else if (reportDetail.typeReport == "SHIFTPLAN") {
              handleSendReport_SHIFTPLAN();
            }
          }}
        />
      </div>
    </BottomSheet>
  );
};

export default BottomSheetReport;