feat: show archived note indicator banner in editor (#183)

Adds a subtle ArchivedNoteBanner component below the breadcrumb bar
when a note is archived. Banner includes:
- Muted gray background with archive icon + 'Archived' label
- 'Unarchive' button (ArrowUUpLeft icon) wired to same handler as Cmd+E
- Keyboard hint shown in button title

Editor remains fully editable (banner is purely informational).
Indicator appears/disappears reactively via entry.archived from store.

Co-authored-by: Test <test@test.com>
This commit is contained in:
Luca Rossi
2026-03-03 02:31:10 +01:00
committed by GitHub
parent 4d7252c78f
commit 35144aedfb
4 changed files with 79 additions and 0 deletions

View File

@@ -0,0 +1,26 @@
import { render, screen, fireEvent } from '@testing-library/react'
import { describe, it, expect, vi } from 'vitest'
import { ArchivedNoteBanner } from './ArchivedNoteBanner'
describe('ArchivedNoteBanner', () => {
it('renders archive icon and label', () => {
render(<ArchivedNoteBanner onUnarchive={vi.fn()} />)
expect(screen.getByTestId('archived-note-banner')).toBeTruthy()
expect(screen.getByText('Archived')).toBeTruthy()
})
it('renders unarchive button with keyboard hint', () => {
render(<ArchivedNoteBanner onUnarchive={vi.fn()} />)
const btn = screen.getByTestId('unarchive-btn')
expect(btn).toBeTruthy()
expect(btn.textContent).toContain('Unarchive')
expect(btn.title).toBe('Unarchive (Cmd+E)')
})
it('calls onUnarchive when button is clicked', () => {
const onUnarchive = vi.fn()
render(<ArchivedNoteBanner onUnarchive={onUnarchive} />)
fireEvent.click(screen.getByTestId('unarchive-btn'))
expect(onUnarchive).toHaveBeenCalledOnce()
})
})