img:first-child]:pt-0 data-[size=sm]:[--card-spacing:--spacing(3)] data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl",
+ className
+ )}
+ {...props}
+ />
+ )
+}
+
+function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function CardAction({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function CardContent({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+export {
+ Card,
+ CardHeader,
+ CardFooter,
+ CardTitle,
+ CardAction,
+ CardDescription,
+ CardContent,
+}
diff --git a/src/components/ui/dialog.tsx b/src/components/ui/dialog.tsx
new file mode 100644
index 0000000..014f5aa
--- /dev/null
+++ b/src/components/ui/dialog.tsx
@@ -0,0 +1,160 @@
+"use client"
+
+import * as React from "react"
+import { Dialog as DialogPrimitive } from "@base-ui/react/dialog"
+
+import { cn } from "@/lib/utils"
+import { Button } from "@/components/ui/button"
+import { XIcon } from "lucide-react"
+
+function Dialog({ ...props }: DialogPrimitive.Root.Props) {
+ return
+}
+
+function DialogTrigger({ ...props }: DialogPrimitive.Trigger.Props) {
+ return
+}
+
+function DialogPortal({ ...props }: DialogPrimitive.Portal.Props) {
+ return
+}
+
+function DialogClose({ ...props }: DialogPrimitive.Close.Props) {
+ return
+}
+
+function DialogOverlay({
+ className,
+ ...props
+}: DialogPrimitive.Backdrop.Props) {
+ return (
+
+ )
+}
+
+function DialogContent({
+ className,
+ children,
+ showCloseButton = true,
+ ...props
+}: DialogPrimitive.Popup.Props & {
+ showCloseButton?: boolean
+}) {
+ return (
+
+
+ {children}
+ {showCloseButton && (
+ Close
+
+ )}
+
+
+ )
+}
+
+function DialogHeader({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function DialogFooter({
+ className,
+ showCloseButton = false,
+ children,
+ ...props
+}: React.ComponentProps<"div"> & {
+ showCloseButton?: boolean
+}) {
+ return (
+
+ {children}
+ {showCloseButton && (
+
+ )
+}
+
+function DialogTitle({ className, ...props }: DialogPrimitive.Title.Props) {
+ return (
+
+ )
+}
+
+function DialogDescription({
+ className,
+ ...props
+}: DialogPrimitive.Description.Props) {
+ return (
+
+ )
+}
+
+export {
+ Dialog,
+ DialogClose,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogOverlay,
+ DialogPortal,
+ DialogTitle,
+ DialogTrigger,
+}
diff --git a/src/components/ui/dropdown-menu.tsx b/src/components/ui/dropdown-menu.tsx
new file mode 100644
index 0000000..9d5ebbd
--- /dev/null
+++ b/src/components/ui/dropdown-menu.tsx
@@ -0,0 +1,268 @@
+"use client"
+
+import * as React from "react"
+import { Menu as MenuPrimitive } from "@base-ui/react/menu"
+
+import { cn } from "@/lib/utils"
+import { ChevronRightIcon, CheckIcon } from "lucide-react"
+
+function DropdownMenu({ ...props }: MenuPrimitive.Root.Props) {
+ return
+}
+
+function DropdownMenuPortal({ ...props }: MenuPrimitive.Portal.Props) {
+ return
+}
+
+function DropdownMenuTrigger({ ...props }: MenuPrimitive.Trigger.Props) {
+ return
+}
+
+function DropdownMenuContent({
+ align = "start",
+ alignOffset = 0,
+ side = "bottom",
+ sideOffset = 4,
+ className,
+ ...props
+}: MenuPrimitive.Popup.Props &
+ Pick<
+ MenuPrimitive.Positioner.Props,
+ "align" | "alignOffset" | "side" | "sideOffset"
+ >) {
+ return (
+
+
+
+
+ )
+}
+
+function DropdownMenuGroup({ ...props }: MenuPrimitive.Group.Props) {
+ return
+}
+
+function DropdownMenuLabel({
+ className,
+ inset,
+ ...props
+}: MenuPrimitive.GroupLabel.Props & {
+ inset?: boolean
+}) {
+ return (
+
+ )
+}
+
+function DropdownMenuItem({
+ className,
+ inset,
+ variant = "default",
+ ...props
+}: MenuPrimitive.Item.Props & {
+ inset?: boolean
+ variant?: "default" | "destructive"
+}) {
+ return (
+
+ )
+}
+
+function DropdownMenuSub({ ...props }: MenuPrimitive.SubmenuRoot.Props) {
+ return
+}
+
+function DropdownMenuSubTrigger({
+ className,
+ inset,
+ children,
+ ...props
+}: MenuPrimitive.SubmenuTrigger.Props & {
+ inset?: boolean
+}) {
+ return (
+
+ {children}
+
+ )
+}
+
+function DropdownMenuSubContent({
+ align = "start",
+ alignOffset = -3,
+ side = "right",
+ sideOffset = 0,
+ className,
+ ...props
+}: React.ComponentProps
) {
+ return (
+
+
+
+
+
+ {children}
+
+ )
+}
+
+function DropdownMenuRadioGroup({ ...props }: MenuPrimitive.RadioGroup.Props) {
+ return (
+
+
+
+
+
+ {children}
+
+ )
+}
+
+function DropdownMenuSeparator({
+ className,
+ ...props
+}: MenuPrimitive.Separator.Props) {
+ return (
+
+ {children}
+
+ )
+}
+
+function SelectContent({
+ className,
+ children,
+ side = "bottom",
+ sideOffset = 4,
+ align = "center",
+ alignOffset = 0,
+ alignItemWithTrigger = true,
+ ...props
+}: SelectPrimitive.Popup.Props &
+ Pick<
+ SelectPrimitive.Positioner.Props,
+ "align" | "alignOffset" | "side" | "sideOffset" | "alignItemWithTrigger"
+ >) {
+ return (
+
+
+
+ {children}
+
+
+
+ )
+}
+
+function SelectLabel({
+ className,
+ ...props
+}: SelectPrimitive.GroupLabel.Props) {
+ return (
+
+
+ {children}
+
+
+ )
+}
+
+function SelectSeparator({
+ className,
+ ...props
+}: SelectPrimitive.Separator.Props) {
+ return (
+ ) {
+ return (
+
+
+ )
+}
+
+function SelectScrollDownButton({
+ className,
+ ...props
+}: React.ComponentProps) {
+ return (
+
+
+ )
+}
+
+export {
+ Select,
+ SelectContent,
+ SelectGroup,
+ SelectItem,
+ SelectLabel,
+ SelectScrollDownButton,
+ SelectScrollUpButton,
+ SelectSeparator,
+ SelectTrigger,
+ SelectValue,
+}
diff --git a/src/components/ui/separator.tsx b/src/components/ui/separator.tsx
new file mode 100644
index 0000000..6e1369e
--- /dev/null
+++ b/src/components/ui/separator.tsx
@@ -0,0 +1,25 @@
+"use client"
+
+import { Separator as SeparatorPrimitive } from "@base-ui/react/separator"
+
+import { cn } from "@/lib/utils"
+
+function Separator({
+ className,
+ orientation = "horizontal",
+ ...props
+}: SeparatorPrimitive.Props) {
+ return (
+
+
+ {children}
+ {showCloseButton && (
+ Close
+
+ )}
+
+
+ )
+}
+
+function SheetHeader({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function SheetFooter({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function SheetTitle({ className, ...props }: SheetPrimitive.Title.Props) {
+ return (
+ tr]:last:border-b-0",
+ className
+ )}
+ {...props}
+ />
+ )
+}
+
+function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
+ return (
+ ) {
+ return (
+ & {
+ spacing?: number
+ orientation?: "horizontal" | "vertical"
+ }
+>({
+ size: "default",
+ variant: "default",
+ spacing: 2,
+ orientation: "horizontal",
+})
+
+function ToggleGroup({
+ className,
+ variant,
+ size,
+ spacing = 2,
+ orientation = "horizontal",
+ children,
+ ...props
+}: ToggleGroupPrimitive.Props &
+ VariantProps & {
+ spacing?: number
+ orientation?: "horizontal" | "vertical"
+ }) {
+ return (
+
+
+ {children}
+
+
+ )
+}
+
+function ToggleGroupItem({
+ className,
+ children,
+ variant = "default",
+ size = "default",
+ ...props
+}: TogglePrimitive.Props & VariantProps) {
+ const context = React.useContext(ToggleGroupContext)
+
+ return (
+
+ {children}
+
+ )
+}
+
+export { ToggleGroup, ToggleGroupItem }
diff --git a/src/components/ui/toggle.tsx b/src/components/ui/toggle.tsx
new file mode 100644
index 0000000..555637b
--- /dev/null
+++ b/src/components/ui/toggle.tsx
@@ -0,0 +1,45 @@
+"use client"
+
+import { Toggle as TogglePrimitive } from "@base-ui/react/toggle"
+import { cva, type VariantProps } from "class-variance-authority"
+
+import { cn } from "@/lib/utils"
+
+const toggleVariants = cva(
+ "group/toggle inline-flex items-center justify-center gap-1 rounded-lg text-sm font-medium whitespace-nowrap transition-all outline-none hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-muted data-[state=on]:bg-muted dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+ {
+ variants: {
+ variant: {
+ default: "bg-transparent",
+ outline: "border border-input bg-transparent hover:bg-muted",
+ },
+ size: {
+ default:
+ "h-8 min-w-8 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+ sm: "h-7 min-w-7 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+ lg: "h-9 min-w-9 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+ },
+ },
+ defaultVariants: {
+ variant: "default",
+ size: "default",
+ },
+ }
+)
+
+function Toggle({
+ className,
+ variant = "default",
+ size = "default",
+ ...props
+}: TogglePrimitive.Props & VariantProps) {
+ return (
+
+
+
+ {children}
+
+
+
+ )
+}
+
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
diff --git a/src/hooks/use-media-query.ts b/src/hooks/use-media-query.ts
new file mode 100644
index 0000000..77d0289
--- /dev/null
+++ b/src/hooks/use-media-query.ts
@@ -0,0 +1,26 @@
+"use client";
+
+import * as React from "react";
+
+/**
+ * Liest eine Media Query ohne Hydration-Mismatch: Auf dem Server ist das Ergebnis
+ * immer `false`, der Client aktualisiert direkt nach der Hydration.
+ */
+export function useMediaQuery(query: string) {
+ const subscribe = React.useCallback(
+ (onChange: () => void) => {
+ const list = window.matchMedia(query);
+ list.addEventListener("change", onChange);
+ return () => list.removeEventListener("change", onChange);
+ },
+ [query],
+ );
+
+ return React.useSyncExternalStore(
+ subscribe,
+ () => window.matchMedia(query).matches,
+ () => false,
+ );
+}
+
+export const useIsMobile = () => useMediaQuery("(max-width: 767px)");
diff --git a/src/lib/data.ts b/src/lib/data.ts
new file mode 100644
index 0000000..5d7a01b
--- /dev/null
+++ b/src/lib/data.ts
@@ -0,0 +1,133 @@
+import {
+ UNDELIVERED_AFTER_MS,
+ type Order,
+ type OrderStatus,
+ type OrderType,
+ type PaymentMethod,
+ type Restaurant,
+} from "./types";
+
+const restaurants: Restaurant[] = [
+ {
+ name: "Muster Ristorante",
+ city: "Taben-Rodt",
+ hours: "10:00 bis 23:00",
+ phone1: "+49 6582 123456",
+ phone2: "+49 6582 123457",
+ mobile: "+49 171 2223344",
+ orderUrl: "https://order.speisekarte24.de/muster-ristorante",
+ },
+ {
+ name: "Pizzeria Da Vinci",
+ city: "Trier",
+ hours: "11:00 bis 22:30",
+ phone1: "+49 651 998877",
+ mobile: "+49 160 5544332",
+ orderUrl: "https://order.speisekarte24.de/da-vinci",
+ },
+ {
+ name: "Sushi Yama",
+ city: "Saarbrücken",
+ hours: "12:00 bis 23:00",
+ phone1: "+49 681 445566",
+ phone2: "+49 681 445567",
+ mobile: "+49 175 1112233",
+ orderUrl: "https://order.speisekarte24.de/sushi-yama",
+ },
+ {
+ name: "Burger Station",
+ city: "Konz",
+ hours: "11:30 bis 21:00",
+ phone1: "+49 6501 334455",
+ mobile: "+49 152 9988776",
+ orderUrl: "https://order.speisekarte24.de/burger-station",
+ },
+ {
+ name: "Athen Grill",
+ city: "Wittlich",
+ hours: "17:00 bis 23:30",
+ phone1: "+49 6571 220011",
+ orderUrl: "https://order.speisekarte24.de/athen-grill",
+ },
+];
+
+const customers = [
+ { name: "Test Tester", email: "agentur@speisekarte24.de", phone: "+49 170 1234567" },
+ { name: "Anna Berger", email: "anna.berger@example.com", phone: "+49 151 2345678" },
+ { name: "Murat Yilmaz", email: "m.yilmaz@example.com", phone: "+49 176 3456789" },
+ { name: "Sophie Klein", email: "sophie.klein@example.com", phone: "+49 152 4567890" },
+ { name: "Lukas Weber", email: "lukas.weber@example.com", phone: "+49 160 5678901" },
+ { name: "Nina Hoffmann", email: "nina.h@example.com", phone: "+49 171 6789012" },
+ { name: "Jonas Krämer", email: "j.kraemer@example.com", phone: "+49 175 7890123" },
+ { name: "Elif Demir", email: "elif.demir@example.com", phone: "+49 157 8901234" },
+];
+
+/** Status für Bestellungen, die bereits bearbeitet wurden. */
+const handledStatuses: OrderStatus[] = [
+ "uebermittelt",
+ "uebermittelt",
+ "uebermittelt",
+ "telefonisch",
+ "telefonisch",
+ "rueckruf",
+ "storniert",
+ "fake",
+];
+
+/**
+ * Ältere Bestellungen mit diesem Index bleiben `neu` und kippen dadurch über die
+ * 15-Minuten-Regel auf "Nicht übermittelt" – bewusst nur eine Handvoll.
+ */
+const undeliveredIndexes = new Set([4, 11, 23]);
+
+const types: OrderType[] = ["vorbestellung", "direktanruf"];
+const payments: PaymentMethod[] = ["bar", "ec", "paypal", "kreditkarte"];
+
+/** Deterministischer PRNG, damit Server- und Client-Render identisch sind. */
+function seeded(seed: number) {
+ let s = seed;
+ return () => {
+ s = (s * 1664525 + 1013904223) % 4294967296;
+ return s / 4294967296;
+ };
+}
+
+/**
+ * Erzeugt Demo-Bestellungen relativ zu `now`, damit die jüngsten Aufträge innerhalb
+ * des 15-Minuten-Fensters liegen und ältere als nicht übermittelt gelten.
+ */
+export function createOrders(now: number, count = 42): Order[] {
+ const rand = seeded(20260804);
+
+ return Array.from({ length: count }, (_, i) => {
+ const ageMinutes = i * 6 + Math.floor(rand() * 4);
+ const receivedAt = new Date(now - ageMinutes * 60_000);
+ const dueAt = new Date(receivedAt.getTime() + (20 + Math.floor(rand() * 55)) * 60_000);
+ const fresh = ageMinutes * 60_000 < UNDELIVERED_AFTER_MS;
+ const handled = handledStatuses[Math.floor(rand() * handledStatuses.length)];
+ const open = fresh || undeliveredIndexes.has(i);
+ // Bearbeitete Bestellungen wurden innerhalb der Eskalationsfrist bestätigt.
+ const confirmedAt = open
+ ? undefined
+ : new Date(receivedAt.getTime() + (1 + Math.floor(rand() * 12)) * 60_000).toISOString();
+
+ return {
+ id: `ord_${1000 + i}`,
+ number: count - i,
+ // Frische Bestellungen dürfen offen sein, ältere nur die ausgewählten drei.
+ status: open ? "neu" : handled,
+ type: types[Math.floor(rand() * types.length)],
+ restaurant: restaurants[Math.floor(rand() * restaurants.length)],
+ customer: customers[Math.floor(rand() * customers.length)],
+ receivedAt: receivedAt.toISOString(),
+ dueAt: dueAt.toISOString(),
+ total: Math.round((6 + rand() * 60) * 100) / 100,
+ itemCount: 1 + Math.floor(rand() * 7),
+ payment: payments[Math.floor(rand() * payments.length)],
+ pdfUrl: `/bestellungen/ord_${1000 + i}.pdf`,
+ externalUrl: `https://backoffice.speisekarte24.de/bestellungen/${1000 + i}`,
+ confirmedAt,
+ events: [],
+ } satisfies Order;
+ });
+}
diff --git a/src/lib/format.ts b/src/lib/format.ts
new file mode 100644
index 0000000..b682f50
--- /dev/null
+++ b/src/lib/format.ts
@@ -0,0 +1,12 @@
+const currency = new Intl.NumberFormat("de-DE", { style: "currency", currency: "EUR" });
+const time = new Intl.DateTimeFormat("de-DE", { hour: "2-digit", minute: "2-digit" });
+const date = new Intl.DateTimeFormat("de-DE", { day: "2-digit", month: "2-digit", year: "numeric" });
+
+export const formatCurrency = (value: number) => currency.format(value);
+export const formatTime = (iso: string) => time.format(new Date(iso));
+export const formatDate = (iso: string) => date.format(new Date(iso));
+
+/** "tel:" bzw. "https://wa.me/" Links brauchen die Nummer ohne Leer- und Sonderzeichen. */
+export const telHref = (phone: string) => `tel:${phone.replace(/[^\d+]/g, "")}`;
+export const whatsAppHref = (phone: string) =>
+ `https://wa.me/${phone.replace(/[^\d]/g, "")}`;
diff --git a/src/lib/timeline.ts b/src/lib/timeline.ts
new file mode 100644
index 0000000..004bc2e
--- /dev/null
+++ b/src/lib/timeline.ts
@@ -0,0 +1,151 @@
+import {
+ ATTEMPT_COUNT,
+ ATTEMPT_INTERVAL_MS,
+ UNDELIVERED_AFTER_MS,
+ type Order,
+ type OrderAction,
+} from "./types";
+
+export type StepState =
+ /** Ist passiert. */
+ | "done"
+ /** Steht jetzt an und wartet auf eine Bearbeiterin. */
+ | "due"
+ /** Kommt später automatisch. */
+ | "pending"
+ /** Entfällt, weil der Gastronom vorher bestätigt hat. */
+ | "skipped";
+
+export type TimelineStep = {
+ id: string;
+ label: string;
+ /** Kurzform für die Tabellenspalte. */
+ short: string;
+ description?: string;
+ /** Zeitpunkt des Ereignisses bzw. geplanter Zeitpunkt. */
+ at?: number;
+ state: StepState;
+ /** Eskalationsstufe – wird rot dargestellt. */
+ danger?: boolean;
+ /** Manuelle Schritte tragen die Aktion, die der Button auslöst. */
+ action?: OrderAction;
+};
+
+/**
+ * Eskalationskette einer Bestellung: drei automatische Übermittlungsversuche, danach der
+ * Tag "Nicht übermittelt" und die manuellen Stufen Voice-Message, Direktanruf und SOS.
+ */
+export function buildTimeline(order: Order, now: number): TimelineStep[] {
+ const received = Date.parse(order.receivedAt);
+ const confirmed = order.confirmedAt ? Date.parse(order.confirmedAt) : null;
+ const taggedAt = received + UNDELIVERED_AFTER_MS;
+ const eventAt = (type: OrderAction) => {
+ const event = order.events.find((e) => e.type === type);
+ return event ? Date.parse(event.at) : null;
+ };
+
+ const steps: TimelineStep[] = [
+ {
+ id: "ordered",
+ label: order.type === "vorbestellung" ? "Vorbestellung geplant" : "Bestellung eingegangen",
+ short: order.type === "vorbestellung" ? "Geplant" : "Eingegangen",
+ description:
+ order.type === "vorbestellung"
+ ? `Gewünscht ${new Date(order.dueAt).toLocaleTimeString("de-DE", {
+ hour: "2-digit",
+ minute: "2-digit",
+ })} Uhr`
+ : undefined,
+ at: received,
+ state: "done",
+ },
+ ];
+
+ for (let n = 1; n <= ATTEMPT_COUNT; n++) {
+ const at = received + (n - 1) * ATTEMPT_INTERVAL_MS;
+ steps.push({
+ id: `attempt_${n}`,
+ label: `${n}. Übermittlung an Gastronom`,
+ short: `${n}. Übermittlung`,
+ description: confirmed && confirmed <= at ? "Entfällt – bereits bestätigt" : undefined,
+ at,
+ state: confirmed && confirmed <= at ? "skipped" : now >= at ? "done" : "pending",
+ });
+ }
+
+ if (confirmed) {
+ steps.push({
+ id: "confirmed",
+ label: "Gastronom hat bestätigt",
+ short: "Bestätigt",
+ at: confirmed,
+ state: "done",
+ });
+ return steps;
+ }
+
+ const tagged = now >= taggedAt;
+ steps.push({
+ id: "tagged",
+ label: 'Tag "Nicht übermittelt"',
+ short: "Nicht übermittelt",
+ description: "15 Minuten ohne Reaktion",
+ at: taggedAt,
+ state: tagged ? "done" : "pending",
+ danger: true,
+ });
+
+ const manual: {
+ id: string;
+ label: string;
+ short: string;
+ action: OrderAction;
+ danger?: boolean;
+ }[] = [
+ {
+ id: "voice",
+ label: "Manuelle Voice-Message an Gastronom",
+ short: "Voice-Message",
+ action: "gastronom_voice",
+ },
+ {
+ id: "call",
+ label: "Direktanruf beim Gastronom",
+ short: "Direktanruf",
+ action: "gastronom_anruf",
+ },
+ {
+ id: "sos",
+ label: "SOS: Stornieren & Gastronom für heute schließen",
+ short: "SOS",
+ action: "sos",
+ danger: true,
+ },
+ ];
+
+ let previousDone = tagged;
+ for (const step of manual) {
+ const at = eventAt(step.action);
+ steps.push({
+ ...step,
+ at: at ?? undefined,
+ state: at ? "done" : previousDone ? "due" : "pending",
+ });
+ previousDone = at !== null;
+ }
+
+ return steps;
+}
+
+/**
+ * Der Punkt, an dem die Bestellung gerade steht: der fällige Schritt, sonst der zuletzt
+ * erledigte. Treibt die Verlaufsspalte der Tabelle.
+ */
+export function currentStep(order: Order, now: number): TimelineStep {
+ const steps = buildTimeline(order, now);
+ const due = steps.find((step) => step.state === "due");
+ if (due) return due;
+
+ const done = steps.filter((step) => step.state === "done");
+ return done[done.length - 1] ?? steps[0];
+}
diff --git a/src/lib/types.ts b/src/lib/types.ts
new file mode 100644
index 0000000..e5c6a7f
--- /dev/null
+++ b/src/lib/types.ts
@@ -0,0 +1,109 @@
+export type OrderStatus =
+ | "neu"
+ | "uebermittelt"
+ | "telefonisch"
+ | "nicht_uebermittelt"
+ | "rueckruf"
+ | "storniert"
+ | "fake";
+
+export type OrderType = "vorbestellung" | "direktanruf";
+
+/** Alles, was eine Bearbeiterin an einer Bestellung auslösen kann. */
+export type OrderAction =
+ | "uebermittelt"
+ | "gastronom_voice"
+ | "gastronom_anruf"
+ | "kunde_anrufen"
+ | "nicht_uebermittelt"
+ | "rueckruf"
+ | "storno"
+ | "fake"
+ | "stornieren"
+ | "sos"
+ | "telefonisch_uebermittelt";
+
+/** Protokolleintrag einer ausgelösten Aktion, treibt die Timeline. */
+export type OrderEvent = { type: OrderAction; at: string };
+
+export type PaymentMethod = "bar" | "ec" | "paypal" | "kreditkarte";
+
+export type Restaurant = {
+ name: string;
+ city: string;
+ /** Öffnungszeiten, z. B. "10:00 bis 23:00" */
+ hours: string;
+ phone1: string;
+ phone2?: string;
+ mobile?: string;
+ orderUrl: string;
+};
+
+export type Customer = {
+ name: string;
+ email: string;
+ phone: string;
+};
+
+export type Order = {
+ id: string;
+ /** Fortlaufende Bestellnummer, wird in der Liste als erste Spalte gezeigt */
+ number: number;
+ status: OrderStatus;
+ type: OrderType;
+ restaurant: Restaurant;
+ customer: Customer;
+ /** Zeitpunkt des Bestelleingangs, ISO-String */
+ receivedAt: string;
+ /** Gewünschte Liefer- bzw. Abholzeit, ISO-String */
+ dueAt: string;
+ total: number;
+ itemCount: number;
+ payment: PaymentMethod;
+ pdfUrl: string;
+ /** Bestellung im externen Backoffice, öffnet in neuem Tab. */
+ externalUrl: string;
+ note?: string;
+ /** Zeitpunkt, zu dem der Gastronom die Bestellung bestätigt hat. */
+ confirmedAt?: string;
+ /** Manuell ausgelöste Schritte, ältester zuerst. */
+ events: OrderEvent[];
+};
+
+export const STATUS_LABEL: Record = {
+ neu: "Neu",
+ uebermittelt: "Übermittelt",
+ telefonisch: "Telefonisch übermittelt",
+ nicht_uebermittelt: "Nicht übermittelt",
+ rueckruf: "Rückrufhinweis",
+ storniert: "Storniert",
+ fake: "Fake",
+};
+
+export const TYPE_LABEL: Record = {
+ vorbestellung: "Vorbestellung",
+ direktanruf: "Direktanruf",
+};
+
+export const PAYMENT_LABEL: Record = {
+ bar: "Bar",
+ ec: "EC-Karte",
+ paypal: "PayPal",
+ kreditkarte: "Kreditkarte",
+};
+
+/** Abstand zwischen den drei automatischen Übermittlungsversuchen. */
+export const ATTEMPT_INTERVAL_MS = 5 * 60 * 1000;
+export const ATTEMPT_COUNT = 3;
+
+/** Nach dieser Zeit ohne Bearbeitung gilt eine Bestellung als nicht übermittelt. */
+export const UNDELIVERED_AFTER_MS = 15 * 60 * 1000;
+
+/**
+ * Eine unbearbeitete Bestellung kippt nach {@link UNDELIVERED_AFTER_MS} automatisch auf
+ * `nicht_uebermittelt`. Sobald jemand eine Aktion ausgelöst hat, bleibt der echte Status stehen.
+ */
+export function effectiveStatus(order: Order, now: number): OrderStatus {
+ const overdue = now - new Date(order.receivedAt).getTime() >= UNDELIVERED_AFTER_MS;
+ return order.status === "neu" && overdue ? "nicht_uebermittelt" : order.status;
+}
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
new file mode 100644
index 0000000..bd0c391
--- /dev/null
+++ b/src/lib/utils.ts
@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+ return twMerge(clsx(inputs))
+}