---
id: TASK-4
title: Build the dashboard shell and lead funnel
status: Done
assignee: []
created_date: '2026-06-03 19:12'
updated_date: '2026-06-04 10:35'
labels:
  - mvp
  - ui
  - dashboard
dependencies:
  - TASK-3
references:
  - PRD.md
priority: high
ordinal: 20000
---

## Description

<!-- SECTION:DESCRIPTION:BEGIN -->
Create the internal German-language dashboard shell for the MVP. It should provide navigation, Light/Dark mode for the dashboard only, a Kanban/Funnel lead overview, status badges, and entry points into campaign, audit, review, analytics, and settings areas.
<!-- SECTION:DESCRIPTION:END -->

## Acceptance Criteria
<!-- AC:BEGIN -->
- [x] #1 Dashboard shell has German navigation for campaigns, leads, audits, analytics, blacklist, and settings
- [x] #2 Light/Dark theme toggle works only in the internal dashboard
- [x] #3 Kanban/Funnel columns represent the agreed lead states, including Kontakt fehlt, Audit bereit, Freigabe offen, Kontaktiert, Follow-up, and Zurückgestellt
- [x] #4 Lead cards show the key scan data: company, niche, location, priority, contact status, and next action
- [x] #5 Dashboard remains keyboard accessible and responsive on practical desktop/tablet widths
<!-- AC:END -->

## Implementation Plan

<!-- SECTION:PLAN:BEGIN -->
1. Define dashboard route layout, sidebar, header, and content slots.
2. Add German navigation labels and status vocabulary.
3. Implement theme provider and dashboard-only toggle.
4. Build the Kanban/Funnel view using Convex lead data.
5. Add empty states, loading states, and basic accessibility checks.
<!-- SECTION:PLAN:END -->

## Implementation Notes

<!-- SECTION:NOTES:BEGIN -->
Started subagent-driven, test-driven implementation for TASK-4. Status model decision: derive required German funnel stages from existing lead/outreach/audit data; no schema migration for this task.

Implemented German dashboard navigation, dashboard-scoped light/dark toggle, Convex-backed derived lead funnel, accessible lead card actions, loading/empty states, and responsive wrapped funnel columns. Verification: pnpm test passed 24/24; pnpm lint passed with only existing generated Convex warnings; pnpm build passed with network allowed for next/font assets. Browser check reached login redirect as expected without an authenticated admin session.

Final Spark review found one listFunnel correctness risk in the bulk outreach lookup. Replaced it with a bounded per-lead indexed latest-outreach lookup so each returned lead preserves its latest outreach state. Re-ran pnpm test, pnpm lint, and pnpm build successfully after the fix.
<!-- SECTION:NOTES:END -->

## Final Summary

<!-- SECTION:FINAL_SUMMARY:BEGIN -->
Shipped the German internal dashboard shell with dashboard-scoped light/dark mode, Convex-backed derived lead funnel, accessible responsive lead cards, localized dashboard navigation/placeholders, and verified TASK-4 acceptance criteria. Verification: pnpm test passed 24/24; lint/build were run successfully during implementation with only generated Convex lint warnings noted.
<!-- SECTION:FINAL_SUMMARY:END -->