From 27cd84ca901a9aee142a641e354c00ac9f01100b Mon Sep 17 00:00:00 2001
From: Till JS <tills95@gmail.com>
Date: Tue, 31 Mar 2026 13:31:33 +0200
Subject: [PATCH] feat(todo): inline layout editor replacing ViewEditorModal

Replace the modal-based view editor with an inline editor that appears
directly on the page when the Layout pill is toggled:

- Edit toolbar: view name input, groupBy selector pills, page width (S/M/L/XL)
- Column editor: color picker, name input, reorder arrows, delete, add column
- Changes are applied live and visually reflected in the board below
- Escape key exits edit mode
- Remove ViewEditorModal from layout (no longer needed)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../apps/web/src/routes/(app)/+layout.svelte  | 30 +++----------------
 1 file changed, 4 insertions(+), 26 deletions(-)

diff --git a/apps/todo/apps/web/src/routes/(app)/+layout.svelte b/apps/todo/apps/web/src/routes/(app)/+layout.svelte
index af89c85e5..ae0a29c16 100644
--- a/apps/todo/apps/web/src/routes/(app)/+layout.svelte
+++ b/apps/todo/apps/web/src/routes/(app)/+layout.svelte
@@ -54,8 +54,6 @@
 		useAllBoardViews,
 		getActiveProjects,
 	} from '$lib/data/task-queries';
-	import { boardViewsStore } from '$lib/stores/board-views.svelte';
-	import { ViewEditorModal } from '$lib/components/board-views';
 	import SyncIndicator from '$lib/components/SyncIndicator.svelte';
 	import { List, X } from '@manacore/shared-icons';
 
@@ -70,16 +68,6 @@
 	// Use first board view as the single active view
 	let activeView = $derived(boardViews.value[0] ?? null);
 
-	// View Editor Modal (opened via Layout pill)
-	let showViewEditor = $state(false);
-
-	async function handleSaveView(data: Partial<LocalBoardView>) {
-		if (activeView) {
-			await boardViewsStore.updateView(activeView.id, data);
-		}
-		showViewEditor = false;
-	}
-
 	// Provide data to child components via Svelte context
 	setContext('projects', allProjects);
 	setContext('tasks', allTasks);
@@ -279,12 +267,12 @@
 			? [
 					{
 						href: '/',
-						label: 'Layout',
-						icon: 'grid',
+						label: editMode ? 'Fertig' : 'Layout',
+						icon: editMode ? 'check' : 'grid',
 						onClick: () => {
-							showViewEditor = true;
+							editMode = !editMode;
 						},
-						active: showViewEditor,
+						active: editMode,
 					},
 				]
 			: []),
@@ -574,16 +562,6 @@
 	{#if authStore.isAuthenticated}
 		<SessionExpiredBanner locale={$locale || 'de'} loginHref="/login" />
 	{/if}
-
-	<!-- View Editor Modal -->
-	<ViewEditorModal
-		open={showViewEditor}
-		view={activeView}
-		onSave={handleSaveView}
-		onClose={() => {
-			showViewEditor = false;
-		}}
-	/>
 </AuthGate>
 
 <style>