* feat: make trashed notes read-only with visible banner in editor
When a note is in the Trash, the editor now shows a banner below the
breadcrumb ("This note is in the Trash") with Restore and Delete
permanently buttons. The BlockNote editor is set to read-only mode,
preventing accidental edits while still allowing navigation and copy.
- Add TrashedNoteBanner component with restore/delete actions
- Pass editable={false} to BlockNoteView when note is trashed
- Add delete_note Rust command for permanent file deletion
- Wire onDeleteNote through Editor → EditorContent → App
- Extract EditorBody to reduce EditorContent cyclomatic complexity
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* style: rustfmt fix
---------
Co-authored-by: Test <test@test.com>
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
45 lines
1.5 KiB
TypeScript
45 lines
1.5 KiB
TypeScript
import { memo } from 'react'
|
|
import { Trash, ArrowCounterClockwise } from '@phosphor-icons/react'
|
|
|
|
interface TrashedNoteBannerProps {
|
|
onRestore: () => void
|
|
onDeletePermanently: () => void
|
|
}
|
|
|
|
export const TrashedNoteBanner = memo(function TrashedNoteBanner({
|
|
onRestore,
|
|
onDeletePermanently,
|
|
}: TrashedNoteBannerProps) {
|
|
return (
|
|
<div
|
|
className="flex shrink-0 items-center gap-3"
|
|
style={{
|
|
padding: '6px 16px',
|
|
background: 'var(--destructive-muted, color-mix(in srgb, var(--destructive) 8%, var(--background)))',
|
|
borderBottom: '1px solid var(--border)',
|
|
fontSize: 12,
|
|
}}
|
|
data-testid="trashed-note-banner"
|
|
>
|
|
<Trash size={14} style={{ color: 'var(--destructive)', flexShrink: 0 }} />
|
|
<span className="text-muted-foreground" style={{ flex: 1 }}>This note is in the Trash</span>
|
|
<button
|
|
className="flex items-center gap-1 border-none bg-transparent px-2 py-0.5 text-xs cursor-pointer rounded transition-colors text-primary hover:bg-accent"
|
|
onClick={onRestore}
|
|
data-testid="trashed-banner-restore"
|
|
>
|
|
<ArrowCounterClockwise size={12} />
|
|
Restore
|
|
</button>
|
|
<button
|
|
className="flex items-center gap-1 border-none bg-transparent px-2 py-0.5 text-xs cursor-pointer rounded transition-colors text-destructive hover:bg-destructive/10"
|
|
onClick={onDeletePermanently}
|
|
data-testid="trashed-banner-delete"
|
|
>
|
|
<Trash size={12} />
|
|
Delete permanently
|
|
</button>
|
|
</div>
|
|
)
|
|
})
|