@burdenoff/microfe-movethewheels 2026.625.1 → 2026.626.2

package/dist/CustomerDetailsPage-I6cdDHUi.js

@@ -0,0 +1,265 @@
+import { d as e, f as t, g as n, h as r, i, it as a, l as o, n as s, r as c, u as l } from "./PageLayout-D3N8MCTm.js";
+import { t as u } from "./arrow-left-CBpZKkpq.js";
+import { t as d } from "./file-text-C8Uioy11.js";
+import { n as f, t as p } from "./phone-DV4StZiA.js";
+import { t as m } from "./map-pin-BSaf5IDL.js";
+import { t as h } from "./square-pen-hLIbFQFV.js";
+import { t as g } from "./star-YsVV3MNQ.js";
+import { t as _ } from "./users-g2N0eL-Z.js";
+import { r as v } from "./graphqlClient-CdJyR_ed.js";
+import { t as y } from "./useCustomers-bS3a4ytk.js";
+import { i as b } from "./StatusBadge-CijYQXtb.js";
+import { r as x, t as S } from "./formatters-_vJlC-47.js";
+import { t as C } from "./navigation-BgnOfsVd.js";
+import { useParams as w } from "react-router-dom";
+import { jsx as T, jsxs as E } from "react/jsx-runtime";
+import { EmphasisPanel as D, NextSteps as O, PagePurpose as k } from "@burdenoff/fe-libs/ui";
+//#region node_modules/lucide-react/dist/esm/icons/building.js
+var A = a("Building", [
+	["rect", {
+		width: "16",
+		height: "20",
+		x: "4",
+		y: "2",
+		rx: "2",
+		ry: "2",
+		key: "76otgf"
+	}],
+	["path", {
+		d: "M9 22v-4h6v4",
+		key: "r93iot"
+	}],
+	["path", {
+		d: "M8 6h.01",
+		key: "1dz90k"
+	}],
+	["path", {
+		d: "M16 6h.01",
+		key: "1x0f13"
+	}],
+	["path", {
+		d: "M12 6h.01",
+		key: "1vi96p"
+	}],
+	["path", {
+		d: "M12 10h.01",
+		key: "1nrarc"
+	}],
+	["path", {
+		d: "M12 14h.01",
+		key: "1etili"
+	}],
+	["path", {
+		d: "M16 10h.01",
+		key: "1m94wz"
+	}],
+	["path", {
+		d: "M16 14h.01",
+		key: "1gbofw"
+	}],
+	["path", {
+		d: "M8 10h.01",
+		key: "19clt8"
+	}],
+	["path", {
+		d: "M8 14h.01",
+		key: "6423bh"
+	}]
+]);
+//#endregion
+//#region src/movethewheels/pages/CustomerDetailsPage.tsx
+function j() {
+	let { customerId: a } = w(), { basePath: j, navigate: M } = v(), { customer: N, isLoading: P, error: F, refetch: I } = y(a), L = () => M?.(C(j, "customers")), R = (e) => M?.(C(j, e));
+	return a ? P ? /* @__PURE__ */ T(c, { message: "Loading customer details..." }) : F || !N ? /* @__PURE__ */ T(s, {
+		title: "Customer not found",
+		onRetry: I
+	}) : /* @__PURE__ */ E(i, {
+		title: N.name,
+		subtitle: N.company || N.email,
+		icon: /* @__PURE__ */ T(_, { size: 24 }),
+		headerActions: /* @__PURE__ */ E("div", {
+			className: "flex gap-2",
+			children: [/* @__PURE__ */ E(l, {
+				variant: "outline",
+				onClick: L,
+				children: [/* @__PURE__ */ T(u, { size: 16 }), " Back"]
+			}), /* @__PURE__ */ E(l, { children: [/* @__PURE__ */ T(h, { size: 16 }), " Edit"] })]
+		}),
+		headerContent: /* @__PURE__ */ E("div", {
+			className: "flex items-center gap-4",
+			children: [
+				/* @__PURE__ */ T(b, { type: N.type }),
+				/* @__PURE__ */ T(o, {
+					variant: N.isActive ? "default" : "secondary",
+					children: N.isActive ? "Active" : "Inactive"
+				}),
+				/* @__PURE__ */ E("div", {
+					className: "flex items-center gap-1",
+					children: [/* @__PURE__ */ T(g, {
+						size: 16,
+						className: "text-yellow-500 fill-yellow-500"
+					}), /* @__PURE__ */ T("span", {
+						className: "font-medium",
+						children: N.rating.toFixed(1)
+					})]
+				})
+			]
+		}),
+		children: [
+			/* @__PURE__ */ T(k, {
+				icon: /* @__PURE__ */ T(_, { size: 18 }),
+				children: "Everything you know about this customer — how to reach them, where they are, and their account standing. Use it to confirm contact details before a delivery, check their rating, or book their next order."
+			}),
+			/* @__PURE__ */ T(O, {
+				storageKey: "movethewheels-customer-details",
+				steps: [{
+					id: "new-order",
+					label: "Book a delivery for this customer",
+					description: "Start a new order pre-filled for this account.",
+					icon: /* @__PURE__ */ T(d, { size: 16 }),
+					onClick: () => R("orders/new")
+				}, {
+					id: "edit",
+					label: "Update contact details",
+					description: "Keep email, phone and address current.",
+					icon: /* @__PURE__ */ T(h, { size: 16 }),
+					onClick: () => {}
+				}]
+			}),
+			/* @__PURE__ */ E("div", {
+				className: "grid grid-cols-1 lg:grid-cols-3 gap-6",
+				children: [/* @__PURE__ */ E("div", {
+					className: "lg:col-span-2 space-y-6",
+					children: [
+						/* @__PURE__ */ E(D, { children: [/* @__PURE__ */ T("h2", {
+							className: "text-base font-semibold text-text-primary mb-4",
+							children: "Contact Information"
+						}), /* @__PURE__ */ E("div", {
+							className: "grid grid-cols-1 md:grid-cols-2 gap-6",
+							children: [/* @__PURE__ */ E("div", {
+								className: "space-y-4",
+								children: [/* @__PURE__ */ E("div", {
+									className: "flex items-center gap-3",
+									children: [/* @__PURE__ */ T(f, {
+										size: 18,
+										className: "text-text-secondary"
+									}), /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+										className: "text-sm text-text-secondary",
+										children: "Email"
+									}), /* @__PURE__ */ T("p", {
+										className: "font-medium",
+										children: N.email
+									})] })]
+								}), /* @__PURE__ */ E("div", {
+									className: "flex items-center gap-3",
+									children: [/* @__PURE__ */ T(p, {
+										size: 18,
+										className: "text-text-secondary"
+									}), /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+										className: "text-sm text-text-secondary",
+										children: "Phone"
+									}), /* @__PURE__ */ T("p", {
+										className: "font-medium",
+										children: N.phone
+									})] })]
+								})]
+							}), /* @__PURE__ */ E("div", {
+								className: "space-y-4",
+								children: [N.company && /* @__PURE__ */ E("div", {
+									className: "flex items-center gap-3",
+									children: [/* @__PURE__ */ T(A, {
+										size: 18,
+										className: "text-text-secondary"
+									}), /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+										className: "text-sm text-text-secondary",
+										children: "Company"
+									}), /* @__PURE__ */ T("p", {
+										className: "font-medium",
+										children: N.company
+									})] })]
+								}), N.website && /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+									className: "text-sm text-text-secondary",
+									children: "Website"
+								}), /* @__PURE__ */ T("a", {
+									href: N.website,
+									className: "text-primary hover:underline",
+									children: N.website
+								})] })]
+							})]
+						})] }),
+						/* @__PURE__ */ E(e, { children: [/* @__PURE__ */ T(r, { children: /* @__PURE__ */ E(n, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ T(m, { size: 18 }), " Address"]
+						}) }), /* @__PURE__ */ T(t, { children: /* @__PURE__ */ T("p", { children: S(N.address) }) })] }),
+						N.notes && /* @__PURE__ */ E(e, { children: [/* @__PURE__ */ T(r, { children: /* @__PURE__ */ E(n, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ T(d, { size: 18 }), " Notes"]
+						}) }), /* @__PURE__ */ T(t, { children: /* @__PURE__ */ T("p", { children: N.notes }) })] })
+					]
+				}), /* @__PURE__ */ E("div", {
+					className: "space-y-6",
+					children: [/* @__PURE__ */ E(e, { children: [/* @__PURE__ */ T(r, { children: /* @__PURE__ */ T(n, { children: "Business Details" }) }), /* @__PURE__ */ E(t, {
+						className: "space-y-3",
+						children: [
+							N.businessLicense && /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+								className: "text-sm text-text-secondary",
+								children: "Business License"
+							}), /* @__PURE__ */ T("p", {
+								className: "font-mono",
+								children: N.businessLicense
+							})] }),
+							N.taxId && /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+								className: "text-sm text-text-secondary",
+								children: "Tax ID"
+							}), /* @__PURE__ */ T("p", {
+								className: "font-mono",
+								children: N.taxId
+							})] }),
+							/* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+								className: "text-sm text-text-secondary",
+								children: "Preferred Contact"
+							}), /* @__PURE__ */ T("p", {
+								className: "capitalize",
+								children: N.preferredContactMethod
+							})] }),
+							/* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+								className: "text-sm text-text-secondary",
+								children: "Marketing Opt-in"
+							}), /* @__PURE__ */ T(o, {
+								variant: N.marketingOptIn ? "default" : "secondary",
+								children: N.marketingOptIn ? "Yes" : "No"
+							})] })
+						]
+					})] }), /* @__PURE__ */ E(e, { children: [/* @__PURE__ */ T(r, { children: /* @__PURE__ */ T(n, { children: "Account Info" }) }), /* @__PURE__ */ E(t, {
+						className: "space-y-3",
+						children: [/* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+							className: "text-sm text-text-secondary",
+							children: "Created"
+						}), /* @__PURE__ */ T("p", { children: x(N.createdAt, "full") })] }), /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+							className: "text-sm text-text-secondary",
+							children: "Last Updated"
+						}), /* @__PURE__ */ T("p", { children: x(N.updatedAt, "relative") })] })]
+					})] })]
+				})]
+			})
+		]
+	}) : /* @__PURE__ */ T(i, {
+		title: "New Customer",
+		subtitle: "Add a new customer",
+		icon: /* @__PURE__ */ T(_, { size: 24 }),
+		headerActions: /* @__PURE__ */ E(l, {
+			variant: "outline",
+			onClick: L,
+			children: [/* @__PURE__ */ T(u, { size: 16 }), " Back"]
+		}),
+		children: /* @__PURE__ */ T(e, { children: /* @__PURE__ */ T(t, {
+			className: "p-8 text-center",
+			children: /* @__PURE__ */ T("p", {
+				className: "text-text-secondary",
+				children: "Customer creation form would go here"
+			})
+		}) })
+	});
+}
+//#endregion
+export { j as default };

package/dist/CustomersPage-CGGfD4ki.js

@@ -0,0 +1,163 @@
+import { i as e, l as t, o as n, s as r, u as i } from "./PageLayout-D3N8MCTm.js";
+import { t as a } from "./DataTable-CD9ZhpLB.js";
+import { t as o } from "./download-Dpa9vqoG.js";
+import { t as s } from "./plus-Dl1rLeJR.js";
+import { t as c } from "./refresh-cw-CWfERAit.js";
+import { t as l } from "./star-YsVV3MNQ.js";
+import { t as u } from "./users-g2N0eL-Z.js";
+import { r as d } from "./graphqlClient-CdJyR_ed.js";
+import { r as f } from "./useCustomers-bS3a4ytk.js";
+import { i as p } from "./StatusBadge-CijYQXtb.js";
+import { r as m } from "./formatters-_vJlC-47.js";
+import { t as h } from "./navigation-BgnOfsVd.js";
+import { jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { CTAOverflowMenu as v, EmphasisPanel as y, PagePurpose as b } from "@burdenoff/fe-libs/ui";
+//#region src/movethewheels/pages/CustomersPage.tsx
+function x() {
+	let { basePath: x, navigate: S } = d(), { customers: C, totalCustomers: w, isLoading: T, refetch: E } = f({ limit: 100 }), D = (e) => S?.(h(x, e));
+	return /* @__PURE__ */ _(e, {
+		title: "Customers",
+		subtitle: `${w} customers`,
+		icon: /* @__PURE__ */ g(u, { size: 24 }),
+		headerActions: /* @__PURE__ */ g(v, {
+			primary: {
+				label: "Add Customer",
+				icon: /* @__PURE__ */ g(s, { size: 16 }),
+				onSelect: () => D("customers/new")
+			},
+			actions: [{
+				label: "Refresh",
+				icon: /* @__PURE__ */ g(c, { size: 16 }),
+				onSelect: () => E()
+			}, {
+				label: "Export",
+				icon: /* @__PURE__ */ g(o, { size: 16 }),
+				onSelect: () => {}
+			}]
+		}),
+		children: [
+			/* @__PURE__ */ g(b, {
+				icon: /* @__PURE__ */ g(u, { size: 18 }),
+				children: "The businesses and individuals you deliver for. Keep contact details, locations and satisfaction ratings here, and open a customer to see their order history before booking the next shipment."
+			}),
+			/* @__PURE__ */ _(y, { children: [/* @__PURE__ */ g("p", {
+				className: "text-sm font-medium text-text-secondary",
+				children: "Customer base at a glance"
+			}), /* @__PURE__ */ _("div", {
+				className: "mt-3 grid grid-cols-3 gap-4",
+				children: [
+					/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("p", {
+						className: "text-2xl font-bold text-text-primary tabular-nums",
+						children: w
+					}), /* @__PURE__ */ g("p", {
+						className: "text-xs text-text-secondary",
+						children: "Total customers"
+					})] }),
+					/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("p", {
+						className: "text-2xl font-bold text-text-primary tabular-nums",
+						children: C.filter((e) => e.isActive).length
+					}), /* @__PURE__ */ g("p", {
+						className: "text-xs text-text-secondary",
+						children: "Active"
+					})] }),
+					/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("p", {
+						className: "text-2xl font-bold text-text-primary tabular-nums",
+						children: C.filter((e) => e.type === "b2b").length
+					}), /* @__PURE__ */ g("p", {
+						className: "text-xs text-text-secondary",
+						children: "Business accounts"
+					})] })
+				]
+			})] }),
+			/* @__PURE__ */ g(a, {
+				columns: [
+					{
+						id: "customer",
+						header: "Customer",
+						cell: (e) => /* @__PURE__ */ _("div", {
+							className: "flex items-center gap-3",
+							children: [/* @__PURE__ */ g(n, { children: /* @__PURE__ */ g(r, { children: e.name.split(" ").map((e) => e[0]).join("") }) }), /* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("p", {
+								className: "font-medium",
+								children: e.name
+							}), /* @__PURE__ */ g("p", {
+								className: "text-sm text-text-secondary",
+								children: e.email
+							})] })]
+						})
+					},
+					{
+						id: "type",
+						header: "Type",
+						accessorKey: "type",
+						cell: (e) => /* @__PURE__ */ g(p, { type: e.type })
+					},
+					{
+						id: "company",
+						header: "Company",
+						accessorKey: "company",
+						cell: (e) => e.company || "-"
+					},
+					{
+						id: "phone",
+						header: "Phone",
+						accessorKey: "phone"
+					},
+					{
+						id: "location",
+						header: "Location",
+						cell: (e) => `${e.address.city}, ${e.address.state}`
+					},
+					{
+						id: "rating",
+						header: "Rating",
+						cell: (e) => /* @__PURE__ */ _("div", {
+							className: "flex items-center gap-1",
+							children: [/* @__PURE__ */ g(l, {
+								size: 14,
+								className: "text-yellow-500 fill-yellow-500"
+							}), /* @__PURE__ */ g("span", { children: e.rating.toFixed(1) })]
+						})
+					},
+					{
+						id: "status",
+						header: "Status",
+						cell: (e) => /* @__PURE__ */ g(t, {
+							variant: e.isActive ? "default" : "secondary",
+							children: e.isActive ? "Active" : "Inactive"
+						})
+					},
+					{
+						id: "created",
+						header: "Created",
+						accessorKey: "createdAt",
+						sortable: !0,
+						cell: (e) => m(e.createdAt, "short")
+					}
+				],
+				data: C,
+				isLoading: T,
+				searchable: !0,
+				searchPlaceholder: "Search customers...",
+				searchFields: [
+					"name",
+					"email",
+					"company"
+				],
+				onRowClick: (e) => D(`customers/${e.id}`),
+				getRowId: (e) => e.id,
+				emptyIllustration: "empty-people",
+				emptyTitle: "No customers yet",
+				emptyDescription: "Add your first customer to start booking deliveries for them.",
+				emptyAction: /* @__PURE__ */ _(i, {
+					onClick: () => D("customers/new"),
+					children: [/* @__PURE__ */ g(s, {
+						size: 16,
+						className: "mr-1.5"
+					}), "Add Customer"]
+				})
+			})
+		]
+	});
+}
+//#endregion
+export { x as default };