This commit is contained in:
alma 2025-05-04 16:19:42 +02:00
parent a7a03927dd
commit 3062d92eaa

View File

@ -91,67 +91,74 @@ export function NotesDialog({ open, onOpenChange }: NotesDialogProps) {
return (
<Dialog open={open} onOpenChange={onOpenChange}>
<DialogContent className="sm:max-w-[500px] bg-white border-gray-200">
<DialogHeader>
<DialogTitle className="text-gray-900">Quick Note</DialogTitle>
</DialogHeader>
<div className="grid gap-4 py-4">
{error && (
<div className="bg-red-50 text-red-500 p-2 rounded-md text-sm">
{error}
</div>
)}
<DialogPortal>
<DialogOverlay />
<DialogContent className="sm:max-w-[500px] bg-white border-gray-200">
<DialogHeader>
<DialogTitle className="text-gray-900">Quick Note</DialogTitle>
</DialogHeader>
<div className="grid grid-cols-4 items-center gap-4">
<Input
id="title"
placeholder="Note title"
className="col-span-4 text-gray-900"
value={title}
onChange={(e) => setTitle(e.target.value)}
disabled={isSaving}
/>
</div>
<div className="grid grid-cols-4 items-center gap-4">
<Textarea
id="content"
placeholder="What's on your mind?"
className="col-span-4 text-gray-900"
rows={10}
value={content}
onChange={(e) => setContent(e.target.value)}
disabled={isSaving}
/>
</div>
</div>
<DialogFooter>
<Button
variant="destructive"
onClick={() => onOpenChange(false)}
disabled={isSaving}
className="bg-red-600 hover:bg-red-700 text-white"
>
Cancel
</Button>
<Button
onClick={handleSave}
disabled={isSaving}
className="bg-blue-600 hover:bg-blue-700 text-white"
>
{isSaving ? (
<>
<Loader2 className="mr-2 h-4 w-4 animate-spin" />
Saving...
</>
) : (
"Save Note"
<div className="grid gap-4 py-4">
{error && (
<div className="bg-red-50 text-red-500 p-2 rounded-md text-sm">
{error}
</div>
)}
</Button>
</DialogFooter>
</DialogContent>
<div className="grid grid-cols-4 items-center gap-4">
<Input
id="title"
placeholder="Note title"
className="col-span-4 text-gray-900"
value={title}
onChange={(e) => setTitle(e.target.value)}
disabled={isSaving}
/>
</div>
<div className="grid grid-cols-4 items-center gap-4">
<Textarea
id="content"
placeholder="What's on your mind?"
className="col-span-4 text-gray-900"
rows={10}
value={content}
onChange={(e) => setContent(e.target.value)}
disabled={isSaving}
/>
</div>
</div>
<DialogFooter>
<Button
variant="destructive"
onClick={() => onOpenChange(false)}
disabled={isSaving}
className="bg-red-600 hover:bg-red-700 text-white"
>
Cancel
</Button>
<Button
onClick={handleSave}
disabled={isSaving}
className="bg-blue-600 hover:bg-blue-700 text-white"
>
{isSaving ? (
<>
<Loader2 className="mr-2 h-4 w-4 animate-spin" />
Saving...
</>
) : (
"Save Note"
)}
</Button>
</DialogFooter>
<DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
<X className="h-4 w-4 text-gray-500" />
<span className="sr-only">Close</span>
</DialogPrimitive.Close>
</DialogContent>
</DialogPortal>
</Dialog>
);
}