From d489c1e30692371558bedf78a8202d75107cda45 Mon Sep 17 00:00:00 2001
From: mikael-lovqvists-claude-agent <mikaels.claude.agent@efforting.tech>
Date: Sun, 22 Mar 2026 01:27:11 +0000
Subject: [PATCH] Inventory view: click component name to navigate to component
 detail

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 public/app.mjs   | 10 +++++++++-
 public/style.css |  9 +++++++++
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/public/app.mjs b/public/app.mjs
index a1d24a8..ce12f98 100644
--- a/public/app.mjs
+++ b/public/app.mjs
@@ -550,7 +550,15 @@ function render_inventory_list() {
 function build_inventory_row(entry) {
 	const row = clone('t-inventory-row');
 	const comp = component_by_id(entry.component_id);
-	set_text(row, '.inv-component-name', comp ? component_display_name(comp) : '(deleted component)');
+	const name_el = qs(row, '.inv-component-name');
+	name_el.textContent = comp ? component_display_name(comp) : '(deleted component)';
+	if (comp) {
+		name_el.classList.add('inv-component-link');
+		name_el.addEventListener('click', () => {
+			selected_component_id = comp.id;
+			navigate('/components');
+		});
+	}
 
 	const pill = document.createElement('span');
 	pill.className = `type-pill type-${entry.location_type}`;
diff --git a/public/style.css b/public/style.css
index 91ee631..a958eea 100644
--- a/public/style.css
+++ b/public/style.css
@@ -643,6 +643,15 @@ nav {
 .type-pill.type-bom      { background: var(--badge-bom-bg);      color: var(--badge-bom-text); }
 .type-pill.type-digital  { background: var(--badge-digital-bg);  color: var(--badge-digital-text); }
 
+.inv-component-link {
+	cursor: pointer;
+	color: var(--accent);
+}
+
+.inv-component-link:hover {
+	text-decoration: underline;
+}
+
 .inv-quantity {
 	font-family: var(--font-mono);
 	font-size: 0.9rem;