From d74df3323fa1d187023bf4f83dd045eb13ff7d86 Mon Sep 17 00:00:00 2001
From: David Montero Crespo <davidmonterocrespo24@gmail.com>
Date: Tue, 4 Aug 2026 03:36:54 +0200
Subject: [PATCH] fix(ui): say when a part has no datasheet instead of showing
 an empty tab

91 of the 156 catalogue parts have neither an authored doc nor a metadata
description, so the Datasheet tab rendered nothing but tag chips and read as
broken. It now states plainly that no datasheet is written yet, and points at
the pin map, which IS the useful content for those parts. The picker hover
card gets the same line, since both render one body.
---
 frontend/src/components/ComponentInfoPanel.css |  7 +++++++
 frontend/src/components/ComponentInfoPanel.tsx | 11 +++++++++--
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/ComponentInfoPanel.css b/frontend/src/components/ComponentInfoPanel.css
index d8327eff..13ba73a9 100644
--- a/frontend/src/components/ComponentInfoPanel.css
+++ b/frontend/src/components/ComponentInfoPanel.css
@@ -333,3 +333,10 @@
   flex-shrink: 0;
 }
 
+
+/* No authored doc and no metadata description — most of the catalogue. Say it
+   plainly instead of leaving the panel looking broken. */
+.cip-desc--empty {
+  color: #7a7a7a;
+  font-style: italic;
+}
diff --git a/frontend/src/components/ComponentInfoPanel.tsx b/frontend/src/components/ComponentInfoPanel.tsx
index f58a370b..7f2a35b7 100644
--- a/frontend/src/components/ComponentInfoPanel.tsx
+++ b/frontend/src/components/ComponentInfoPanel.tsx
@@ -123,13 +123,20 @@ export const ComponentInfoBody: React.FC<{
 
   return (
     <>
-      {/* Authored datasheet supersedes the thin auto-generated description. */}
+      {/* Authored datasheet supersedes the thin auto-generated description.
+          91 of the 156 catalogue parts have NEITHER, so say so rather than
+          leaving the reader looking at an empty panel wondering if it broke. */}
       {doc?.body ? (
         <div className="cip-doc">
           <ReactMarkdown remarkPlugins={[remarkGfm]}>{doc.body}</ReactMarkdown>
         </div>
+      ) : data.description ? (
+        <p className="cip-desc">{data.description}</p>
       ) : (
-        data.description && <p className="cip-desc">{data.description}</p>
+        <p className="cip-desc cip-desc--empty">
+          No datasheet written for this part yet.
+          {data.pinCount > 0 && ' Its pins are listed on the left.'}
+        </p>
       )}
 
       {showProps && shownProps.length > 0 && (