From c39e73204995d2724110831d9415ce470f160b52 Mon Sep 17 00:00:00 2001
From: Nicolas Cantu <nicolas.cantu@pm.me>
Date: Tue, 6 Jan 2026 14:54:49 +0100
Subject: [PATCH] Fix author page to use structured JSON data instead of raw
 content
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

**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
---
 pages/author/[pubkey].tsx | 44 +++++++++++++++++++++++++++++----------
 1 file changed, 33 insertions(+), 11 deletions(-)

diff --git a/pages/author/[pubkey].tsx b/pages/author/[pubkey].tsx
index 16d53bb..1c40b99 100644
--- a/pages/author/[pubkey].tsx
+++ b/pages/author/[pubkey].tsx
@@ -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