import { Feather } from "@expo/vector-icons"
import ModalConfirmation from "./ModalConfirmation"
import { ButtonHeader } from "./buttonHeader"
import { useState } from "react"

type Props = {
   category: 'create' | 'update' | 'cancel' | 'update-calendar'
   onPress?: () => void
   disable?: boolean
}

export default function ButtonSaveHeader({ category, onPress, disable }: Props) {
   const [showModal, setShowModal] = useState(false)
   return (
      <>
         <ButtonHeader
            item={<Feather name="check" size={25} color={disable ? "grey" : "white"} />}
            onPress={() => {
               if (!disable) {
                  setShowModal(true)
               }
            }}
         />

         <ModalConfirmation
            visible={showModal}
            title="Konfirmasi"
            message={
               category == 'create'
                  ? 'Apakah anda yakin ingin menambahkan data?'
                  : category == 'cancel'
                     ? 'Apakah anda yakin ingin membatalkan kegiatan? Pembatalan bersifat permanen'
                     : category == 'update-calendar'
                        ? 'Apakah Anda yakin ingin mengubah data acara ini? Data ini akan mempengaruhi semua data yang terkait'
                        : 'Apakah anda yakin mengubah data?'
            }
            onConfirm={() => {
               setShowModal(false)
               onPress && onPress()
            }}
            onCancel={() => setShowModal(false)}
            confirmText="Ya"
            cancelText="Batal"
         />
      </>
   )
}