"use client"
import React from "react"
import { Dialog, DialogContent, DialogHeader, DialogTitle } from "@/components/ui/dialog"
import { AddReminderMain } from "./AddReminderMain"
import { useTranslations } from "next-intl"

interface AddReminderModalProps {
  open: boolean
  setOpen: (open: boolean) => void
}

export default function AddReminderModal({ open, setOpen }: AddReminderModalProps) {
  const t = useTranslations()

  return (
    <Dialog open={open} onOpenChange={setOpen}>
      <DialogContent className="sm:max-w-[600px] bg-white border-0 max-h-[90vh] overflow-y-auto [&>button]:top-5 [&>button]:right-5 [&>button]:text-white [&>button]:hover:text-gray-200 [&>button>svg]:stroke-[4px]">
        <DialogHeader className="bg-primary-gradient  -m-6 mb-0 px-6 py-3 rounded-t-lg">
          <DialogTitle className="text-white text-lg font-medium">{t("reminders.modals.addTitle")}</DialogTitle>
        </DialogHeader>

        <div className="px-6 py-4">
          <AddReminderMain onSuccess={() => setOpen(false)} onCancel={() => setOpen(false)} />
        </div>
      </DialogContent>
    </Dialog>
  )
}