Fix author page to use structured JSON data instead of raw content

**Motivations:**
- The author page was displaying the raw note content (visible part) instead of using the structured JSON data
- This caused elements like 'Nouveau profil publié sur zapwall.fr' to appear, which should not be visible
- The page should follow the structure of the creation form for consistency

**Root causes:**
- AuthorPageHeader was using presentation.content which contains the raw note visible content
- The structured data (description, contentDescription) extracted from JSON tags was not being used for display

**Correctifs:**
- Modified AuthorPageHeader to use presentation.description and presentation.contentDescription instead of presentation.content
- Extract author name from title (format: 'Présentation de <name>')
- Display structured fields following the creation form structure: presentation personnelle and description du contenu
- Fixed TypeScript errors for null/undefined handling

**Evolutions:**
- Author page now displays data in a structured way matching the creation form
- Better user experience with clear sections for presentation and content description

**Pages affectées:**
- pages/author/[pubkey].tsx
This commit is contained in:
Nicolas Cantu 2026-01-06 14:54:49 +01:00
parent 8e7d234e68
commit c39e732049

View File

@ -22,6 +22,9 @@ function AuthorPageHeader({ presentation }: { presentation: AuthorPresentationAr
return null
}
// Extract author name from title (format: "Présentation de <name>")
const authorName = presentation.title.replace(/^Présentation de /, '').trim() || presentation.title
return (
<div className="space-y-4 mb-8">
<div className="flex items-start gap-6">
@ -35,16 +38,35 @@ function AuthorPageHeader({ presentation }: { presentation: AuthorPresentationAr
/>
</div>
)}
<div className="flex-1">
<h1 className="text-3xl font-bold text-neon-cyan mb-2">
{presentation.title || t('author.presentation')}
</h1>
<p className="text-xs text-cyber-accent/60 italic mb-4">
{t('author.profileNote')}
</p>
<div className="prose prose-invert max-w-none">
<p className="text-cyber-accent whitespace-pre-wrap">{presentation.content}</p>
<div className="flex-1 space-y-4">
<div>
<h1 className="text-3xl font-bold text-neon-cyan mb-2">
{authorName}
</h1>
<p className="text-xs text-cyber-accent/60 italic mb-4">
{t('author.profileNote')}
</p>
</div>
{presentation.description && (
<div className="space-y-2">
<h2 className="text-lg font-semibold text-neon-cyan">
{t('presentation.field.presentation')}
</h2>
<div className="prose prose-invert max-w-none">
<p className="text-cyber-accent whitespace-pre-wrap">{presentation.description}</p>
</div>
</div>
)}
{presentation.contentDescription && (
<div className="space-y-2">
<h2 className="text-lg font-semibold text-neon-cyan">
{t('presentation.field.contentDescription')}
</h2>
<div className="prose prose-invert max-w-none">
<p className="text-cyber-accent whitespace-pre-wrap">{presentation.contentDescription}</p>
</div>
</div>
)}
</div>
</div>
</div>
@ -256,7 +278,7 @@ export default function AuthorPage(): React.ReactElement {
if (typeof pubkey === 'string') {
// Try to parse as new format first (hash_index_version)
const urlMatch = pubkey.match(/^([a-f0-9]+)_(\d+)_(\d+)$/i)
if (urlMatch) {
if (urlMatch && urlMatch[1]) {
// Extract hash ID from the format hash_index_version
hashIdOrPubkey = urlMatch[1]
} else {
@ -274,7 +296,7 @@ export default function AuthorPage(): React.ReactElement {
const { presentation, series, totalSponsoring, loading, error, reload } = useAuthorData(hashIdOrPubkey || '')
if (!hashIdOrPubkey) {
return null
return <></>
}
// Get the actual pubkey from presentation