@hub-kit/core 0.3.0

package/dist/pages/invoice-list/use-table-view.js

@@ -0,0 +1,54 @@
+import { useMemo, useState } from "react";
+export function useTableView(rows, options) {
+    const { sortValue, initialSort, initialDirection = "asc", initialPageSize = 25, resetKey, } = options;
+    const [sort, setSortState] = useState(initialSort);
+    const [direction, setDirectionState] = useState(initialDirection);
+    const [page, setPage] = useState(1);
+    const [pageSize, setPageSize] = useState(initialPageSize);
+    const [seenResetKey, setSeenResetKey] = useState(resetKey);
+    if (resetKey !== seenResetKey) {
+        setSeenResetKey(resetKey);
+        setPage(1);
+    }
+    const sortedRows = useMemo(() => {
+        const copy = [...rows];
+        copy.sort((first, second) => {
+            const firstValue = sortValue(first, sort);
+            const secondValue = sortValue(second, sort);
+            const comparison = typeof firstValue === "number" && typeof secondValue === "number"
+                ? firstValue - secondValue
+                : String(firstValue).localeCompare(String(secondValue));
+            return direction === "asc" ? comparison : -comparison;
+        });
+        return copy;
+    }, [rows, sort, direction, sortValue]);
+    const total = sortedRows.length;
+    const totalPages = Math.max(1, Math.ceil(total / pageSize));
+    const safePage = Math.min(page, totalPages);
+    const from = total === 0 ? 0 : (safePage - 1) * pageSize + 1;
+    const to = Math.min(safePage * pageSize, total);
+    const pageRows = sortedRows.slice((safePage - 1) * pageSize, safePage * pageSize);
+    function setSort(key) {
+        setSortState(key);
+        setPage(1);
+    }
+    function setDirection(next) {
+        setDirectionState(next);
+        setPage(1);
+    }
+    return {
+        pageRows,
+        sort,
+        direction,
+        setSort,
+        setDirection,
+        page: safePage,
+        setPage,
+        pageSize,
+        setPageSize,
+        total,
+        totalPages,
+        from,
+        to,
+    };
+}

package/dist/pages/invoice-upload/InvoiceUploadPage.d.ts

@@ -0,0 +1,7 @@
+import type { InvoiceUploadAdapter } from "../../adapters/invoice-upload";
+import { type InvoiceUploadLabels } from "./labels";
+export interface InvoiceUploadPageProps {
+    adapter: InvoiceUploadAdapter;
+    labels?: InvoiceUploadLabels;
+}
+export declare function InvoiceUploadPage({ adapter, labels }: InvoiceUploadPageProps): import("react").JSX.Element;

package/dist/pages/invoice-upload/InvoiceUploadPage.js

@@ -0,0 +1,115 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useRef, useState } from "react";
+import { ArrowLeft, FileCheck2, FileText, Loader2, Trash2, UploadCloud } from "lucide-react";
+import { toast } from "sonner";
+import { Button } from "../../ui/button.js";
+import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, } from "../../ui/alert-dialog.js";
+import { readableErrorMessage } from "../../components/feedback/query-states.js";
+import { cn } from "../../lib/class-names.js";
+import { englishInvoiceUploadLabels } from "./labels.js";
+function formatSize(bytes) {
+    if (bytes < 1024)
+        return `${bytes} B`;
+    if (bytes < 1024 * 1024)
+        return `${(bytes / 1024).toFixed(0)} KB`;
+    return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
+function newId() {
+    return `f-${Math.random().toString(36).slice(2, 9)}`;
+}
+function isAccepted(name, extensions) {
+    const lower = name.toLowerCase();
+    return extensions.some((ext) => lower.endsWith(ext));
+}
+export function InvoiceUploadPage({ adapter, labels = englishInvoiceUploadLabels }) {
+    const inputRef = useRef(null);
+    const [dragOver, setDragOver] = useState(false);
+    const [files, setFiles] = useState([]);
+    const [uploading, setUploading] = useState(false);
+    const controllers = useRef(new Map());
+    function addFiles(list) {
+        const array = Array.from(list);
+        const tooBig = array.filter((f) => f.size > adapter.maxFileSizeBytes);
+        const accepted = array.filter((f) => isAccepted(f.name, adapter.acceptedExtensions) && f.size <= adapter.maxFileSizeBytes);
+        const rejected = array.length - accepted.length;
+        if (tooBig.length > 0)
+            toast.error(labels.toastTooBig(tooBig.length, formatSize(adapter.maxFileSizeBytes)));
+        else if (rejected > 0)
+            toast.error(labels.toastIgnored(rejected));
+        if (accepted.length === 0)
+            return;
+        setFiles((prev) => [
+            ...prev,
+            ...accepted.map((f) => ({ id: newId(), file: f, name: f.name, size: f.size, phase: "queued", progress: 0 })),
+        ]);
+    }
+    function removeFile(id) {
+        controllers.current.get(id)?.abort();
+        setFiles((prev) => prev.filter((f) => f.id !== id));
+    }
+    function cancelFile(id) {
+        controllers.current.get(id)?.abort();
+    }
+    async function upload() {
+        const queued = files.filter((f) => f.phase === "queued");
+        if (queued.length === 0)
+            return;
+        setUploading(true);
+        try {
+            const inputs = [];
+            for (const f of queued) {
+                const invoiceId = crypto.randomUUID();
+                setFiles((prev) => prev.map((x) => (x.id === f.id ? { ...x, phase: "uploading", progress: 0 } : x)));
+                const controller = new AbortController();
+                controllers.current.set(f.id, controller);
+                let result;
+                try {
+                    result = await adapter.uploadFile(f.file, {
+                        signal: controller.signal,
+                        onProgress: (percent) => setFiles((prev) => prev.map((x) => (x.id === f.id ? { ...x, progress: percent } : x))),
+                    });
+                }
+                catch (error) {
+                    setFiles((prev) => prev.map((x) => (x.id === f.id ? { ...x, phase: "queued", progress: 0 } : x)));
+                    throw error;
+                }
+                finally {
+                    controllers.current.delete(f.id);
+                }
+                inputs.push({
+                    invoiceId,
+                    filename: f.name,
+                    mime: result.mime,
+                    size: result.sizeBytes,
+                    storageBucket: result.storageBucket,
+                    storagePath: result.storagePath,
+                    checksumSha256: result.checksumSha256,
+                });
+            }
+            await adapter.createInvoices(inputs);
+            setFiles((prev) => prev.map((f) => (f.phase === "uploading" ? { ...f, phase: "done" } : f)));
+            toast.success(labels.toastSaved(queued.length));
+        }
+        catch (error) {
+            toast.error(labels.toastFailed(readableErrorMessage(error, "")));
+        }
+        finally {
+            setUploading(false);
+        }
+    }
+    const queuedCount = files.filter((f) => f.phase === "queued").length;
+    const hasDone = files.some((f) => f.phase === "done");
+    return (_jsxs("div", { className: "mx-auto max-w-3xl", children: [_jsxs("button", { type: "button", onClick: adapter.openInvoiceList, className: "inline-flex items-center gap-1.5 text-sm text-muted-foreground transition-colors hover:text-foreground", children: [_jsx(ArrowLeft, { className: "size-4" }), " ", labels.back] }), _jsxs("div", { className: "mt-2", children: [_jsx("h1", { className: "mt-2 text-2xl font-semibold tracking-tight text-foreground", children: labels.title }), _jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: labels.subtitle })] }), _jsxs("div", { onDragOver: (event) => {
+                    event.preventDefault();
+                    setDragOver(true);
+                }, onDragLeave: () => setDragOver(false), onDrop: (event) => {
+                    event.preventDefault();
+                    setDragOver(false);
+                    if (event.dataTransfer.files?.length)
+                        addFiles(event.dataTransfer.files);
+                }, className: cn("mt-6 flex flex-col items-center justify-center gap-3 rounded-2xl border-2 border-dashed px-6 py-14 text-center transition-colors", dragOver ? "border-brand bg-brand-wash" : "border-border bg-muted/30 hover:border-brand-soft"), children: [_jsx("span", { className: cn("grid size-14 place-items-center rounded-full transition-colors", dragOver ? "bg-brand text-primary-foreground" : "bg-brand-wash text-brand-dark"), children: _jsx(UploadCloud, { className: "size-7" }) }), _jsxs("div", { children: [_jsx("p", { className: "text-sm font-medium text-foreground", children: dragOver ? labels.dropRelease : labels.dropHint }), _jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: labels.fileTypes })] }), _jsx(Button, { variant: "outline", className: "mt-1", onClick: () => inputRef.current?.click(), children: labels.chooseFiles }), _jsx("input", { ref: inputRef, type: "file", multiple: true, accept: adapter.acceptedExtensions.join(","), className: "hidden", onChange: (event) => {
+                            if (event.target.files?.length)
+                                addFiles(event.target.files);
+                            event.target.value = "";
+                        } })] }), files.length > 0 && (_jsxs("div", { className: "mt-6 overflow-hidden rounded-xl border border-border bg-card", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-border px-4 py-3", children: [_jsx("span", { className: "text-sm font-medium text-foreground", children: labels.selectedCount(files.length) }), _jsxs(AlertDialog, { children: [_jsx(AlertDialogTrigger, { asChild: true, children: _jsx("button", { type: "button", className: "text-xs font-medium text-muted-foreground underline-offset-4 hover:text-foreground hover:underline", children: labels.removeAll }) }), _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: labels.removeAllTitle }), _jsx(AlertDialogDescription, { children: labels.removeAllDescription })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: labels.removeAllCancel }), _jsx(AlertDialogAction, { onClick: () => setFiles([]), className: "bg-destructive text-destructive-foreground hover:bg-destructive/90", children: labels.removeAllConfirm })] })] })] })] }), _jsx("ul", { className: "divide-y divide-border", children: files.map((f) => (_jsxs("li", { className: "flex items-center gap-3 px-4 py-3", children: [_jsx("span", { className: "grid size-9 shrink-0 place-items-center rounded-md bg-muted text-muted-foreground", children: f.phase === "done" ? _jsx(FileCheck2, { className: "size-4 text-brand" }) : _jsx(FileText, { className: "size-4" }) }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "truncate text-sm font-medium text-foreground", children: f.name }), _jsxs("div", { className: "text-xs text-muted-foreground", children: [formatSize(f.size), f.phase === "done" && _jsx("span", { className: "ml-1 text-brand-dark", children: labels.savedTag }), f.phase === "uploading" && _jsxs("span", { className: "ml-1 tabular-nums", children: [f.progress, "%"] })] }), f.phase === "uploading" && (_jsx("div", { className: "mt-1.5 h-1 overflow-hidden rounded-full bg-muted", children: _jsx("div", { className: "h-full rounded-full bg-primary transition-[width]", style: { width: `${f.progress}%` } }) }))] }), f.phase === "uploading" && (_jsx("button", { type: "button", onClick: () => cancelFile(f.id), className: "rounded-md px-2 py-1 text-xs font-medium text-muted-foreground transition-colors hover:bg-accent hover:text-foreground", children: labels.cancelFile })), f.phase === "queued" && (_jsx("button", { type: "button", onClick: () => removeFile(f.id), "aria-label": labels.removeFile, className: "grid size-8 place-items-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-foreground", children: _jsx(Trash2, { className: "size-4" }) }))] }, f.id))) })] })), _jsxs("div", { className: "mt-6 flex flex-wrap items-center justify-end gap-3", children: [_jsx(Button, { variant: "outline", onClick: adapter.openInvoiceList, children: hasDone ? labels.toOverview : labels.cancel }), _jsx(Button, { className: "gap-2", onClick: upload, disabled: queuedCount === 0 || uploading, children: uploading ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "size-4 animate-spin" }), " ", labels.uploading] })) : (_jsxs(_Fragment, { children: [_jsx(UploadCloud, { className: "size-4" }), " ", queuedCount > 0 ? labels.uploadCount(queuedCount) : labels.uploadGeneric] })) })] }), _jsx("p", { className: "mt-4 text-xs text-muted-foreground", children: labels.footer })] }));
+}

package/dist/pages/invoice-upload/index.d.ts

@@ -0,0 +1,4 @@
+export { InvoiceUploadPage } from "./InvoiceUploadPage";
+export type { InvoiceUploadPageProps } from "./InvoiceUploadPage";
+export { englishInvoiceUploadLabels } from "./labels";
+export type { InvoiceUploadLabels } from "./labels";

package/dist/pages/invoice-upload/index.js

@@ -0,0 +1,2 @@
+export { InvoiceUploadPage } from "./InvoiceUploadPage.js";
+export { englishInvoiceUploadLabels } from "./labels.js";

package/dist/pages/invoice-upload/labels.d.ts

@@ -0,0 +1,29 @@
+export interface InvoiceUploadLabels {
+    back: string;
+    title: string;
+    subtitle: string;
+    dropHint: string;
+    dropRelease: string;
+    fileTypes: string;
+    chooseFiles: string;
+    selectedCount: (count: number) => string;
+    removeAll: string;
+    removeAllTitle: string;
+    removeAllDescription: string;
+    removeAllCancel: string;
+    removeAllConfirm: string;
+    savedTag: string;
+    cancelFile: string;
+    removeFile: string;
+    toOverview: string;
+    cancel: string;
+    uploading: string;
+    uploadCount: (count: number) => string;
+    uploadGeneric: string;
+    footer: string;
+    toastTooBig: (count: number, limit: string) => string;
+    toastIgnored: (count: number) => string;
+    toastSaved: (count: number) => string;
+    toastFailed: (error: string) => string;
+}
+export declare const englishInvoiceUploadLabels: InvoiceUploadLabels;

package/dist/pages/invoice-upload/labels.js

@@ -0,0 +1,28 @@
+export const englishInvoiceUploadLabels = {
+    back: "Back",
+    title: "Upload invoices",
+    subtitle: "Add invoices by hand instead of waiting for the pipeline to pick them up.",
+    dropHint: "Drag files here",
+    dropRelease: "Release to add",
+    fileTypes: "PDF, JPG, PNG, XML",
+    chooseFiles: "Choose files",
+    selectedCount: (count) => `${count} file${count === 1 ? "" : "s"} selected`,
+    removeAll: "Remove all",
+    removeAllTitle: "Remove all files?",
+    removeAllDescription: "This clears the list. Nothing has been uploaded yet.",
+    removeAllCancel: "Cancel",
+    removeAllConfirm: "Remove all",
+    savedTag: "Saved",
+    cancelFile: "Cancel",
+    removeFile: "Remove",
+    toOverview: "Back to invoices",
+    cancel: "Cancel",
+    uploading: "Uploading…",
+    uploadCount: (count) => `Upload ${count}`,
+    uploadGeneric: "Upload",
+    footer: "Files are queued here first; nothing is saved until you press Upload.",
+    toastTooBig: (count, limit) => `${count} file${count === 1 ? " is" : "s are"} larger than ${limit} and were skipped.`,
+    toastIgnored: (count) => `${count} file${count === 1 ? " was" : "s were"} an unsupported type and were skipped.`,
+    toastSaved: (count) => `${count} file${count === 1 ? "" : "s"} uploaded.`,
+    toastFailed: (error) => `Upload failed: ${error}`,
+};

package/dist/pages/manual-bookings/ManualBookingsPage.d.ts

@@ -0,0 +1,7 @@
+import type { ManualBookingsAdapter } from "../../adapters/manual-bookings";
+import { type ManualBookingsLabels } from "./labels";
+export interface ManualBookingsPageProps {
+    adapter: ManualBookingsAdapter;
+    labels?: ManualBookingsLabels;
+}
+export declare function ManualBookingsPage({ adapter, labels }: ManualBookingsPageProps): import("react").JSX.Element;

package/dist/pages/manual-bookings/ManualBookingsPage.js

@@ -0,0 +1,161 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { Plus, Repeat, Search, Trash2 } from "lucide-react";
+import { toast } from "sonner";
+import { Button } from "../../ui/button.js";
+import { Input } from "../../ui/input.js";
+import { Label } from "../../ui/label.js";
+import { Textarea } from "../../ui/textarea.js";
+import { Switch } from "../../ui/switch.js";
+import { Badge } from "../../ui/badge.js";
+import { Combobox } from "../../ui/combobox.js";
+import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle, } from "../../ui/dialog.js";
+import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, } from "../../ui/alert-dialog.js";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../../ui/table.js";
+import { ErrorState, TableSkeleton, readableErrorMessage } from "../../components/feedback/query-states.js";
+import { cn } from "../../lib/class-names.js";
+import { englishManualBookingsLabels } from "./labels.js";
+const ALL = "__all";
+const NONE = "__none";
+const YEAR_MIN = 1900;
+const YEAR_MAX = 2999;
+function isValidYear(raw) {
+    const n = Number(raw);
+    return /^\d{4}$/.test(raw) && n >= YEAR_MIN && n <= YEAR_MAX;
+}
+function periodOf(month, year) {
+    return `${year}-${String(month).padStart(2, "0")}-01`;
+}
+export function ManualBookingsPage({ adapter, labels = englishManualBookingsLabels }) {
+    const companyOptionsQuery = adapter.useCompanyOptions();
+    const categoryOptionsQuery = adapter.useCategoryOptions();
+    const propertyOptionsQuery = adapter.usePropertyOptions();
+    const [companyId, setCompanyId] = useState(ALL);
+    const [year, setYear] = useState(new Date().getFullYear());
+    const [yearInput, setYearInput] = useState(String(new Date().getFullYear()));
+    const [search, setSearch] = useState("");
+    const [sort, setSort] = useState("periodAsc");
+    const [dialogState, setDialogState] = useState(null);
+    const from = `${year}-01-01`;
+    const to = `${year}-12-01`;
+    const bookingsQuery = adapter.useBookings(companyId === ALL ? null : companyId, from, to);
+    const companyById = useMemo(() => new Map(companyOptionsQuery.data.map((c) => [c.id, c])), [companyOptionsQuery.data]);
+    const categoryById = useMemo(() => new Map(categoryOptionsQuery.data.map((c) => [c.id, c])), [categoryOptionsQuery.data]);
+    const propertyById = useMemo(() => new Map(propertyOptionsQuery.data.map((p) => [p.id, p])), [propertyOptionsQuery.data]);
+    function monthLabel(period) {
+        const m = Number(period.slice(5, 7));
+        return `${adapter.monthLabels[m - 1] ?? m} ${period.slice(0, 4)}`;
+    }
+    const rows = useMemo(() => {
+        const term = search.trim().toLowerCase();
+        const filtered = bookingsQuery.data.filter((row) => {
+            if (!term)
+                return true;
+            const category = categoryById.get(row.categoryId)?.label ?? "";
+            const property = row.propertyId ? (propertyById.get(row.propertyId)?.code ?? "") : "";
+            const company = companyById.get(row.companyId)?.code ?? "";
+            return [row.note ?? "", category, property, company, monthLabel(row.period)].join(" ").toLowerCase().includes(term);
+        });
+        const sorted = [...filtered];
+        sorted.sort((a, b) => {
+            if (sort === "amountDesc")
+                return Math.abs(b.amount) - Math.abs(a.amount);
+            if (sort === "amountAsc")
+                return Math.abs(a.amount) - Math.abs(b.amount);
+            if (sort === "category")
+                return (categoryById.get(a.categoryId)?.label ?? "").localeCompare(categoryById.get(b.categoryId)?.label ?? "");
+            if (sort === "periodDesc")
+                return b.period.localeCompare(a.period);
+            return a.period.localeCompare(b.period);
+        });
+        return sorted;
+    }, [bookingsQuery.data, search, sort, categoryById, propertyById, companyById]);
+    return (_jsxs("div", { children: [_jsxs("div", { className: "flex flex-wrap items-end justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "mt-2 text-2xl font-semibold tracking-tight text-foreground", children: labels.title }), _jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: labels.subtitle })] }), _jsxs("div", { className: "flex w-full flex-wrap items-end gap-3 sm:w-auto", children: [_jsxs("div", { className: "w-full space-y-1.5 sm:w-[220px]", children: [_jsx(Label, { children: labels.companyLabel }), _jsx(Combobox, { value: companyId, onValueChange: setCompanyId, options: [{ value: ALL, label: labels.companyAll }, ...companyOptionsQuery.data.map((c) => ({ value: c.id, label: `${c.code} · ${c.name}` }))] })] }), _jsxs("div", { className: "w-[100px] space-y-1.5", children: [_jsx(Label, { children: labels.yearLabel }), _jsx(Input, { type: "number", inputMode: "numeric", value: yearInput, onChange: (event) => {
+                                            const raw = event.target.value;
+                                            setYearInput(raw);
+                                            if (isValidYear(raw))
+                                                setYear(Number(raw));
+                                        }, onBlur: () => setYearInput(String(year)), "aria-invalid": !isValidYear(yearInput) }), !isValidYear(yearInput) && _jsx("p", { className: "text-xs text-amber-700", children: labels.yearInvalid(YEAR_MIN, YEAR_MAX, year) })] }), _jsxs(Button, { className: "gap-2", onClick: () => setDialogState("new"), children: [_jsx(Plus, { className: "size-4" }), " ", labels.newBookingButton] })] })] }), _jsx("p", { className: "mt-4 max-w-3xl rounded-lg border border-border bg-muted/40 p-3 text-xs text-muted-foreground", children: labels.hint }), _jsxs("div", { className: "mt-4 flex flex-wrap items-center gap-3", children: [_jsxs("div", { className: "relative w-full flex-1 sm:w-auto sm:min-w-[240px]", children: [_jsx(Search, { className: "absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { value: search, onChange: (event) => setSearch(event.target.value), placeholder: labels.searchPlaceholder, className: "pl-9" })] }), _jsx(Combobox, { value: sort, onValueChange: (v) => setSort(v), className: "w-full sm:w-[220px]", options: [
+                            { value: "periodAsc", label: labels.sortPeriodAsc },
+                            { value: "periodDesc", label: labels.sortPeriodDesc },
+                            { value: "amountDesc", label: labels.sortAmountDesc },
+                            { value: "amountAsc", label: labels.sortAmountAsc },
+                            { value: "category", label: labels.sortCategory },
+                        ] })] }), bookingsQuery.error ? (_jsx("div", { className: "mt-6", children: _jsx(ErrorState, { error: bookingsQuery.error, onRetry: () => { } }) })) : bookingsQuery.loading ? (_jsx("div", { className: "mt-6", children: _jsx(TableSkeleton, { rows: 5, columns: companyId === ALL ? 7 : 6 }) })) : (_jsx("div", { className: "mt-6 overflow-hidden overflow-x-auto rounded-xl border border-border bg-card", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { className: "bg-muted/40", children: [companyId === ALL && _jsx(TableHead, { children: labels.columnCompany }), _jsx(TableHead, { children: labels.columnPeriod }), _jsx(TableHead, { children: labels.columnCategory }), _jsx(TableHead, { children: labels.columnProperty }), _jsx(TableHead, { children: labels.columnNote }), _jsx(TableHead, { className: "text-right", children: labels.columnAmount }), _jsx(TableHead, { className: "text-right", children: labels.columnActions })] }) }), _jsxs(TableBody, { children: [rows.map((row) => (_jsxs(TableRow, { children: [companyId === ALL && _jsx(TableCell, { className: "text-muted-foreground", children: companyById.get(row.companyId)?.code ?? "—" }), _jsx(TableCell, { className: "font-medium text-foreground", children: monthLabel(row.period) }), _jsx(TableCell, { children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { children: categoryById.get(row.categoryId)?.label ?? "—" }), row.isRecurring && (_jsxs(Badge, { variant: "outline", className: "gap-1 text-[10px]", children: [_jsx(Repeat, { className: "size-3" }), " ", labels.recurringBadge] }))] }) }), _jsx(TableCell, { className: "text-muted-foreground", children: row.propertyId ? (propertyById.get(row.propertyId)?.code ?? "—") : "—" }), _jsx(TableCell, { className: "max-w-xs truncate text-muted-foreground", children: row.note ?? "—" }), _jsx(TableCell, { className: cn("text-right font-medium tabular-nums", row.amount < 0 && "text-destructive"), children: adapter.formatMoney(row.amount) }), _jsx(TableCell, { children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsx("button", { type: "button", className: "text-xs font-medium text-muted-foreground hover:text-foreground", onClick: () => setDialogState(row), children: labels.editButton }), _jsx(DeleteBookingButton, { booking: row, adapter: adapter, labels: labels })] }) })] }, row.id))), rows.length === 0 && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: companyId === ALL ? 7 : 6, className: "py-8 text-center text-muted-foreground", children: labels.empty }) }))] })] }) })), dialogState && (_jsx(BookingDialog, { booking: dialogState === "new" ? null : dialogState, defaultCompanyId: companyId === ALL ? undefined : companyId, adapter: adapter, labels: labels, onClose: () => setDialogState(null) }))] }));
+}
+function DeleteBookingButton({ booking, adapter, labels }) {
+    const [open, setOpen] = useState(false);
+    async function confirm() {
+        try {
+            await adapter.deleteBooking(booking.id);
+            toast.success(labels.deletedToast);
+            setOpen(false);
+        }
+        catch (error) {
+            toast.error(readableErrorMessage(error, ""));
+        }
+    }
+    return (_jsxs(AlertDialog, { open: open, onOpenChange: setOpen, children: [_jsx(AlertDialogTrigger, { asChild: true, children: _jsx("button", { type: "button", title: labels.deleteButton, className: "flex size-6 items-center justify-center rounded text-muted-foreground hover:bg-destructive/10 hover:text-destructive", children: _jsx(Trash2, { className: "size-3.5" }) }) }), _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: labels.deleteDialogTitle }), _jsx(AlertDialogDescription, { children: labels.deleteDialogDescription })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: labels.deleteCancel }), _jsx(AlertDialogAction, { onClick: confirm, className: "bg-destructive text-destructive-foreground hover:bg-destructive/90", children: labels.deleteConfirm })] })] })] }));
+}
+function BookingDialog({ booking, defaultCompanyId, adapter, labels, onClose, }) {
+    const companyOptionsQuery = adapter.useCompanyOptions();
+    const categoryOptionsQuery = adapter.useCategoryOptions();
+    const propertyOptionsQuery = adapter.usePropertyOptions();
+    const now = new Date();
+    const [companyId, setCompanyId] = useState(booking?.companyId ?? defaultCompanyId ?? "");
+    const [categoryId, setCategoryId] = useState(booking?.categoryId ?? "");
+    const [propertyId, setPropertyId] = useState(booking?.propertyId ?? NONE);
+    const [month, setMonth] = useState(booking ? Number(booking.period.slice(5, 7)) : now.getMonth() + 1);
+    const [year, setYear] = useState(booking ? Number(booking.period.slice(0, 4)) : now.getFullYear());
+    const [amount, setAmount] = useState(booking ? String(booking.amount) : "");
+    const [note, setNote] = useState(booking?.note ?? "");
+    const [recurring, setRecurring] = useState(booking?.isRecurring ?? false);
+    const [endMonth, setEndMonth] = useState(booking?.recurrenceUntil ? Number(booking.recurrenceUntil.slice(5, 7)) : null);
+    const [endYear, setEndYear] = useState(booking?.recurrenceUntil ? Number(booking.recurrenceUntil.slice(0, 4)) : null);
+    const [isSaving, setIsSaving] = useState(false);
+    const [error, setError] = useState("");
+    const amountNum = Number(amount.replace(",", "."));
+    const endMonthWithoutYear = recurring && !!endMonth && !endYear;
+    const endBeforeStart = recurring && !!endMonth && !!endYear && periodOf(endMonth, endYear) < periodOf(month, year);
+    const invalid = !companyId || !categoryId || !amount.trim() || !Number.isFinite(amountNum) || amountNum === 0 || endMonthWithoutYear || endBeforeStart || !isValidYear(String(year));
+    async function save() {
+        if (endMonthWithoutYear) {
+            setError(labels.endMonthNeedsYear);
+            return;
+        }
+        if (endBeforeStart) {
+            setError(labels.endBeforeStart);
+            return;
+        }
+        if (invalid)
+            return;
+        setError("");
+        const input = {
+            companyId,
+            categoryId,
+            propertyId: propertyId === NONE ? null : propertyId,
+            period: periodOf(month, year),
+            amount: amountNum,
+            note: note.trim() === "" ? null : note.trim(),
+            isRecurring: recurring,
+            recurrenceUntil: recurring && endMonth && endYear ? periodOf(endMonth, endYear) : null,
+        };
+        setIsSaving(true);
+        try {
+            if (booking)
+                await adapter.updateBooking(booking.id, input);
+            else
+                await adapter.createBooking(input);
+            toast.success(labels.savedToast);
+            onClose();
+        }
+        catch (e) {
+            toast.error(labels.saveFailed(readableErrorMessage(e, "")));
+        }
+        finally {
+            setIsSaving(false);
+        }
+    }
+    const monthOptions = adapter.monthLabels.map((label, i) => ({ value: String(i + 1), label }));
+    return (_jsx(Dialog, { open: true, onOpenChange: (next) => !next && onClose(), children: _jsxs(DialogContent, { className: "max-w-lg", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: booking ? labels.editDialogTitle : labels.newDialogTitle }) }), _jsxs("div", { className: "grid gap-3", children: [_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: labels.fieldCompany }), _jsx(Combobox, { value: companyId, onValueChange: setCompanyId, options: companyOptionsQuery.data.map((c) => ({ value: c.id, label: `${c.code} · ${c.name}` })) })] }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: labels.fieldCategory }), _jsx(Combobox, { value: categoryId, onValueChange: setCategoryId, options: categoryOptionsQuery.data.map((c) => ({ value: c.id, label: c.label })) })] }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: labels.fieldProperty }), _jsx(Combobox, { value: propertyId, onValueChange: setPropertyId, options: [{ value: NONE, label: labels.propertyNone }, ...propertyOptionsQuery.data.map((p) => ({ value: p.id, label: p.name ? `${p.code} · ${p.name}` : p.code }))] })] }), _jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: labels.fieldMonth }), _jsx(Combobox, { value: String(month), onValueChange: (v) => setMonth(Number(v)), options: monthOptions })] }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: labels.fieldYear }), _jsx(Input, { type: "number", value: year, onChange: (event) => setYear(Number(event.target.value) || year) })] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: labels.fieldAmount }), _jsx(Input, { value: amount, onChange: (event) => setAmount(event.target.value) })] }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: labels.fieldNote }), _jsx(Textarea, { value: note, onChange: (event) => setNote(event.target.value), rows: 2 })] }), _jsxs("label", { className: "flex items-center gap-2 text-sm text-foreground", children: [_jsx(Switch, { checked: recurring, onCheckedChange: setRecurring }), labels.fieldRecurring] }), recurring && (_jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: labels.fieldRecurringUntil }), _jsx(Combobox, { value: endMonth ? String(endMonth) : "", onValueChange: (v) => setEndMonth(v ? Number(v) : null), options: [{ value: "", label: labels.recurringUntilNone }, ...monthOptions] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: "\u00A0" }), _jsx(Input, { type: "number", value: endYear ?? "", onChange: (event) => setEndYear(event.target.value ? Number(event.target.value) : null) })] })] })), error && _jsx("p", { className: "text-xs text-destructive", children: error })] }), _jsxs(DialogFooter, { children: [_jsx(Button, { variant: "outline", onClick: onClose, children: labels.cancel }), _jsx(Button, { onClick: save, disabled: invalid || isSaving, children: isSaving ? labels.saving : labels.save })] })] }) }));
+}

package/dist/pages/manual-bookings/index.d.ts

@@ -0,0 +1,4 @@
+export { ManualBookingsPage } from "./ManualBookingsPage";
+export type { ManualBookingsPageProps } from "./ManualBookingsPage";
+export { englishManualBookingsLabels } from "./labels";
+export type { ManualBookingsLabels } from "./labels";

package/dist/pages/manual-bookings/index.js

@@ -0,0 +1,2 @@
+export { ManualBookingsPage } from "./ManualBookingsPage.js";
+export { englishManualBookingsLabels } from "./labels.js";

package/dist/pages/manual-bookings/labels.d.ts

@@ -0,0 +1,53 @@
+export interface ManualBookingsLabels {
+    title: string;
+    subtitle: string;
+    hint: string;
+    companyLabel: string;
+    companyAll: string;
+    yearLabel: string;
+    yearInvalid: (min: number, max: number, fallback: number) => string;
+    newBookingButton: string;
+    searchPlaceholder: string;
+    sortPeriodAsc: string;
+    sortPeriodDesc: string;
+    sortAmountDesc: string;
+    sortAmountAsc: string;
+    sortCategory: string;
+    columnCompany: string;
+    columnPeriod: string;
+    columnCategory: string;
+    columnProperty: string;
+    columnNote: string;
+    columnAmount: string;
+    columnActions: string;
+    recurringBadge: string;
+    empty: string;
+    editButton: string;
+    deleteButton: string;
+    deleteDialogTitle: string;
+    deleteDialogDescription: string;
+    deleteCancel: string;
+    deleteConfirm: string;
+    deletedToast: string;
+    editDialogTitle: string;
+    newDialogTitle: string;
+    fieldCompany: string;
+    fieldCategory: string;
+    fieldProperty: string;
+    propertyNone: string;
+    fieldMonth: string;
+    fieldYear: string;
+    fieldAmount: string;
+    fieldNote: string;
+    fieldRecurring: string;
+    fieldRecurringUntil: string;
+    recurringUntilNone: string;
+    cancel: string;
+    save: string;
+    saving: string;
+    saveFailed: (error: string) => string;
+    savedToast: string;
+    endBeforeStart: string;
+    endMonthNeedsYear: string;
+}
+export declare const englishManualBookingsLabels: ManualBookingsLabels;

package/dist/pages/manual-bookings/labels.js

@@ -0,0 +1,52 @@
+export const englishManualBookingsLabels = {
+    title: "Manual bookings",
+    subtitle: "Cost-side entries that have no invoice or bank transaction behind them.",
+    hint: "Manual bookings flow into the evaluation on the same footing as receipts, in the category you pick.",
+    companyLabel: "Company",
+    companyAll: "All companies",
+    yearLabel: "Year",
+    yearInvalid: (min, max, fallback) => `Enter a year between ${min} and ${max}. Showing ${fallback}.`,
+    newBookingButton: "New booking",
+    searchPlaceholder: "Search note, category, property…",
+    sortPeriodAsc: "Period, earliest first",
+    sortPeriodDesc: "Period, latest first",
+    sortAmountDesc: "Amount, highest first",
+    sortAmountAsc: "Amount, lowest first",
+    sortCategory: "Category",
+    columnCompany: "Company",
+    columnPeriod: "Period",
+    columnCategory: "Category",
+    columnProperty: "Property",
+    columnNote: "Note",
+    columnAmount: "Amount",
+    columnActions: "Actions",
+    recurringBadge: "Recurring",
+    empty: "No manual bookings for this year.",
+    editButton: "Edit",
+    deleteButton: "Delete",
+    deleteDialogTitle: "Delete this booking?",
+    deleteDialogDescription: "This cannot be undone.",
+    deleteCancel: "Cancel",
+    deleteConfirm: "Delete",
+    deletedToast: "Booking deleted.",
+    editDialogTitle: "Edit booking",
+    newDialogTitle: "New booking",
+    fieldCompany: "Company",
+    fieldCategory: "Category",
+    fieldProperty: "Property",
+    propertyNone: "No property",
+    fieldMonth: "Month",
+    fieldYear: "Year",
+    fieldAmount: "Amount",
+    fieldNote: "Note",
+    fieldRecurring: "Repeats every month",
+    fieldRecurringUntil: "Until",
+    recurringUntilNone: "No end date",
+    cancel: "Cancel",
+    save: "Save",
+    saving: "Saving…",
+    saveFailed: (error) => `Could not save: ${error}`,
+    savedToast: "Booking saved.",
+    endBeforeStart: "The end period can't be before the start.",
+    endMonthNeedsYear: "Pick a year for the end month too.",
+};

package/dist/pages/notifications/labels.d.ts

@@ -0,0 +1,22 @@
+export interface NotificationsPageLabels {
+    title: string;
+    subtitle: string;
+    alertsTab: string;
+    settingsTab: string;
+    empty: string;
+    readSectionTitle: string;
+    anyTime: string;
+    today: string;
+    lastSevenDays: string;
+    lastThirtyDays: string;
+    remindButton: string;
+    bellCardTitle: string;
+    bellCardDescription: string;
+    groupLabel: (groupKey: string) => string;
+    eventLabel: (eventKey: string) => string;
+    save: string;
+    cancel: string;
+    saved: string;
+    saveFailed: string;
+}
+export declare const englishNotificationsPageLabels: NotificationsPageLabels;

package/dist/pages/notifications/labels.js

@@ -0,0 +1,21 @@
+export const englishNotificationsPageLabels = {
+    title: "Notifications",
+    subtitle: "Everything that needs your attention, and the reminders people sent you.",
+    alertsTab: "Alerts",
+    settingsTab: "Settings",
+    empty: "Nothing new. Everything is up to date.",
+    readSectionTitle: "Read",
+    anyTime: "Any time",
+    today: "Today",
+    lastSevenDays: "Last 7 days",
+    lastThirtyDays: "Last 30 days",
+    remindButton: "Remind a person",
+    bellCardTitle: "Bell in the Hub",
+    bellCardDescription: "Which items the bell in the top right shows.",
+    groupLabel: (groupKey) => groupKey,
+    eventLabel: (eventKey) => eventKey,
+    save: "Save",
+    cancel: "Cancel",
+    saved: "Saved.",
+    saveFailed: "Saving failed.",
+};

package/dist/pages/notifications/notifications-page.d.ts

@@ -0,0 +1,14 @@
+import { type ReactNode } from "react";
+import { type ReminderDialogLabels } from "../../components/notifications/reminder-dialog";
+import type { NotificationsAdapter } from "../../adapters/notifications";
+import { type NotificationsPageLabels } from "./labels";
+export interface NotificationsPageProps {
+    adapter: NotificationsAdapter;
+    /** Whether the reader may see the settings tab. Without it only the alerts tab renders. */
+    canOpenSettings?: boolean;
+    /** Project-specific settings cards (channels, digest, Slack) rendered after the bell card. */
+    extraSettingsCards?: ReactNode;
+    labels?: NotificationsPageLabels;
+    reminderLabels?: ReminderDialogLabels;
+}
+export declare function NotificationsPage({ adapter, canOpenSettings, extraSettingsCards, labels, reminderLabels, }: NotificationsPageProps): import("react").JSX.Element;