From b999a2fe8653e67e96e3e077ea9d0f00c295d2a1 Mon Sep 17 00:00:00 2001
From: nmemmert <nmemmert@users.noreply.github.com>
Date: Wed, 16 Sep 2026 08:20:35 -0400
Subject: [PATCH] Support multi-paragraph host bios on detail page; v2.0.23

Split bio on blank lines to render each paragraph as its own <p> tag.
Also grows the admin textarea from 3 to 8 rows so long bios are easier
to write and review.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 package.json      | 2 +-
 src/AdminPage.tsx | 2 +-
 src/App.tsx       | 4 +++-
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index bbb32c7..c9ee7ac 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "siteforge",
   "private": true,
-  "version": "2.0.22",
+  "version": "2.0.23",
   "type": "module",
   "scripts": {
     "dev": "vite",
diff --git a/src/AdminPage.tsx b/src/AdminPage.tsx
index bb672ae..e9f4a99 100644
--- a/src/AdminPage.tsx
+++ b/src/AdminPage.tsx
@@ -5091,7 +5091,7 @@ async function handleAssetUpload(event: ChangeEvent<HTMLInputElement>) {
                         </div>
                         <div className="admin-field">
                           <label>Bio</label>
-                          <textarea rows={3} value={host.bio} onChange={e => updateHost(host.id, { bio: e.target.value })} />
+                          <textarea rows={8} value={host.bio} onChange={e => updateHost(host.id, { bio: e.target.value })} />
                         </div>
                         <div className="admin-field">
                           <label>Photo</label>
diff --git a/src/App.tsx b/src/App.tsx
index 3dfde07..31d4da9 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -2023,7 +2023,9 @@ function NuggetsHostDetailPage({ content }: { content: SiteContent }) {
             )}
           </div>
           <div className="nuggets-host-detail-body">
-            {host.bio && <p className="nuggets-host-detail-bio">{host.bio}</p>}
+            {host.bio && host.bio.split(/\n\n+/).map((para, i) => (
+              <p key={i} className="nuggets-host-detail-bio">{para.replace(/\n/g, ' ')}</p>
+            ))}
             {(nuggets.spotifyUrl || nuggets.appleUrl) && (
               <div className="nuggets-host-detail-listen">
                 <p className="eyebrow" style={{ marginBottom: '0.75rem' }}>Listen to {nuggets.title}</p>