806f4c4eeb
- Fix createNotebookOptimistic to call loadNotebooks() + triggerRefresh() after POST, so new notebooks appear immediately without page reload - Remove window.location.reload() from delete-notebook-dialog (context already handles state refresh) - Rewrite edit-notebook-dialog to use updateNotebook() from context instead of raw fetch + full page reload - Fix NoteRefreshContext: remove refreshKey from useCallback deps to prevent unstable triggerRefresh callback cascade - Fix notebook actions menu visibility: consolidate NotebookActions and expand button into single positioned container with proper z-index - Add actions menu to active/selected notebook (was previously missing) - Use proper Notebook type instead of any in sidebar components - Increase button pr-20 to pr-24 to reserve space for actions - Remove redundant router.refresh() from create-notebook-dialog Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
96 lines
2.6 KiB
TypeScript
96 lines
2.6 KiB
TypeScript
'use client'
|
|
|
|
import { useState, useEffect } from 'react'
|
|
import { useLanguage } from '@/lib/i18n'
|
|
import { Button } from '@/components/ui/button'
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogDescription,
|
|
DialogFooter,
|
|
DialogHeader,
|
|
DialogTitle,
|
|
} from '@/components/ui/dialog'
|
|
import { Input } from '@/components/ui/input'
|
|
import { Label } from '@/components/ui/label'
|
|
import { useNotebooks } from '@/context/notebooks-context'
|
|
import { Notebook } from '@/lib/types'
|
|
|
|
interface EditNotebookDialogProps {
|
|
notebook: Notebook
|
|
open: boolean
|
|
onOpenChange: (open: boolean) => void
|
|
}
|
|
|
|
export function EditNotebookDialog({ notebook, open, onOpenChange }: EditNotebookDialogProps) {
|
|
const { updateNotebook } = useNotebooks()
|
|
const { t } = useLanguage()
|
|
const [name, setName] = useState(notebook?.name || '')
|
|
const [isSubmitting, setIsSubmitting] = useState(false)
|
|
|
|
useEffect(() => {
|
|
if (open) {
|
|
setName(notebook?.name || '')
|
|
}
|
|
}, [open, notebook?.name])
|
|
|
|
const handleSubmit = async (e: React.FormEvent) => {
|
|
e.preventDefault()
|
|
if (!name.trim()) return
|
|
setIsSubmitting(true)
|
|
try {
|
|
await updateNotebook(notebook.id, { name: name.trim() })
|
|
onOpenChange(false)
|
|
} catch {
|
|
// Error handled in UI
|
|
} finally {
|
|
setIsSubmitting(false)
|
|
}
|
|
}
|
|
|
|
return (
|
|
<Dialog open={open} onOpenChange={onOpenChange}>
|
|
<DialogContent className="sm:max-w-[425px]">
|
|
<DialogHeader>
|
|
<DialogTitle>{t('notebook.edit')}</DialogTitle>
|
|
<DialogDescription>
|
|
{t('notebook.editDescription')}
|
|
</DialogDescription>
|
|
</DialogHeader>
|
|
<form onSubmit={handleSubmit}>
|
|
<div className="grid gap-4 py-4">
|
|
<div className="grid grid-cols-4 items-center gap-4">
|
|
<Label htmlFor="name" className="text-right">
|
|
Name
|
|
</Label>
|
|
<Input
|
|
id="name"
|
|
value={name}
|
|
onChange={(e) => setName(e.target.value)}
|
|
placeholder="My Notebook"
|
|
className="col-span-3"
|
|
autoFocus
|
|
/>
|
|
</div>
|
|
</div>
|
|
<DialogFooter>
|
|
<Button
|
|
type="button"
|
|
variant="outline"
|
|
onClick={() => onOpenChange(false)}
|
|
>
|
|
{t('general.cancel')}
|
|
</Button>
|
|
<Button
|
|
type="submit"
|
|
disabled={!name.trim() || isSubmitting}
|
|
>
|
|
{isSubmitting ? 'Saving...' : t('general.confirm')}
|
|
</Button>
|
|
</DialogFooter>
|
|
</form>
|
|
</DialogContent>
|
|
</Dialog>
|
|
)
|
|
}
|