103 lines
2.9 KiB
TypeScript
103 lines
2.9 KiB
TypeScript
import { Dialog, DialogContent, DialogHeader, DialogTitle } from "@/components/ui/dialog"
|
|
import { Button } from "@/components/ui/button"
|
|
import { Input } from "@/components/ui/input"
|
|
import { useState, useEffect } from "react"
|
|
|
|
interface ReminderDialogProps {
|
|
open: boolean
|
|
onOpenChange: (open: boolean) => void
|
|
currentReminder: Date | null
|
|
onSave: (date: Date) => void
|
|
onRemove: () => void
|
|
}
|
|
|
|
export function ReminderDialog({
|
|
open,
|
|
onOpenChange,
|
|
currentReminder,
|
|
onSave,
|
|
onRemove
|
|
}: ReminderDialogProps) {
|
|
const [reminderDate, setReminderDate] = useState('')
|
|
const [reminderTime, setReminderTime] = useState('')
|
|
|
|
useEffect(() => {
|
|
if (open) {
|
|
if (currentReminder) {
|
|
const date = new Date(currentReminder)
|
|
setReminderDate(date.toISOString().split('T')[0])
|
|
setReminderTime(date.toTimeString().slice(0, 5))
|
|
} else {
|
|
const tomorrow = new Date(Date.now() + 86400000)
|
|
setReminderDate(tomorrow.toISOString().split('T')[0])
|
|
setReminderTime('09:00')
|
|
}
|
|
}
|
|
}, [open, currentReminder])
|
|
|
|
const handleSave = () => {
|
|
if (!reminderDate || !reminderTime) return
|
|
|
|
const dateTimeString = `${reminderDate}T${reminderTime}`
|
|
const date = new Date(dateTimeString)
|
|
|
|
if (!isNaN(date.getTime())) {
|
|
onSave(date)
|
|
onOpenChange(false)
|
|
}
|
|
}
|
|
|
|
return (
|
|
<Dialog open={open} onOpenChange={onOpenChange}>
|
|
<DialogContent>
|
|
<DialogHeader>
|
|
<DialogTitle>Set Reminder</DialogTitle>
|
|
</DialogHeader>
|
|
<div className="space-y-4 py-4">
|
|
<div className="space-y-2">
|
|
<label htmlFor="reminder-date" className="text-sm font-medium">
|
|
Date
|
|
</label>
|
|
<Input
|
|
id="reminder-date"
|
|
type="date"
|
|
value={reminderDate}
|
|
onChange={(e) => setReminderDate(e.target.value)}
|
|
className="w-full"
|
|
/>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<label htmlFor="reminder-time" className="text-sm font-medium">
|
|
Time
|
|
</label>
|
|
<Input
|
|
id="reminder-time"
|
|
type="time"
|
|
value={reminderTime}
|
|
onChange={(e) => setReminderTime(e.target.value)}
|
|
className="w-full"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div className="flex justify-between">
|
|
<div>
|
|
{currentReminder && (
|
|
<Button variant="outline" onClick={() => { onRemove(); onOpenChange(false); }}>
|
|
Remove Reminder
|
|
</Button>
|
|
)}
|
|
</div>
|
|
<div className="flex gap-2">
|
|
<Button variant="ghost" onClick={() => onOpenChange(false)}>
|
|
Cancel
|
|
</Button>
|
|
<Button onClick={handleSave}>
|
|
Set Reminder
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</DialogContent>
|
|
</Dialog>
|
|
)
|
|
}
|