feat(ui): page édition d'une carte pré-remplie (P3-5, F-06)
Page /cards/:id/edit : charge la carte via cardsApi, pré-remplit CardForm en mode edit et enregistre via cardsApi.update. Ajoute un test F-06 au form (pré-remplissage + update + navigation). Coche P3-5 dans TODO.
This commit is contained in:
1 parent
2e131dddcb
commit
03a6b7b455
2 files changed
+67
No files matched your search
@@ -0,0 +1,45 @@
|
||||
import type { Metadata } from 'next'
|
||||
import Link from 'next/link'
|
||||
import { notFound } from 'next/navigation'
|
||||
import { CardForm } from '@/components/card-form'
|
||||
import type { Card, CardInput } from '@/domain/card'
|
||||
import { ApiClientError, cardsApi } from '@/lib/api-client'
|
||||
|
||||
export const metadata: Metadata = { title: 'Modifier la carte' }
|
||||
|
||||
export default async function EditCardPage({
|
||||
params,
|
||||
}: {
|
||||
params: Promise<{ id: string }>
|
||||
}) {
|
||||
const { id } = await params
|
||||
let card: Card | null = null
|
||||
try {
|
||||
card = await cardsApi.get(id)
|
||||
} catch (e) {
|
||||
if (e instanceof ApiClientError && e.status === 404) notFound()
|
||||
throw e
|
||||
}
|
||||
|
||||
const initial: CardInput = {
|
||||
question: card.question,
|
||||
response: card.response,
|
||||
theme: card.theme,
|
||||
tags: card.tags,
|
||||
}
|
||||
|
||||
return (
|
||||
<main className="mx-auto max-w-3xl px-4 py-8">
|
||||
<div className="mb-6">
|
||||
<Link
|
||||
href={`/cards/${id}`}
|
||||
className="text-sm font-medium text-slate-600 underline-offset-4 hover:underline"
|
||||
>
|
||||
← Retour au détail
|
||||
</Link>
|
||||
<h1 className="mt-2 text-2xl font-bold text-slate-900">{card.question}</h1>
|
||||
</div>
|
||||
<CardForm mode="edit" cardId={card.id} initial={initial} />
|
||||
</main>
|
||||
)
|
||||
}
|
||||
Reference in new issue
Block a user