feat: add frontend auth pages, app layout, and Supabase integration (Phase 1E)
- Auth pages: login (password + magic link), register (with firm name), callback - Supabase client setup: browser client, server client, middleware for session refresh - App layout: sidebar (Dashboard, Akten, Fristen, Termine, AI Analyse, Einstellungen), header with user info and tenant switcher - Shared: API client with auth headers, TypeScript types matching Go models, QueryClientProvider + Toaster providers - Dependencies: @supabase/supabase-js, @supabase/ssr, @tanstack/react-query, lucide-react, date-fns, sonner
This commit is contained in:
55
frontend/src/components/layout/Sidebar.tsx
Normal file
55
frontend/src/components/layout/Sidebar.tsx
Normal file
@@ -0,0 +1,55 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { usePathname } from "next/navigation";
|
||||
import {
|
||||
LayoutDashboard,
|
||||
FolderOpen,
|
||||
Clock,
|
||||
Calendar,
|
||||
Brain,
|
||||
Settings,
|
||||
} from "lucide-react";
|
||||
|
||||
const navigation = [
|
||||
{ name: "Dashboard", href: "/", icon: LayoutDashboard },
|
||||
{ name: "Akten", href: "/akten", icon: FolderOpen },
|
||||
{ name: "Fristen", href: "/fristen", icon: Clock },
|
||||
{ name: "Termine", href: "/termine", icon: Calendar },
|
||||
{ name: "AI Analyse", href: "/ai", icon: Brain },
|
||||
{ name: "Einstellungen", href: "/einstellungen", icon: Settings },
|
||||
];
|
||||
|
||||
export function Sidebar() {
|
||||
const pathname = usePathname();
|
||||
|
||||
return (
|
||||
<aside className="flex h-full w-56 flex-col border-r border-neutral-200 bg-white">
|
||||
<div className="flex h-14 items-center border-b border-neutral-200 px-4">
|
||||
<span className="text-sm font-semibold text-neutral-900">KanzlAI</span>
|
||||
</div>
|
||||
<nav className="flex-1 space-y-0.5 p-2">
|
||||
{navigation.map((item) => {
|
||||
const isActive =
|
||||
item.href === "/"
|
||||
? pathname === "/"
|
||||
: pathname.startsWith(item.href);
|
||||
return (
|
||||
<Link
|
||||
key={item.href}
|
||||
href={item.href}
|
||||
className={`flex items-center gap-2.5 rounded-md px-2.5 py-1.5 text-sm transition-colors ${
|
||||
isActive
|
||||
? "bg-neutral-100 font-medium text-neutral-900"
|
||||
: "text-neutral-600 hover:bg-neutral-50 hover:text-neutral-900"
|
||||
}`}
|
||||
>
|
||||
<item.icon className="h-4 w-4 shrink-0" />
|
||||
{item.name}
|
||||
</Link>
|
||||
);
|
||||
})}
|
||||
</nav>
|
||||
</aside>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user