refactor(notes): split NoteEditor into NoteForm and NoteReadView

src/components/NoteReadView.test.tsx

@@ -0,0 +1,59 @@
+import { fireEvent, render, screen } from '@testing-library/react'
+import { describe, expect, it, vi } from 'vitest'
+import NoteReadView from './NoteReadView'
+import type { Note } from '../types/note'
+
+const note: Note = { id: 42, title: 'Courses', content: 'Lait\nOeufs' }
+
+const renderView = (overrides: Partial<Note> = {}) => {
+  const onEdit = vi.fn()
+  const onDelete = vi.fn()
+  render(
+    <NoteReadView note={{ ...note, ...overrides }} onEdit={onEdit} onDelete={onDelete} />,
+  )
+  return { onEdit, onDelete }
+}
+
+describe('NoteReadView', () => {
+  it('displays the note title and content', () => {
+    renderView()
+
+    expect(screen.getByText('Courses')).toBeInTheDocument()
+    expect(screen.getByText('Lait Oeufs')).toBeInTheDocument()
+    expect(screen.getByRole('button', { name: 'Éditer' })).toBeInTheDocument()
+  })
+
+  it('shows placeholders for a note without title or content', () => {
+    renderView({ title: '', content: '' })
+
+    expect(screen.getByText('Sans titre')).toBeInTheDocument()
+    expect(screen.getByText('Note vide')).toBeInTheDocument()
+  })
+
+  it('calls onEdit when Éditer is clicked', () => {
+    const { onEdit } = renderView()
+
+    fireEvent.click(screen.getByRole('button', { name: 'Éditer' }))
+
+    expect(onEdit).toHaveBeenCalled()
+  })
+
+  it('deletes the note after confirmation', () => {
+    const { onDelete } = renderView()
+
+    fireEvent.click(screen.getByRole('button', { name: 'Supprimer la note' }))
+    fireEvent.click(screen.getByRole('button', { name: 'Supprimer' }))
+
+    expect(onDelete).toHaveBeenCalledWith(42)
+    expect(screen.queryByRole('dialog')).not.toBeInTheDocument()
+  })
+
+  it('does not delete when the confirmation is cancelled', () => {
+    const { onDelete } = renderView()
+
+    fireEvent.click(screen.getByRole('button', { name: 'Supprimer la note' }))
+    fireEvent.click(screen.getByRole('button', { name: 'Annuler' }))
+
+    expect(onDelete).not.toHaveBeenCalled()
+  })
+})