feat: Publication de pages — notes publiques sur URL
- Migration: champs isPublic + publicSlug + publishedAt sur Note - Route publique /p/[slug] — rendu SSR sans auth, prose styled - Server actions: publishNote / unpublishNote / getPublishedNote - API /api/notes/publish — toggle publication + génération slug - PublishDialog — modal avec lien copiable + bouton dépublier - Bouton Globe dans le toolbar (vert si publiée) - i18n FR/EN - Pattern inspiré de BrainstormSession.isPublic
This commit is contained in:
67
memento-note/app/(public)/p/[slug]/page.tsx
Normal file
67
memento-note/app/(public)/p/[slug]/page.tsx
Normal file
@@ -0,0 +1,67 @@
|
||||
import { notFound } from 'next/navigation'
|
||||
import { getPublishedNote } from '@/app/actions/notes-publishing'
|
||||
import { FileText, Calendar } from 'lucide-react'
|
||||
import { format } from 'date-fns'
|
||||
|
||||
export async function generateMetadata({ params }: { params: Promise<{ slug: string }> }) {
|
||||
const { slug } = await params
|
||||
const note = await getPublishedNote(slug)
|
||||
if (!note) return { title: 'Note not found' }
|
||||
return { title: note.title || 'Published note', description: note.content?.replace(/<[^>]+>/g, '').slice(0, 160) }
|
||||
}
|
||||
|
||||
export const dynamic = 'force-static'
|
||||
export const revalidate = 3600
|
||||
|
||||
export default async function PublishedNotePage({ params }: { params: Promise<{ slug: string }> }) {
|
||||
const { slug } = await params
|
||||
const note = await getPublishedNote(slug)
|
||||
|
||||
if (!note) notFound()
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-[#F2F0E9] dark:bg-zinc-950">
|
||||
<div className="max-w-3xl mx-auto px-6 py-12">
|
||||
{/* Header */}
|
||||
<div className="mb-8 pb-6 border-b border-black/10 dark:border-white/10">
|
||||
<div className="flex items-center gap-2 text-xs text-muted-foreground mb-3">
|
||||
<FileText size={14} />
|
||||
<span>Note publiée</span>
|
||||
{note.publishedAt && (
|
||||
<>
|
||||
<span>·</span>
|
||||
<Calendar size={12} />
|
||||
<span>{format(new Date(note.publishedAt), 'MMM d, yyyy')}</span>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
<h1 className="text-3xl font-serif font-medium tracking-tight text-foreground leading-tight mb-2">
|
||||
{note.title || 'Sans titre'}
|
||||
</h1>
|
||||
{note.user?.name && (
|
||||
<p className="text-sm text-muted-foreground">par {note.user.name}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Content */}
|
||||
<article
|
||||
dir="auto"
|
||||
className="prose prose-stone dark:prose-invert max-w-none
|
||||
prose-headings:font-serif prose-headings:font-medium
|
||||
prose-p:leading-relaxed prose-p:text-[15px]
|
||||
prose-pre:bg-zinc-100 prose-pre:dark:bg-zinc-900
|
||||
prose-blockquote:border-brand-accent/40
|
||||
prose-a:text-brand-accent"
|
||||
dangerouslySetInnerHTML={{ __html: note.content || '' }}
|
||||
/>
|
||||
|
||||
{/* Footer */}
|
||||
<div className="mt-12 pt-6 border-t border-black/10 dark:border-white/10 text-center">
|
||||
<p className="text-xs text-muted-foreground">
|
||||
Publié sur Momento
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user