From 39422a43486d8644983c8c1d4fb15ebc16d9db86 Mon Sep 17 00:00:00 2001
From: Leopoldadmin <leopold.hammerschmidt@media-on.de>
Date: Fri, 26 Jun 2026 20:53:41 +0200
Subject: [PATCH] fix: layer IDs globally unique - use timestamp-based IDs
 instead of hardcoded layer-0/1/2/3/4

Root cause: layers.id is TEXT PRIMARY KEY (global unique across all drawings).
Hardcoded IDs layer-0..layer-4 collided when multiple projects tried to create
the same layer IDs. Second project got UNIQUE constraint failed on POST /layers.
Without layers, elements had dangling layer_id refs causing FOREIGN KEY errors.

Fix: makeInitialLayers() generates unique IDs: layer-{timestamp}-{index}.
activeLayerId initialized from first layer, not hardcoded.
activeLayerName uses activeLayerId variable, not hardcoded layer-0.
On project load with existing layers, activeLayerId set from first DB layer.
---
 frontend/src/App.tsx | 30 ++++++++++++++++++++----------
 1 file changed, 20 insertions(+), 10 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 47c55bf..732ccc1 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -36,13 +36,18 @@ import { Register } from './pages/Register';
 import { Dashboard } from './pages/Dashboard';
 
 // ─── Mock Data ──────────────────────────────────────────────
-const initialLayers: CADLayer[] = [
-  { id: 'layer-0', name: 'Wände', visible: true, locked: false, color: '#e74c3c', lineType: 'solid', transparency: 0, sortOrder: 0, parentId: null },
-  { id: 'layer-1', name: 'Türen', visible: true, locked: false, color: '#3498db', lineType: 'solid', transparency: 0, sortOrder: 1, parentId: null },
-  { id: 'layer-2', name: 'Bestuhlung', visible: true, locked: false, color: '#2ecc71', lineType: 'solid', transparency: 0, sortOrder: 2, parentId: null },
-  { id: 'layer-3', name: 'Bühne', visible: true, locked: false, color: '#f39c12', lineType: 'solid', transparency: 0, sortOrder: 3, parentId: null },
-  { id: 'layer-4', name: 'Hintergrund', visible: true, locked: true, color: '#95a5a6', lineType: 'dotted', transparency: 50, sortOrder: 4, parentId: null },
-];
+function makeInitialLayers(): CADLayer[] {
+  const ts = Date.now();
+  return [
+    { id: `layer-${ts}-0`, name: 'Wände', visible: true, locked: false, color: '#e74c3c', lineType: 'solid', transparency: 0, sortOrder: 0, parentId: null },
+    { id: `layer-${ts}-1`, name: 'Türen', visible: true, locked: false, color: '#3498db', lineType: 'solid', transparency: 0, sortOrder: 1, parentId: null },
+    { id: `layer-${ts}-2`, name: 'Bestuhlung', visible: true, locked: false, color: '#2ecc71', lineType: 'solid', transparency: 0, sortOrder: 2, parentId: null },
+    { id: `layer-${ts}-3`, name: 'Bühne', visible: true, locked: false, color: '#f39c12', lineType: 'solid', transparency: 0, sortOrder: 3, parentId: null },
+    { id: `layer-${ts}-4`, name: 'Hintergrund', visible: true, locked: true, color: '#95a5a6', lineType: 'dotted', transparency: 50, sortOrder: 4, parentId: null },
+  ];
+}
+
+const initialLayers: CADLayer[] = makeInitialLayers();
 
 const initialBlocks: BlockDefinition[] = createDefaultBlocks();
 
@@ -110,7 +115,7 @@ const CADEditor: React.FC<CADEditorProps> = ({ projectId, token, onNavigateBack
   const [activeRightPanel, setActiveRightPanel] = useState<RightPanel>('tool');
   const [selectedElement, setSelectedElement] = useState<CADElement | null>(null);
   const [layers, setLayers] = useState<CADLayer[]>(initialLayers);
-  const [activeLayerId, setActiveLayerId] = useState<string>('layer-0');
+  const [activeLayerId, setActiveLayerId] = useState<string>(initialLayers[0].id);
   const [blocks, setBlocks] = useState<BlockDefinition[]>(initialBlocks);
   const [blockCategory, setBlockCategory] = useState('Alle');
   const [selectedTemplate, setSelectedTemplate] = useState<string | null>(null);
@@ -252,9 +257,14 @@ const CADEditor: React.FC<CADEditorProps> = ({ projectId, token, onNavigateBack
         if (data.blocks.length > 0) setBlocks(data.blocks);
         // Save initial layers to backend if backend has none
         if (data.layers.length === 0 && data.drawing) {
-          for (const layer of initialLayers) {
+          const freshLayers = makeInitialLayers();
+          setLayers(freshLayers);
+          setActiveLayerId(freshLayers[0].id);
+          for (const layer of freshLayers) {
             createLayerTyped(token, data.drawing.id, layer).catch(() => {});
           }
+        } else {
+          setActiveLayerId(data.layers[0]?.id ?? initialLayers[0].id);
         }
         setSavedStatus('gespeichert');
         setDataLoaded(true);
@@ -911,7 +921,7 @@ const CADEditor: React.FC<CADEditorProps> = ({ projectId, token, onNavigateBack
     handleKISend(suggestion.label);
   }, [handleKISend]);
 
-  const activeLayerName = layers.find((l) => l.id === 'layer-0')?.name ?? '—';
+  const activeLayerName = layers.find((l) => l.id === activeLayerId)?.name ?? '—';
 
   // ─── Render ─────────────────────────────────────────────
   return (