import MuiDialog from '@/components/MuiDialog';
import axios from '@/utils/axios';
import { Button, Checkbox, Typography } from '@mui/material';
import { Paper } from '@mui/material';
import { Stack } from '@mui/material';
import { enqueueSnackbar } from 'notistack';
import React, { useState } from 'react';
import FormHistoryPerawatan from './FormHistoryPerawatan';
import { useDispatch } from 'react-redux';
import { claimsHistoryAction } from '@/store/claimsHistorySlice';

type DialogHistoryPerawatanType = {
    openDialog: boolean;
    setOpenDialog: React.Dispatch;
    onSubmit?: void;
    claim: any; // TODO create ClaimType
    encounter?: any;
}

export default function DialogHistoryPerawatan({ openDialog, setOpenDialog, onSubmit, claim, encounter } : DialogHistoryPerawatanType) {

    const isEdit = encounter?.id != null
    const dispatch = useDispatch()
  // const benefits = member?.current_plan?.benefits ?? [];
  // const [selectedBenefits, setSelectedBenefits] = useState([]);

  // const toggleBenefit = (benefit) => {
  //     if (selectedBenefits.includes(benefit)) {
  //         console.log('removing', benefit)
  //         setSelectedBenefits(selectedBenefits.filter((throughBenefit) => benefit.id != throughBenefit.id))
  //     } else {
  //         console.log('adding', benefit)
  //         setSelectedBenefits([...selectedBenefits, benefit])
  //     }
  // }

  const handleSubmit = (data) => {
    
    if (!isEdit) {
        axios.post(`claims/${claim.id}/encounters`, data)
            .then((res) => {
                enqueueSnackbar(res.data.message, {variant: 'success'})
                setOpenDialog(false);
                window.location.reload(); // tolong benerin ya
                // axios.get(`claims/${claim.id}`).then((res) => {
                //   dispatch(claimsHistoryAction.setClaims(res.data.data.encounter))
                // })
            })
            .catch((err) => {
                enqueueSnackbar(err.message, {variant: 'error'})
            })
    } else {
        axios.post(`claims/${claim.id}/encounters/${data.id}/update`, data)
            .then((res) => {
                enqueueSnackbar(res.data.message, {variant: 'success'})
                setOpenDialog(false);
                window.location.reload(); // tolong benerin ya
                // axios.get(`claims/${claim.id}`).then((res) => {
                //   dispatch(claimsHistoryAction.setClaims(res.data.data.encounter))
                // })
            })
            .catch((err) => {
                enqueueSnackbar(err.message, {variant: 'error'})
            })
    }
  };
  

  const getContent = () => (
    <Stack spacing={1} marginTop={2}>
        <FormHistoryPerawatan claim={claim} onSubmit={handleSubmit} encounter={encounter}></FormHistoryPerawatan>
    </Stack>
  );

  return (
    <MuiDialog
      title={{ name: !isEdit ? 'Tambah History Perawatan' : 'Edit History Perawatan' }}
      openDialog={openDialog}
      setOpenDialog={setOpenDialog}
      content={getContent()}
      maxWidth="xl"
    />
  );
}
