From e96368cb7cc9acef543e8e1124a96c444fb98bd5 Mon Sep 17 00:00:00 2001
From: vegard <vnotnes@pm.me>
Date: Fri, 20 Mar 2026 03:33:57 +0000
Subject: [PATCH] Fix: Space/piltaster i inputs, reaktiv node-visning,
 edit-tilgang
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Canvas: keyboard-events ignoreres når bruker skriver i input/textarea.
Space fungerer nå i søkefelt og tekstredigering.

Node Explorer: selectedNode er nå reaktiv mot nodeStore — endringer
reflekteres umiddelbart etter lagring uten å velge noden på nytt.
✏️-knapp vises bare for noder brukeren eier.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../src/lib/components/canvas/Canvas.svelte   |  6 +++++
 .../traits/NodeExplorerTrait.svelte           | 22 ++++++++++++++-----
 2 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/frontend/src/lib/components/canvas/Canvas.svelte b/frontend/src/lib/components/canvas/Canvas.svelte
index ca04907..6ca7263 100644
--- a/frontend/src/lib/components/canvas/Canvas.svelte
+++ b/frontend/src/lib/components/canvas/Canvas.svelte
@@ -120,6 +120,12 @@
 	// Keyboard listeners
 	$effect(() => {
 		function onKeyDown(e: KeyboardEvent) {
+			// Ikke fang tastatur-events når bruker skriver i inputs/textareas
+			const tag = (e.target as HTMLElement)?.tagName;
+			const isEditing = tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT'
+				|| (e.target as HTMLElement)?.isContentEditable;
+			if (isEditing) return;
+
 			if (e.code === 'Space' && !e.repeat) {
 				spaceHeld = true;
 				e.preventDefault();
diff --git a/frontend/src/lib/components/traits/NodeExplorerTrait.svelte b/frontend/src/lib/components/traits/NodeExplorerTrait.svelte
index ffc0224..273d5a8 100644
--- a/frontend/src/lib/components/traits/NodeExplorerTrait.svelte
+++ b/frontend/src/lib/components/traits/NodeExplorerTrait.svelte
@@ -17,9 +17,20 @@
 
 	let searchQuery = $state('');
 	let filterKind = $state('');
-	let selectedNode = $state<Node | undefined>(undefined);
+	let selectedNodeId = $state<string | undefined>(undefined);
 	let limit = $state(50);
 
+	// Reaktiv: følger nodeStore slik at endringer reflekteres umiddelbart
+	const selectedNode = $derived(selectedNodeId ? nodeStore.get(selectedNodeId) : undefined);
+
+	// Kan brukeren redigere denne noden?
+	const canEdit = $derived(
+		selectedNode && userId && (
+			selectedNode.createdBy === userId ||
+			userId === 'd3eebc99-9c0b-4ef8-bb6d-6bb9bd380a44' // TODO: ekte admin-sjekk
+		)
+	);
+
 	// Editing state
 	let editing = $state(false);
 	let editTitle = $state('');
@@ -67,14 +78,15 @@
 	});
 
 	function selectNode(node: Node) {
-		selectedNode = node;
+		selectedNodeId = node.id;
 		editing = false;
 		saveError = '';
 	}
 
 	function navigateToNode(id: string) {
-		const node = nodeStore.get(id);
-		if (node) selectNode(node);
+		selectedNodeId = id;
+		editing = false;
+		saveError = '';
 	}
 
 	function startEditing() {
@@ -201,7 +213,7 @@
 				<div class="ne-detail-header">
 					<span class="ne-detail-kind">{selectedNode.nodeKind}</span>
 					<div class="ne-detail-actions">
-						{#if !editing}
+						{#if !editing && canEdit}
 							<button class="ne-action-btn" onclick={startEditing} title="Rediger">✏️</button>
 						{/if}
 					</div>