feat: Initial implementation of Annas Rechnungsmanager

Full-stack German accounting & invoice management web application: - Multi-company management (Mandantenverwaltung) with full CRUD - Invoice creation with dynamic line items and automatic tax calculation - Sequential invoice numbering per company (RE-2024-001 format) - §14 UStG compliant PDF invoice generation via @react-pdf/renderer - Customer management (Kundenverwaltung) per company - Tax reports: quarterly USt-Voranmeldung and monthly revenue overview - Email/password authentication via NextAuth.js v5 - Responsive, modern UI with Tailwind CSS and custom shadcn/ui components - Prisma v5 ORM with MySQL/MariaDB schema + demo seed data Stack: Next.js 14 (App Router) · TypeScript · Prisma/MySQL · NextAuth.js https://claude.ai/code/session_01FN53KKxo5ebrGwqFhxzkT9
2026-03-07 17:27:57 +00:00
commit 44e79e657f
65 changed files with 12722 additions and 0 deletions
@@ -0,0 +1,83 @@
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { signOut } from "next-auth/react";
+import {
+  Calculator,
+  Building2,
+  FileText,
+  LayoutDashboard,
+  LogOut,
+  ChevronRight,
+} from "lucide-react";
+import { cn } from "@/lib/utils";
+import { Button } from "@/components/ui/button";
+
+interface NavItem {
+  label: string;
+  href: string;
+  icon: React.ReactNode;
+}
+
+const navItems: NavItem[] = [
+  { label: "Dashboard", href: "/", icon: <LayoutDashboard className="h-4 w-4" /> },
+  { label: "Mandanten", href: "/companies", icon: <Building2 className="h-4 w-4" /> },
+];
+
+export function Sidebar({ userName }: { userName?: string | null }) {
+  const pathname = usePathname();
+
+  return (
+    <aside className="w-60 shrink-0 flex flex-col bg-white border-r border-gray-200 min-h-screen">
+      {/* Logo */}
+      <div className="flex items-center gap-3 px-4 py-5 border-b border-gray-200">
+        <div className="flex items-center justify-center w-8 h-8 rounded-lg bg-indigo-600">
+          <Calculator className="w-4 h-4 text-white" />
+        </div>
+        <span className="font-semibold text-gray-900 text-sm leading-tight">
+          Rechnungs-<br />manager
+        </span>
+      </div>
+
+      {/* Nav */}
+      <nav className="flex-1 px-3 py-4 space-y-0.5">
+        {navItems.map((item) => {
+          const active = pathname === item.href || (item.href !== "/" && pathname.startsWith(item.href));
+          return (
+            <Link
+              key={item.href}
+              href={item.href}
+              className={cn(
+                "flex items-center gap-3 rounded-lg px-3 py-2 text-sm font-medium transition-colors",
+                active
+                  ? "bg-indigo-50 text-indigo-700"
+                  : "text-gray-600 hover:bg-gray-100 hover:text-gray-900"
+              )}
+            >
+              {item.icon}
+              {item.label}
+              {active && <ChevronRight className="ml-auto h-3 w-3 text-indigo-400" />}
+            </Link>
+          );
+        })}
+      </nav>
+
+      {/* User */}
+      <div className="px-3 py-4 border-t border-gray-200">
+        {userName && (
+          <p className="text-xs text-gray-500 px-3 mb-2 truncate">{userName}</p>
+        )}
+        <Button
+          variant="ghost"
+          size="sm"
+          className="w-full justify-start text-gray-600 hover:text-red-600 hover:bg-red-50"
+          onClick={() => signOut({ callbackUrl: "/login" })}
+        >
+          <LogOut className="h-4 w-4" />
+          Abmelden
+        </Button>
+      </div>
+    </aside>
+  );
+}