devcodetools
31283ada26
- sw.ts : API GET, navigation et payloads RSC en network-first (cache en secours hors-ligne) ; écritures non interceptées ; fallback ~offline - edit page : bouton Supprimer avec confirmation (CardDeleteButton)
46 lines
1.4 KiB
TypeScript
46 lines
1.4 KiB
TypeScript
import type { Metadata } from 'next'
|
|
import Link from 'next/link'
|
|
import { notFound } from 'next/navigation'
|
|
import { CardDeleteButton } from '@/components/card-delete'
|
|
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>
|
|
<div className="mt-2 flex items-center justify-between gap-4">
|
|
<h1 className="text-2xl font-bold text-slate-900">{card.question}</h1>
|
|
<CardDeleteButton cardId={card.id} question={card.question} />
|
|
</div>
|
|
</div>
|
|
<CardForm mode="edit" cardId={card.id} initial={initial} />
|
|
</main>
|
|
)
|
|
}
|