From 7ae1f3dc18b236a9c243ff6ff00cdece4c670e93 Mon Sep 17 00:00:00 2001
From: Marcel Raddatz <marcel@raddatz.cloud>
Date: Thu, 2 Apr 2026 13:09:26 +0200
Subject: [PATCH] feat(nav): add shared navigation config with mobile and
 desktop items

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/lib/nav/nav.test.ts | 42 ++++++++++++++++++++++++++++++++
 frontend/src/lib/nav/nav.ts      | 35 ++++++++++++++++++++++++++
 2 files changed, 77 insertions(+)
 create mode 100644 frontend/src/lib/nav/nav.test.ts
 create mode 100644 frontend/src/lib/nav/nav.ts

diff --git a/frontend/src/lib/nav/nav.test.ts b/frontend/src/lib/nav/nav.test.ts
new file mode 100644
index 0000000..63177d0
--- /dev/null
+++ b/frontend/src/lib/nav/nav.test.ts
@@ -0,0 +1,42 @@
+import { describe, it, expect } from 'vitest';
+import { mobileNavItems, desktopNavSections } from './nav';
+
+describe('nav config', () => {
+	describe('mobileNavItems', () => {
+		it('has exactly 4 items', () => {
+			expect(mobileNavItems).toHaveLength(4);
+		});
+
+		it('contains Planner, Recipes, Shopping, Settings in order', () => {
+			const labels = mobileNavItems.map((item) => item.label);
+			expect(labels).toEqual(['Planer', 'Rezepte', 'Einkauf', 'Einstellungen']);
+		});
+
+		it('each item has href, label, and icon', () => {
+			for (const item of mobileNavItems) {
+				expect(item).toHaveProperty('href');
+				expect(item).toHaveProperty('label');
+				expect(item).toHaveProperty('icon');
+				expect(item.href).toMatch(/^\//);
+			}
+		});
+	});
+
+	describe('desktopNavSections', () => {
+		it('has 2 sections: Plan and Household', () => {
+			expect(desktopNavSections).toHaveLength(2);
+			expect(desktopNavSections[0].title).toBe('Plan');
+			expect(desktopNavSections[1].title).toBe('Haushalt');
+		});
+
+		it('Plan section has Planner, Recipes, Shopping', () => {
+			const labels = desktopNavSections[0].items.map((item) => item.label);
+			expect(labels).toEqual(['Planer', 'Rezepte', 'Einkauf']);
+		});
+
+		it('Household section has Members, Settings', () => {
+			const labels = desktopNavSections[1].items.map((item) => item.label);
+			expect(labels).toEqual(['Mitglieder', 'Einstellungen']);
+		});
+	});
+});
diff --git a/frontend/src/lib/nav/nav.ts b/frontend/src/lib/nav/nav.ts
new file mode 100644
index 0000000..191971e
--- /dev/null
+++ b/frontend/src/lib/nav/nav.ts
@@ -0,0 +1,35 @@
+export interface NavItem {
+	href: string;
+	label: string;
+	icon: string;
+}
+
+export interface NavSection {
+	title: string;
+	items: NavItem[];
+}
+
+export const mobileNavItems: NavItem[] = [
+	{ href: '/planner', label: 'Planer', icon: 'calendar' },
+	{ href: '/recipes', label: 'Rezepte', icon: 'book' },
+	{ href: '/shopping', label: 'Einkauf', icon: 'shopping-cart' },
+	{ href: '/settings', label: 'Einstellungen', icon: 'settings' }
+];
+
+export const desktopNavSections: NavSection[] = [
+	{
+		title: 'Plan',
+		items: [
+			{ href: '/planner', label: 'Planer', icon: 'calendar' },
+			{ href: '/recipes', label: 'Rezepte', icon: 'book' },
+			{ href: '/shopping', label: 'Einkauf', icon: 'shopping-cart' }
+		]
+	},
+	{
+		title: 'Haushalt',
+		items: [
+			{ href: '/members', label: 'Mitglieder', icon: 'users' },
+			{ href: '/settings', label: 'Einstellungen', icon: 'settings' }
+		]
+	}
+];