@burdenoff/microfe-crewfoundry 2026.703.2 → 2026.704.1

package/dist/crewfoundry/pages/PaymentsInvoicesPagePage.js

@@ -1,10 +1,11 @@
 import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { FormModal as t, useFormModal as n } from "../components/forms/FormModal.js";
-import { CheckCircle2 as r, Plus as i } from "lucide-react";
-import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
-import { Badge as c, Button as l, CardContent as u, GlassCard as d, GradientText as f, IllustratedEmptyState as p, PagePurpose as m } from "@burdenoff/fe-libs/ui";
+import { CheckCircle2 as r, Pencil as i, Plus as a } from "lucide-react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { Badge as c, Button as l, CardContent as u, GlassCard as d, GradientText as f, IllustratedEmptyState as p, PagePurpose as m, Pagination as h, ResponsiveTable as g } from "@burdenoff/fe-libs/ui";
+import { usePagination as _ } from "@burdenoff/fe-libs/shared/hooks";
 //#region src/crewfoundry/pages/PaymentsInvoicesPagePage.tsx
-var h = [
+var v = [
 	{
 		name: "number",
 		label: "Invoice number",
@@ -69,24 +70,32 @@ var h = [
 		colSpan: 2,
 		placeholder: "e.g. Consulting services"
 	}
-], g = (e) => {
-	let t = typeof e.amount == "number" ? e.amount : Number(e.amount) || 0, n = String(e.lineItem ?? "").trim() || "Services rendered";
+], y = (e) => ({
+	number: e.number,
+	clientName: e.clientName,
+	amount: e.amount,
+	status: e.status,
+	issueDate: e.issueDate ? e.issueDate.slice(0, 10) : "",
+	dueDate: e.dueDate ? e.dueDate.slice(0, 10) : "",
+	lineItem: e.items[0]?.description ?? ""
+}), b = (e, t) => {
+	let n = typeof e.amount == "number" ? e.amount : Number(e.amount) || 0, r = String(e.lineItem ?? "").trim() || "Services rendered";
 	return {
-		id: crypto.randomUUID(),
+		id: t?.id ?? crypto.randomUUID(),
 		number: String(e.number ?? ""),
 		clientName: String(e.clientName ?? ""),
-		amount: t,
+		amount: n,
 		status: e.status || "draft",
 		issueDate: String(e.issueDate ?? ""),
 		dueDate: String(e.dueDate ?? ""),
 		items: [{
-			description: n,
-			amount: t
+			description: r,
+			amount: n
 		}]
 	};
-};
-function _() {
-	let { invoices: _, addInvoice: v, updateInvoice: y } = e(), b = n();
+}, x = (e) => e === "paid" ? "default" : e === "overdue" ? "destructive" : e === "draft" ? "outline" : "secondary";
+function S() {
+	let { invoices: S, addInvoice: C, updateInvoice: w } = e(), T = n(), { page: E, pageSize: D, offset: O, setPage: k } = _({ initialPageSize: 25 }), A = [...S].sort((e, t) => (t.issueDate ?? "").localeCompare(e.issueDate ?? "")), j = A.slice(O, O + D);
 	return /* @__PURE__ */ s("div", {
 		className: "space-y-6 p-6",
 		children: [
@@ -99,7 +108,7 @@ function _() {
 					}),
 					/* @__PURE__ */ s("p", {
 						className: "text-sm text-text-secondary",
-						children: [_.length, " invoices"]
+						children: [S.length, " invoices"]
 					}),
 					/* @__PURE__ */ o(m, {
 						className: "mt-1",
@@ -107,105 +116,129 @@ function _() {
 					})
 				] }), /* @__PURE__ */ s(l, {
 					size: "sm",
-					onClick: () => b.openModal(),
-					children: [/* @__PURE__ */ o(i, { className: "h-4 w-4 mr-1" }), "Create Invoice"]
+					onClick: () => T.openModal(),
+					children: [/* @__PURE__ */ o(a, { className: "h-4 w-4 mr-1" }), "Create Invoice"]
 				})]
 			}),
 			/* @__PURE__ */ o(d, {
 				treatment: "glass",
 				glow: !0,
 				className: "border-border-seam",
-				children: /* @__PURE__ */ o(u, {
-					className: "p-0",
-					children: _.length === 0 ? /* @__PURE__ */ o("div", {
-						className: "p-6",
-						children: /* @__PURE__ */ o(p, {
+				children: /* @__PURE__ */ s(u, {
+					className: "p-4",
+					children: [/* @__PURE__ */ o(g, {
+						data: j,
+						rowKey: (e) => e.id,
+						columns: [
+							{
+								key: "number",
+								header: "Invoice #",
+								priority: "primary",
+								cell: (e) => /* @__PURE__ */ o("span", {
+									className: "font-medium",
+									children: e.number
+								})
+							},
+							{
+								key: "client",
+								header: "Client",
+								priority: "secondary",
+								cell: (e) => /* @__PURE__ */ o("span", {
+									className: "text-text-secondary",
+									children: e.clientName
+								})
+							},
+							{
+								key: "items",
+								header: "Items",
+								priority: "hidden-on-mobile",
+								cell: (e) => /* @__PURE__ */ o("span", {
+									className: "text-xs text-text-secondary",
+									children: e.items.map((e) => e.description).join(", ")
+								})
+							},
+							{
+								key: "amount",
+								header: "Amount",
+								priority: "secondary",
+								headerClassName: "text-right",
+								cellClassName: "text-right",
+								cell: (e) => /* @__PURE__ */ s("span", {
+									className: "font-medium",
+									children: ["$", e.amount.toLocaleString()]
+								})
+							},
+							{
+								key: "dueDate",
+								header: "Due Date",
+								priority: "secondary",
+								cell: (e) => /* @__PURE__ */ o("span", {
+									className: "text-text-secondary",
+									children: e.dueDate
+								})
+							},
+							{
+								key: "status",
+								header: "Status",
+								priority: "secondary",
+								cell: (e) => /* @__PURE__ */ o(c, {
+									variant: x(e.status),
+									className: "text-[10px]",
+									children: e.status
+								})
+							}
+						],
+						emptyState: /* @__PURE__ */ o(p, {
 							illustration: "empty-data",
 							title: "No invoices yet",
 							description: "Create your first invoice to start getting paid."
+						}),
+						rowActions: (e) => /* @__PURE__ */ s("div", {
+							className: "flex items-center justify-end gap-1",
+							children: [/* @__PURE__ */ o(l, {
+								variant: "ghost",
+								size: "sm",
+								"aria-label": `Edit invoice ${e.number}`,
+								onClick: () => T.openModal(e),
+								children: /* @__PURE__ */ o(i, { className: "h-3.5 w-3.5" })
+							}), e.status === "paid" ? /* @__PURE__ */ s("span", {
+								className: "inline-flex items-center gap-1 text-xs text-status-success-text",
+								children: [/* @__PURE__ */ o(r, { className: "h-3.5 w-3.5" }), "Paid"]
+							}) : /* @__PURE__ */ s(l, {
+								variant: "outline",
+								size: "sm",
+								"aria-label": `Mark invoice ${e.number} as paid`,
+								onClick: () => void w(e.id, { status: "paid" }),
+								children: [/* @__PURE__ */ o(r, { className: "h-3.5 w-3.5 mr-1" }), "Mark Paid"]
+							})]
 						})
-					}) : /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ s("div", {
-						className: "grid grid-cols-7 gap-2 text-xs font-medium text-text-secondary p-4 border-b",
-						children: [
-							/* @__PURE__ */ o("span", { children: "Invoice #" }),
-							/* @__PURE__ */ o("span", { children: "Client" }),
-							/* @__PURE__ */ o("span", { children: "Items" }),
-							/* @__PURE__ */ o("span", {
-								className: "text-right",
-								children: "Amount"
-							}),
-							/* @__PURE__ */ o("span", { children: "Due Date" }),
-							/* @__PURE__ */ o("span", {
-								className: "text-center",
-								children: "Status"
-							}),
-							/* @__PURE__ */ o("span", {
-								className: "text-right",
-								children: "Actions"
-							})
-						]
-					}), _.map((e) => /* @__PURE__ */ s("div", {
-						className: "grid grid-cols-7 gap-2 py-3 px-4 border-b last:border-0 text-sm hover:bg-bg-sunken/50",
-						children: [
-							/* @__PURE__ */ o("span", {
-								className: "font-medium",
-								children: e.number
-							}),
-							/* @__PURE__ */ o("span", {
-								className: "text-text-secondary",
-								children: e.clientName
-							}),
-							/* @__PURE__ */ o("div", {
-								className: "text-xs text-text-secondary",
-								children: e.items.map((e) => e.description).join(", ")
-							}),
-							/* @__PURE__ */ s("span", {
-								className: "text-right font-medium",
-								children: ["$", e.amount.toLocaleString()]
-							}),
-							/* @__PURE__ */ o("span", {
-								className: "text-text-secondary",
-								children: e.dueDate
-							}),
-							/* @__PURE__ */ o("div", {
-								className: "text-center",
-								children: /* @__PURE__ */ o(c, {
-									variant: e.status === "paid" ? "default" : e.status === "overdue" ? "destructive" : e.status === "draft" ? "outline" : "secondary",
-									className: "text-[10px]",
-									children: e.status
-								})
-							}),
-							/* @__PURE__ */ o("div", {
-								className: "flex items-center justify-end",
-								children: e.status === "paid" ? /* @__PURE__ */ s("span", {
-									className: "inline-flex items-center gap-1 text-xs text-status-success-text",
-									children: [/* @__PURE__ */ o(r, { className: "h-3.5 w-3.5" }), "Paid"]
-								}) : /* @__PURE__ */ s(l, {
-									variant: "outline",
-									size: "sm",
-									onClick: () => void y(e.id, { status: "paid" }),
-									children: [/* @__PURE__ */ o(r, { className: "h-3.5 w-3.5 mr-1" }), "Mark Paid"]
-								})
-							})
-						]
-					}, e.id))] })
+					}), A.length > D && /* @__PURE__ */ o("div", {
+						className: "mt-4",
+						children: /* @__PURE__ */ o(h, {
+							page: E,
+							pageSize: D,
+							totalItems: A.length,
+							onPageChange: k
+						})
+					})]
 				})
 			}),
 			/* @__PURE__ */ o(t, {
-				open: b.open,
-				onOpenChange: b.onOpenChange,
-				title: "Create invoice",
+				open: T.open,
+				onOpenChange: T.onOpenChange,
+				title: T.context ? "Edit invoice" : "Create invoice",
 				description: "Issue a new invoice to a client and track its payment status.",
-				fields: h,
-				submitLabel: "Create invoice",
+				fields: v,
+				initialValues: T.context ? y(T.context) : void 0,
+				submitLabel: T.context ? "Save changes" : "Create invoice",
 				onSubmit: async (e) => {
-					await v(g(e));
+					T.context ? await w(T.context.id, b(e, T.context)) : await C(b(e));
 				}
 			})
 		]
 	});
 }
 //#endregion
-export { _ as PaymentsInvoicesPagePage };
+export { S as PaymentsInvoicesPagePage };
 
 //# sourceMappingURL=PaymentsInvoicesPagePage.js.map

package/dist/crewfoundry/pages/PaymentsInvoicesPagePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentsInvoicesPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/PaymentsInvoicesPagePage.tsx"],"sourcesContent":["import {\n  Badge,\n  Button,\n  CardContent,\n  GlassCard,\n  GradientText,\n  IllustratedEmptyState,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { CheckCircle2, Plus } from 'lucide-react';\nimport {\n  FormModal,\n  useFormModal,\n  type FieldConfig,\n  type FormValues,\n} from '../components/forms/FormModal';\nimport { useCrewFoundryStore, type Invoice } from '../store/crewfoundryStore';\n\nconst INVOICE_FIELDS: FieldConfig[] = [\n  { name: 'number', label: 'Invoice number', type: 'text', required: true, placeholder: 'INV-0001' },\n  { name: 'clientName', label: 'Client name', type: 'text', required: true },\n  { name: 'amount', label: 'Amount (USD)', type: 'number', required: true },\n  {\n    name: 'status',\n    label: 'Status',\n    type: 'select',\n    options: [\n      { label: 'Draft', value: 'draft' },\n      { label: 'Sent', value: 'sent' },\n      { label: 'Paid', value: 'paid' },\n      { label: 'Overdue', value: 'overdue' },\n      { label: 'Cancelled', value: 'cancelled' },\n    ],\n  },\n  { name: 'issueDate', label: 'Issue date', type: 'date', required: true },\n  { name: 'dueDate', label: 'Due date', type: 'date' },\n  {\n    name: 'lineItem',\n    label: 'Line item description',\n    type: 'text',\n    colSpan: 2,\n    placeholder: 'e.g. Consulting services',\n  },\n];\n\nconst valuesToInvoice = (values: FormValues): Invoice => {\n  const amount = typeof values.amount === 'number' ? values.amount : Number(values.amount) || 0;\n  const description = String(values.lineItem ?? '').trim() || 'Services rendered';\n  return {\n    id: crypto.randomUUID(),\n    number: String(values.number ?? ''),\n    clientName: String(values.clientName ?? ''),\n    amount,\n    status: (values.status as Invoice['status']) || 'draft',\n    issueDate: String(values.issueDate ?? ''),\n    dueDate: String(values.dueDate ?? ''),\n    items: [{ description, amount }],\n  };\n};\n\nexport function PaymentsInvoicesPagePage() {\n  const { invoices, addInvoice, updateInvoice } = useCrewFoundryStore();\n  const modal = useFormModal();\n\n  const handleSubmit = async (values: FormValues) => {\n    await addInvoice(valuesToInvoice(values));\n  };\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">\n            <GradientText>Invoices</GradientText>\n          </h1>\n          <p className=\"text-sm text-text-secondary\">{invoices.length} invoices</p>\n          <PagePurpose className=\"mt-1\">Create, send, and track invoices — see what&apos;s paid, pending, or overdue so you stay on top of getting paid.</PagePurpose>\n        </div>\n        <Button size=\"sm\" onClick={() => modal.openModal()}>\n          <Plus className=\"h-4 w-4 mr-1\" />\n          Create Invoice\n        </Button>\n      </div>\n      <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n        <CardContent className=\"p-0\">\n          {invoices.length === 0 ? (\n            <div className=\"p-6\">\n              <IllustratedEmptyState\n                illustration=\"empty-data\"\n                title=\"No invoices yet\"\n                description=\"Create your first invoice to start getting paid.\"\n              />\n            </div>\n          ) : (\n            <>\n              <div className=\"grid grid-cols-7 gap-2 text-xs font-medium text-text-secondary p-4 border-b\">\n                <span>Invoice #</span>\n                <span>Client</span>\n                <span>Items</span>\n                <span className=\"text-right\">Amount</span>\n                <span>Due Date</span>\n                <span className=\"text-center\">Status</span>\n                <span className=\"text-right\">Actions</span>\n              </div>\n              {invoices.map((inv) => (\n            <div\n              key={inv.id}\n              className=\"grid grid-cols-7 gap-2 py-3 px-4 border-b last:border-0 text-sm hover:bg-bg-sunken/50\"\n            >\n              <span className=\"font-medium\">{inv.number}</span>\n              <span className=\"text-text-secondary\">{inv.clientName}</span>\n              <div className=\"text-xs text-text-secondary\">\n                {inv.items.map((i) => i.description).join(', ')}\n              </div>\n              <span className=\"text-right font-medium\">${inv.amount.toLocaleString()}</span>\n              <span className=\"text-text-secondary\">{inv.dueDate}</span>\n              <div className=\"text-center\">\n                <Badge\n                  variant={\n                    inv.status === 'paid'\n                      ? 'default'\n                      : inv.status === 'overdue'\n                        ? 'destructive'\n                        : inv.status === 'draft'\n                          ? 'outline'\n                          : 'secondary'\n                  }\n                  className=\"text-[10px]\"\n                >\n                  {inv.status}\n                </Badge>\n              </div>\n              <div className=\"flex items-center justify-end\">\n                {inv.status === 'paid' ? (\n                  <span className=\"inline-flex items-center gap-1 text-xs text-status-success-text\">\n                    <CheckCircle2 className=\"h-3.5 w-3.5\" />\n                    Paid\n                  </span>\n                ) : (\n                  <Button\n                    variant=\"outline\"\n                    size=\"sm\"\n                    onClick={() => void updateInvoice(inv.id, { status: 'paid' })}\n                  >\n                    <CheckCircle2 className=\"h-3.5 w-3.5 mr-1\" />\n                    Mark Paid\n                  </Button>\n                )}\n              </div>\n            </div>\n              ))}\n            </>\n          )}\n        </CardContent>\n      </GlassCard>\n\n      <FormModal\n        open={modal.open}\n        onOpenChange={modal.onOpenChange}\n        title=\"Create invoice\"\n        description=\"Issue a new invoice to a client and track its payment status.\"\n        fields={INVOICE_FIELDS}\n        submitLabel=\"Create invoice\"\n        onSubmit={handleSubmit}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"PaymentsInvoicesPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/PaymentsInvoicesPagePage.tsx"],"sourcesContent":["import {\n  Badge,\n  Button,\n  CardContent,\n  GlassCard,\n  GradientText,\n  IllustratedEmptyState,\n  PagePurpose,\n  Pagination,\n  ResponsiveTable,\n  type ResponsiveTableColumn,\n} from '@burdenoff/fe-libs/ui';\nimport { usePagination } from '@burdenoff/fe-libs/shared/hooks';\nimport { CheckCircle2, Pencil, Plus } from 'lucide-react';\nimport {\n  FormModal,\n  useFormModal,\n  type FieldConfig,\n  type FormValues,\n} from '../components/forms/FormModal';\nimport { useCrewFoundryStore, type Invoice } from '../store/crewfoundryStore';\n\nconst INVOICE_FIELDS: FieldConfig[] = [\n  { name: 'number', label: 'Invoice number', type: 'text', required: true, placeholder: 'INV-0001' },\n  { name: 'clientName', label: 'Client name', type: 'text', required: true },\n  { name: 'amount', label: 'Amount (USD)', type: 'number', required: true },\n  {\n    name: 'status',\n    label: 'Status',\n    type: 'select',\n    options: [\n      { label: 'Draft', value: 'draft' },\n      { label: 'Sent', value: 'sent' },\n      { label: 'Paid', value: 'paid' },\n      { label: 'Overdue', value: 'overdue' },\n      { label: 'Cancelled', value: 'cancelled' },\n    ],\n  },\n  { name: 'issueDate', label: 'Issue date', type: 'date', required: true },\n  { name: 'dueDate', label: 'Due date', type: 'date' },\n  {\n    name: 'lineItem',\n    label: 'Line item description',\n    type: 'text',\n    colSpan: 2,\n    placeholder: 'e.g. Consulting services',\n  },\n];\n\nconst toInitialValues = (invoice: Invoice): FormValues => ({\n  number: invoice.number,\n  clientName: invoice.clientName,\n  amount: invoice.amount,\n  status: invoice.status,\n  issueDate: invoice.issueDate ? invoice.issueDate.slice(0, 10) : '',\n  dueDate: invoice.dueDate ? invoice.dueDate.slice(0, 10) : '',\n  lineItem: invoice.items[0]?.description ?? '',\n});\n\nconst valuesToInvoice = (values: FormValues, base?: Invoice): Invoice => {\n  const amount = typeof values.amount === 'number' ? values.amount : Number(values.amount) || 0;\n  const description = String(values.lineItem ?? '').trim() || 'Services rendered';\n  return {\n    id: base?.id ?? crypto.randomUUID(),\n    number: String(values.number ?? ''),\n    clientName: String(values.clientName ?? ''),\n    amount,\n    status: (values.status as Invoice['status']) || 'draft',\n    issueDate: String(values.issueDate ?? ''),\n    dueDate: String(values.dueDate ?? ''),\n    items: [{ description, amount }],\n  };\n};\n\nconst statusVariant = (status: Invoice['status']) =>\n  status === 'paid'\n    ? 'default'\n    : status === 'overdue'\n      ? 'destructive'\n      : status === 'draft'\n        ? 'outline'\n        : 'secondary';\n\nexport function PaymentsInvoicesPagePage() {\n  const { invoices, addInvoice, updateInvoice } = useCrewFoundryStore();\n  const modal = useFormModal<Invoice>();\n  const { page, pageSize, offset, setPage } = usePagination({ initialPageSize: 25 });\n\n  const sorted = [...invoices].sort((a, b) => (b.issueDate ?? '').localeCompare(a.issueDate ?? ''));\n  const paged = sorted.slice(offset, offset + pageSize);\n\n  const handleSubmit = async (values: FormValues) => {\n    if (modal.context) {\n      await updateInvoice(modal.context.id, valuesToInvoice(values, modal.context));\n    } else {\n      await addInvoice(valuesToInvoice(values));\n    }\n  };\n\n  const columns: ResponsiveTableColumn<Invoice>[] = [\n    {\n      key: 'number',\n      header: 'Invoice #',\n      priority: 'primary',\n      cell: (inv) => <span className=\"font-medium\">{inv.number}</span>,\n    },\n    {\n      key: 'client',\n      header: 'Client',\n      priority: 'secondary',\n      cell: (inv) => <span className=\"text-text-secondary\">{inv.clientName}</span>,\n    },\n    {\n      key: 'items',\n      header: 'Items',\n      priority: 'hidden-on-mobile',\n      cell: (inv) => (\n        <span className=\"text-xs text-text-secondary\">\n          {inv.items.map((i) => i.description).join(', ')}\n        </span>\n      ),\n    },\n    {\n      key: 'amount',\n      header: 'Amount',\n      priority: 'secondary',\n      headerClassName: 'text-right',\n      cellClassName: 'text-right',\n      cell: (inv) => <span className=\"font-medium\">${inv.amount.toLocaleString()}</span>,\n    },\n    {\n      key: 'dueDate',\n      header: 'Due Date',\n      priority: 'secondary',\n      cell: (inv) => <span className=\"text-text-secondary\">{inv.dueDate}</span>,\n    },\n    {\n      key: 'status',\n      header: 'Status',\n      priority: 'secondary',\n      cell: (inv) => (\n        <Badge variant={statusVariant(inv.status)} className=\"text-[10px]\">\n          {inv.status}\n        </Badge>\n      ),\n    },\n  ];\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">\n            <GradientText>Invoices</GradientText>\n          </h1>\n          <p className=\"text-sm text-text-secondary\">{invoices.length} invoices</p>\n          <PagePurpose className=\"mt-1\">Create, send, and track invoices — see what&apos;s paid, pending, or overdue so you stay on top of getting paid.</PagePurpose>\n        </div>\n        <Button size=\"sm\" onClick={() => modal.openModal()}>\n          <Plus className=\"h-4 w-4 mr-1\" />\n          Create Invoice\n        </Button>\n      </div>\n      <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n        <CardContent className=\"p-4\">\n          <ResponsiveTable\n            data={paged}\n            rowKey={(inv) => inv.id}\n            columns={columns}\n            emptyState={\n              <IllustratedEmptyState\n                illustration=\"empty-data\"\n                title=\"No invoices yet\"\n                description=\"Create your first invoice to start getting paid.\"\n              />\n            }\n            rowActions={(inv) => (\n              <div className=\"flex items-center justify-end gap-1\">\n                <Button\n                  variant=\"ghost\"\n                  size=\"sm\"\n                  aria-label={`Edit invoice ${inv.number}`}\n                  onClick={() => modal.openModal(inv)}\n                >\n                  <Pencil className=\"h-3.5 w-3.5\" />\n                </Button>\n                {inv.status === 'paid' ? (\n                  <span className=\"inline-flex items-center gap-1 text-xs text-status-success-text\">\n                    <CheckCircle2 className=\"h-3.5 w-3.5\" />\n                    Paid\n                  </span>\n                ) : (\n                  <Button\n                    variant=\"outline\"\n                    size=\"sm\"\n                    aria-label={`Mark invoice ${inv.number} as paid`}\n                    onClick={() => void updateInvoice(inv.id, { status: 'paid' })}\n                  >\n                    <CheckCircle2 className=\"h-3.5 w-3.5 mr-1\" />\n                    Mark Paid\n                  </Button>\n                )}\n              </div>\n            )}\n          />\n          {sorted.length > pageSize && (\n            <div className=\"mt-4\">\n              <Pagination\n                page={page}\n                pageSize={pageSize}\n                totalItems={sorted.length}\n                onPageChange={setPage}\n              />\n            </div>\n          )}\n        </CardContent>\n      </GlassCard>\n\n      <FormModal\n        open={modal.open}\n        onOpenChange={modal.onOpenChange}\n        title={modal.context ? 'Edit invoice' : 'Create invoice'}\n        description=\"Issue a new invoice to a client and track its payment status.\"\n        fields={INVOICE_FIELDS}\n        initialValues={modal.context ? toInitialValues(modal.context) : undefined}\n        submitLabel={modal.context ? 'Save changes' : 'Create invoice'}\n        onSubmit={handleSubmit}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/crewfoundry/pages/PaymentsPaymentDashboardPagePage.js

@@ -1,137 +1,159 @@
 import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { CreditCard as t, DollarSign as n, Receipt as r, TrendingUp as i } from "lucide-react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { Badge as s, Card as c, CardContent as l, CardHeader as u, CardTitle as d, GlassCard as f, GradientText as p, PagePurpose as m } from "@burdenoff/fe-libs/ui";
+import { useNavigate as a } from "react-router-dom";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { Badge as c, Button as l, Card as u, CardContent as d, CardHeader as f, CardTitle as p, GlassCard as m, GradientText as h, IllustratedEmptyState as g, PagePurpose as _, ResponsiveTable as v } from "@burdenoff/fe-libs/ui";
 //#region src/crewfoundry/pages/PaymentsPaymentDashboardPagePage.tsx
-function h() {
-	let { invoices: h, payrollRecords: g } = e(), _ = h.reduce((e, t) => e + t.amount, 0), v = h.filter((e) => e.status === "paid").reduce((e, t) => e + t.amount, 0), y = g.reduce((e, t) => e + t.grossPay, 0);
-	return /* @__PURE__ */ o("div", {
+var y = 5, b = (e) => e === "paid" ? "default" : e === "overdue" ? "destructive" : "secondary";
+function x() {
+	let x = a(), { invoices: S, payrollRecords: C } = e(), w = S.reduce((e, t) => e + t.amount, 0), T = S.filter((e) => e.status === "paid").reduce((e, t) => e + t.amount, 0), E = C.reduce((e, t) => e + t.grossPay, 0), D = [...S].sort((e, t) => (t.issueDate ?? "").localeCompare(e.issueDate ?? "")).slice(0, y);
+	return /* @__PURE__ */ s("div", {
 		className: "space-y-6 p-6",
 		children: [
-			/* @__PURE__ */ o("div", { children: [
-				/* @__PURE__ */ a("h1", {
+			/* @__PURE__ */ s("div", { children: [
+				/* @__PURE__ */ o("h1", {
 					className: "text-2xl font-semibold",
-					children: /* @__PURE__ */ a(p, { children: "Payment Dashboard" })
+					children: /* @__PURE__ */ o(h, { children: "Payment Dashboard" })
 				}),
-				/* @__PURE__ */ a("p", {
+				/* @__PURE__ */ o("p", {
 					className: "text-sm text-text-secondary",
 					children: "Financial transactions and payment overview"
 				}),
-				/* @__PURE__ */ a(m, {
+				/* @__PURE__ */ o(_, {
 					className: "mt-1",
 					children: "A snapshot of all money movement — incoming payments, payouts, and balances so you understand your financial position at a glance."
 				})
 			] }),
-			/* @__PURE__ */ o("div", {
+			/* @__PURE__ */ s("div", {
 				className: "grid gap-4 md:grid-cols-2 lg:grid-cols-4",
 				children: [
-					/* @__PURE__ */ o(f, {
+					/* @__PURE__ */ s(m, {
 						treatment: "glass",
 						glow: !0,
 						className: "border-border-seam",
-						children: [/* @__PURE__ */ o(u, {
+						children: [/* @__PURE__ */ s(f, {
 							className: "flex flex-row items-center justify-between space-y-0 pb-2",
-							children: [/* @__PURE__ */ a(d, {
+							children: [/* @__PURE__ */ o(p, {
 								className: "text-sm font-medium",
 								children: "Total Invoiced"
-							}), /* @__PURE__ */ a(r, { className: "h-4 w-4 text-text-secondary" })]
-						}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
+							}), /* @__PURE__ */ o(r, { className: "h-4 w-4 text-text-secondary" })]
+						}), /* @__PURE__ */ o(d, { children: /* @__PURE__ */ s("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: ["$", _.toLocaleString()]
+							children: ["$", w.toLocaleString()]
 						}) })]
 					}),
-					/* @__PURE__ */ o(f, {
+					/* @__PURE__ */ s(m, {
 						treatment: "metric",
 						className: "border-border-seam",
-						children: [/* @__PURE__ */ o(u, {
+						children: [/* @__PURE__ */ s(f, {
 							className: "flex flex-row items-center justify-between space-y-0 pb-2",
-							children: [/* @__PURE__ */ a(d, {
+							children: [/* @__PURE__ */ o(p, {
 								className: "text-sm font-medium",
 								children: "Collected"
-							}), /* @__PURE__ */ a(n, { className: "h-4 w-4 text-status-success-text" })]
-						}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
+							}), /* @__PURE__ */ o(n, { className: "h-4 w-4 text-status-success-text" })]
+						}), /* @__PURE__ */ o(d, { children: /* @__PURE__ */ s("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: ["$", v.toLocaleString()]
+							children: ["$", T.toLocaleString()]
 						}) })]
 					}),
-					/* @__PURE__ */ o(f, {
+					/* @__PURE__ */ s(m, {
 						treatment: "metric",
 						className: "border-border-seam",
-						children: [/* @__PURE__ */ o(u, {
+						children: [/* @__PURE__ */ s(f, {
 							className: "flex flex-row items-center justify-between space-y-0 pb-2",
-							children: [/* @__PURE__ */ a(d, {
+							children: [/* @__PURE__ */ o(p, {
 								className: "text-sm font-medium",
 								children: "Payroll Processed"
-							}), /* @__PURE__ */ a(t, { className: "h-4 w-4 text-text-secondary" })]
-						}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
+							}), /* @__PURE__ */ o(t, { className: "h-4 w-4 text-text-secondary" })]
+						}), /* @__PURE__ */ o(d, { children: /* @__PURE__ */ s("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: ["$", y.toLocaleString()]
+							children: ["$", E.toLocaleString()]
 						}) })]
 					}),
-					/* @__PURE__ */ o(f, {
+					/* @__PURE__ */ s(m, {
 						treatment: "metric",
 						className: "border-border-seam",
-						children: [/* @__PURE__ */ o(u, {
+						children: [/* @__PURE__ */ s(f, {
 							className: "flex flex-row items-center justify-between space-y-0 pb-2",
-							children: [/* @__PURE__ */ a(d, {
+							children: [/* @__PURE__ */ o(p, {
 								className: "text-sm font-medium",
 								children: "Outstanding"
-							}), /* @__PURE__ */ a(i, { className: "h-4 w-4 text-status-warning-text" })]
-						}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
+							}), /* @__PURE__ */ o(i, { className: "h-4 w-4 text-status-warning-text" })]
+						}), /* @__PURE__ */ o(d, { children: /* @__PURE__ */ s("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: ["$", (_ - v).toLocaleString()]
+							children: ["$", (w - T).toLocaleString()]
 						}) })]
 					})
 				]
 			}),
-			/* @__PURE__ */ o(c, { children: [/* @__PURE__ */ a(u, { children: /* @__PURE__ */ a(d, { children: "Recent Invoices" }) }), /* @__PURE__ */ o(l, { children: [/* @__PURE__ */ o("div", {
-				className: "grid grid-cols-5 gap-2 text-xs font-medium text-text-secondary border-b pb-2 mb-2",
-				children: [
-					/* @__PURE__ */ a("span", { children: "Invoice" }),
-					/* @__PURE__ */ a("span", { children: "Client" }),
-					/* @__PURE__ */ a("span", {
-						className: "text-right",
-						children: "Amount"
-					}),
-					/* @__PURE__ */ a("span", { children: "Due Date" }),
-					/* @__PURE__ */ a("span", {
-						className: "text-center",
-						children: "Status"
-					})
-				]
-			}), h.map((e) => /* @__PURE__ */ o("div", {
-				className: "grid grid-cols-5 gap-2 py-2 border-b last:border-0 text-sm",
-				children: [
-					/* @__PURE__ */ a("span", {
-						className: "font-medium",
-						children: e.number
-					}),
-					/* @__PURE__ */ a("span", {
-						className: "text-text-secondary",
-						children: e.clientName
-					}),
-					/* @__PURE__ */ o("span", {
-						className: "text-right",
-						children: ["$", e.amount.toLocaleString()]
-					}),
-					/* @__PURE__ */ a("span", {
-						className: "text-text-secondary",
-						children: e.dueDate
-					}),
-					/* @__PURE__ */ a("div", {
-						className: "text-center",
-						children: /* @__PURE__ */ a(s, {
-							variant: e.status === "paid" ? "default" : e.status === "overdue" ? "destructive" : "secondary",
+			/* @__PURE__ */ s(u, { children: [/* @__PURE__ */ s(f, {
+				className: "flex flex-row items-center justify-between space-y-0",
+				children: [/* @__PURE__ */ o(p, { children: "Recent Invoices" }), S.length > y && /* @__PURE__ */ o(l, {
+					variant: "ghost",
+					size: "sm",
+					onClick: () => x("../invoices-page"),
+					children: "View all"
+				})]
+			}), /* @__PURE__ */ o(d, { children: /* @__PURE__ */ o(v, {
+				data: D,
+				rowKey: (e) => e.id,
+				columns: [
+					{
+						key: "number",
+						header: "Invoice",
+						priority: "primary",
+						cell: (e) => /* @__PURE__ */ o("span", {
+							className: "font-medium",
+							children: e.number
+						})
+					},
+					{
+						key: "client",
+						header: "Client",
+						priority: "secondary",
+						cell: (e) => /* @__PURE__ */ o("span", {
+							className: "text-text-secondary",
+							children: e.clientName
+						})
+					},
+					{
+						key: "amount",
+						header: "Amount",
+						priority: "secondary",
+						headerClassName: "text-right",
+						cellClassName: "text-right",
+						cell: (e) => /* @__PURE__ */ s("span", { children: ["$", e.amount.toLocaleString()] })
+					},
+					{
+						key: "dueDate",
+						header: "Due Date",
+						priority: "hidden-on-mobile",
+						cell: (e) => /* @__PURE__ */ o("span", {
+							className: "text-text-secondary",
+							children: e.dueDate
+						})
+					},
+					{
+						key: "status",
+						header: "Status",
+						priority: "secondary",
+						cell: (e) => /* @__PURE__ */ o(c, {
+							variant: b(e.status),
 							className: "text-[10px]",
 							children: e.status
 						})
-					})
-				]
-			}, e.id))] })] })
+					}
+				],
+				emptyState: /* @__PURE__ */ o(g, {
+					illustration: "empty-data",
+					title: "No invoices yet",
+					description: "Invoices you create will show up here."
+				})
+			}) })] })
 		]
 	});
 }
 //#endregion
-export { h as PaymentsPaymentDashboardPagePage };
+export { x as PaymentsPaymentDashboardPagePage };
 
 //# sourceMappingURL=PaymentsPaymentDashboardPagePage.js.map

package/dist/crewfoundry/pages/PaymentsPaymentDashboardPagePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentsPaymentDashboardPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/PaymentsPaymentDashboardPagePage.tsx"],"sourcesContent":["import {\n  Badge,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  GlassCard,\n  GradientText,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { CreditCard, DollarSign, Receipt, TrendingUp } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\nexport function PaymentsPaymentDashboardPagePage() {\n  const { invoices, payrollRecords } = useCrewFoundryStore();\n  const totalInvoiced = invoices.reduce((s, i) => s + i.amount, 0);\n  const totalPaid = invoices.filter((i) => i.status === 'paid').reduce((s, i) => s + i.amount, 0);\n  const totalPayroll = payrollRecords.reduce((s, r) => s + r.grossPay, 0);\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div>\n        <h1 className=\"text-2xl font-semibold\">\n          <GradientText>Payment Dashboard</GradientText>\n        </h1>\n        <p className=\"text-sm text-text-secondary\">Financial transactions and payment overview</p>\n        <PagePurpose className=\"mt-1\">A snapshot of all money movement — incoming payments, payouts, and balances so you understand your financial position at a glance.</PagePurpose>\n      </div>\n      <div className=\"grid gap-4 md:grid-cols-2 lg:grid-cols-4\">\n        <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Total Invoiced</CardTitle>\n            <Receipt className=\"h-4 w-4 text-text-secondary\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">${totalInvoiced.toLocaleString()}</div>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Collected</CardTitle>\n            <DollarSign className=\"h-4 w-4 text-status-success-text\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">${totalPaid.toLocaleString()}</div>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Payroll Processed</CardTitle>\n            <CreditCard className=\"h-4 w-4 text-text-secondary\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">${totalPayroll.toLocaleString()}</div>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Outstanding</CardTitle>\n            <TrendingUp className=\"h-4 w-4 text-status-warning-text\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">\n              ${(totalInvoiced - totalPaid).toLocaleString()}\n            </div>\n          </CardContent>\n        </GlassCard>\n      </div>\n      <Card>\n        <CardHeader>\n          <CardTitle>Recent Invoices</CardTitle>\n        </CardHeader>\n        <CardContent>\n          <div className=\"grid grid-cols-5 gap-2 text-xs font-medium text-text-secondary border-b pb-2 mb-2\">\n            <span>Invoice</span>\n            <span>Client</span>\n            <span className=\"text-right\">Amount</span>\n            <span>Due Date</span>\n            <span className=\"text-center\">Status</span>\n          </div>\n          {invoices.map((inv) => (\n            <div\n              key={inv.id}\n              className=\"grid grid-cols-5 gap-2 py-2 border-b last:border-0 text-sm\"\n            >\n              <span className=\"font-medium\">{inv.number}</span>\n              <span className=\"text-text-secondary\">{inv.clientName}</span>\n              <span className=\"text-right\">${inv.amount.toLocaleString()}</span>\n              <span className=\"text-text-secondary\">{inv.dueDate}</span>\n              <div className=\"text-center\">\n                <Badge\n                  variant={\n                    inv.status === 'paid'\n                      ? 'default'\n                      : inv.status === 'overdue'\n                        ? 'destructive'\n                        : 'secondary'\n                  }\n                  className=\"text-[10px]\"\n                >\n                  {inv.status}\n                </Badge>\n              </div>\n            </div>\n          ))}\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":";;;;;AAaA,SAAgB,IAAmC;CACjD,IAAM,EAAE,aAAU,sBAAmB,GAAqB,EACpD,IAAgB,EAAS,QAAQ,GAAG,MAAM,IAAI,EAAE,QAAQ,EAAE,EAC1D,IAAY,EAAS,QAAQ,MAAM,EAAE,WAAW,OAAO,CAAC,QAAQ,GAAG,MAAM,IAAI,EAAE,QAAQ,EAAE,EACzF,IAAe,EAAe,QAAQ,GAAG,MAAM,IAAI,EAAE,UAAU,EAAE;AAEvE,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf;GACE,kBAAC,OAAD,EAAA,UAAA;IACE,kBAAC,MAAD;KAAI,WAAU;eACZ,kBAAC,GAAD,EAAA,UAAc,qBAAgC,CAAA;KAC3C,CAAA;IACL,kBAAC,KAAD;KAAG,WAAU;eAA8B;KAA+C,CAAA;IAC1F,kBAAC,GAAD;KAAa,WAAU;eAAO;KAAgJ,CAAA;IAC1K,EAAA,CAAA;GACN,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,GAAD;MAAW,WAAU;MAAQ,MAAA;MAAK,WAAU;gBAA5C,CACE,kBAAC,GAAD;OAAY,WAAU;iBAAtB,CACE,kBAAC,GAAD;QAAW,WAAU;kBAAsB;QAA0B,CAAA,EACrE,kBAAC,GAAD,EAAS,WAAU,+BAAgC,CAAA,CACxC;UACb,kBAAC,GAAD,EAAA,UACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CAAiD,KAAE,EAAc,gBAAgB,CAAO;UAC5E,CAAA,CACJ;;KACZ,kBAAC,GAAD;MAAW,WAAU;MAAS,WAAU;gBAAxC,CACE,kBAAC,GAAD;OAAY,WAAU;iBAAtB,CACE,kBAAC,GAAD;QAAW,WAAU;kBAAsB;QAAqB,CAAA,EAChE,kBAAC,GAAD,EAAY,WAAU,oCAAqC,CAAA,CAChD;UACb,kBAAC,GAAD,EAAA,UACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CAAiD,KAAE,EAAU,gBAAgB,CAAO;UACxE,CAAA,CACJ;;KACZ,kBAAC,GAAD;MAAW,WAAU;MAAS,WAAU;gBAAxC,CACE,kBAAC,GAAD;OAAY,WAAU;iBAAtB,CACE,kBAAC,GAAD;QAAW,WAAU;kBAAsB;QAA6B,CAAA,EACxE,kBAAC,GAAD,EAAY,WAAU,+BAAgC,CAAA,CAC3C;UACb,kBAAC,GAAD,EAAA,UACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CAAiD,KAAE,EAAa,gBAAgB,CAAO;UAC3E,CAAA,CACJ;;KACZ,kBAAC,GAAD;MAAW,WAAU;MAAS,WAAU;gBAAxC,CACE,kBAAC,GAAD;OAAY,WAAU;iBAAtB,CACE,kBAAC,GAAD;QAAW,WAAU;kBAAsB;QAAuB,CAAA,EAClE,kBAAC,GAAD,EAAY,WAAU,oCAAqC,CAAA,CAChD;UACb,kBAAC,GAAD,EAAA,UACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CAAiD,MAC5C,IAAgB,GAAW,gBAAgB,CAC1C;UACM,CAAA,CACJ;;KACR;;GACN,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD,EAAA,UAAW,mBAA2B,CAAA,EAC3B,CAAA,EACb,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,QAAD,EAAA,UAAM,WAAc,CAAA;KACpB,kBAAC,QAAD,EAAA,UAAM,UAAa,CAAA;KACnB,kBAAC,QAAD;MAAM,WAAU;gBAAa;MAAa,CAAA;KAC1C,kBAAC,QAAD,EAAA,UAAM,YAAe,CAAA;KACrB,kBAAC,QAAD;MAAM,WAAU;gBAAc;MAAa,CAAA;KACvC;OACL,EAAS,KAAK,MACb,kBAAC,OAAD;IAEE,WAAU;cAFZ;KAIE,kBAAC,QAAD;MAAM,WAAU;gBAAe,EAAI;MAAc,CAAA;KACjD,kBAAC,QAAD;MAAM,WAAU;gBAAuB,EAAI;MAAkB,CAAA;KAC7D,kBAAC,QAAD;MAAM,WAAU;gBAAhB,CAA6B,KAAE,EAAI,OAAO,gBAAgB,CAAQ;;KAClE,kBAAC,QAAD;MAAM,WAAU;gBAAuB,EAAI;MAAe,CAAA;KAC1D,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,GAAD;OACE,SACE,EAAI,WAAW,SACX,YACA,EAAI,WAAW,YACb,gBACA;OAER,WAAU;iBAET,EAAI;OACC,CAAA;MACJ,CAAA;KACF;MArBC,EAAI,GAqBL,CACN,CACU,EAAA,CAAA,CACT,EAAA,CAAA;GACH"}
+{"version":3,"file":"PaymentsPaymentDashboardPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/PaymentsPaymentDashboardPagePage.tsx"],"sourcesContent":["import {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  GlassCard,\n  GradientText,\n  IllustratedEmptyState,\n  PagePurpose,\n  ResponsiveTable,\n  type ResponsiveTableColumn,\n} from '@burdenoff/fe-libs/ui';\nimport { CreditCard, DollarSign, Receipt, TrendingUp } from 'lucide-react';\nimport { useNavigate } from 'react-router-dom';\nimport { useCrewFoundryStore, type Invoice } from '../store/crewfoundryStore';\n\nconst RECENT_LIMIT = 5;\n\nconst statusVariant = (status: Invoice['status']) =>\n  status === 'paid' ? 'default' : status === 'overdue' ? 'destructive' : 'secondary';\n\nexport function PaymentsPaymentDashboardPagePage() {\n  const navigate = useNavigate();\n  const { invoices, payrollRecords } = useCrewFoundryStore();\n  const totalInvoiced = invoices.reduce((s, i) => s + i.amount, 0);\n  const totalPaid = invoices.filter((i) => i.status === 'paid').reduce((s, i) => s + i.amount, 0);\n  const totalPayroll = payrollRecords.reduce((s, r) => s + r.grossPay, 0);\n\n  const recentInvoices = [...invoices]\n    .sort((a, b) => (b.issueDate ?? '').localeCompare(a.issueDate ?? ''))\n    .slice(0, RECENT_LIMIT);\n\n  const columns: ResponsiveTableColumn<Invoice>[] = [\n    {\n      key: 'number',\n      header: 'Invoice',\n      priority: 'primary',\n      cell: (inv) => <span className=\"font-medium\">{inv.number}</span>,\n    },\n    {\n      key: 'client',\n      header: 'Client',\n      priority: 'secondary',\n      cell: (inv) => <span className=\"text-text-secondary\">{inv.clientName}</span>,\n    },\n    {\n      key: 'amount',\n      header: 'Amount',\n      priority: 'secondary',\n      headerClassName: 'text-right',\n      cellClassName: 'text-right',\n      cell: (inv) => <span>${inv.amount.toLocaleString()}</span>,\n    },\n    {\n      key: 'dueDate',\n      header: 'Due Date',\n      priority: 'hidden-on-mobile',\n      cell: (inv) => <span className=\"text-text-secondary\">{inv.dueDate}</span>,\n    },\n    {\n      key: 'status',\n      header: 'Status',\n      priority: 'secondary',\n      cell: (inv) => (\n        <Badge variant={statusVariant(inv.status)} className=\"text-[10px]\">\n          {inv.status}\n        </Badge>\n      ),\n    },\n  ];\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div>\n        <h1 className=\"text-2xl font-semibold\">\n          <GradientText>Payment Dashboard</GradientText>\n        </h1>\n        <p className=\"text-sm text-text-secondary\">Financial transactions and payment overview</p>\n        <PagePurpose className=\"mt-1\">A snapshot of all money movement — incoming payments, payouts, and balances so you understand your financial position at a glance.</PagePurpose>\n      </div>\n      <div className=\"grid gap-4 md:grid-cols-2 lg:grid-cols-4\">\n        <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Total Invoiced</CardTitle>\n            <Receipt className=\"h-4 w-4 text-text-secondary\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">${totalInvoiced.toLocaleString()}</div>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Collected</CardTitle>\n            <DollarSign className=\"h-4 w-4 text-status-success-text\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">${totalPaid.toLocaleString()}</div>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Payroll Processed</CardTitle>\n            <CreditCard className=\"h-4 w-4 text-text-secondary\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">${totalPayroll.toLocaleString()}</div>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Outstanding</CardTitle>\n            <TrendingUp className=\"h-4 w-4 text-status-warning-text\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">\n              ${(totalInvoiced - totalPaid).toLocaleString()}\n            </div>\n          </CardContent>\n        </GlassCard>\n      </div>\n      <Card>\n        <CardHeader className=\"flex flex-row items-center justify-between space-y-0\">\n          <CardTitle>Recent Invoices</CardTitle>\n          {invoices.length > RECENT_LIMIT && (\n            <Button variant=\"ghost\" size=\"sm\" onClick={() => navigate('../invoices-page')}>\n              View all\n            </Button>\n          )}\n        </CardHeader>\n        <CardContent>\n          <ResponsiveTable\n            data={recentInvoices}\n            rowKey={(inv) => inv.id}\n            columns={columns}\n            emptyState={\n              <IllustratedEmptyState\n                illustration=\"empty-data\"\n                title=\"No invoices yet\"\n                description=\"Invoices you create will show up here.\"\n              />\n            }\n          />\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":"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"}