import Button, {
  ButtonShape,
  ButtonSize,
  ButtonVariant,
} from '@/components/button/Button';
import Modal from '@/components/modal/Modal';

interface OverwriteModalProps {
  isOpen: boolean;
  onClose: () => void;
  onConfirm: () => void;
  onCancel: () => void;
  title?: string;
  bodyText: string;
  confirmButtonText?: string;
  cancelButtonText?: string;
}

export const OverwriteModal: React.FC<OverwriteModalProps> = ({
  isOpen,
  onClose,
  onConfirm,
  onCancel,
  title = 'Overwrite?',
  bodyText,
  confirmButtonText = 'Overwrite',
  cancelButtonText = 'Keep Current',
}) => {
  if (!isOpen) return null;

  return (
    <Modal
      onClose={onClose}
      title={title}
      titleWrapperClasses='justify-center'
      wrapperClasses='overflow-y-auto'
      contentWrapperClasses='mx-[24px]'
    >
      <div className='text-center'>
        <p className='text-foreground-secondary'>{bodyText}</p>
      </div>
      <div className='mt-4 flex w-auto items-center justify-center gap-2 px-4 pb-4'>
        <Button
          shape={ButtonShape.Rounded}
          size={ButtonSize.Small}
          onClick={onConfirm}
          variant={ButtonVariant.Primary}
        >
          {confirmButtonText}
        </Button>
        <Button
          shape={ButtonShape.Rounded}
          size={ButtonSize.Small}
          onClick={onCancel}
          variant={ButtonVariant.Secondary}
        >
          {cancelButtonText}
        </Button>
      </div>
    </Modal>
  );
};