@burdenoff/microfe-movethewheels 2026.925.2 → 2026.929.1

package/dist/pages/RoutesPage.js

@@ -1,84 +1,147 @@
-import { Navigation as e } from "../node_modules/lucide-react/dist/esm/icons/navigation.js";
-import { Plus as t } from "../node_modules/lucide-react/dist/esm/icons/plus.js";
-import { RefreshCw as n } from "../node_modules/lucide-react/dist/esm/icons/refresh-cw.js";
-import { joinPath as r } from "../utils/navigation.js";
-import { useMoveTheWheels as i } from "../providers/MoveTheWheelsProvider.js";
-import { useRouteStats as a, useRoutes as o } from "../hooks/useRoutes.js";
-import { Badge as s, Button as c } from "../components/ui.js";
-import { PageLayout as l } from "../components/PageLayout.js";
-import { ROUTE_STATUS_COLORS as u } from "../constants/index.js";
-import { StatusBadge as d } from "../components/StatusBadge.js";
-import { DataTable as f } from "../components/DataTable.js";
-import { formatDate as p } from "../utils/formatters.js";
-import { useDebouncedValue as m } from "../hooks/useDebouncedValue.js";
-import { useState as h } from "react";
-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";
+import { Filter as e } from "../node_modules/lucide-react/dist/esm/icons/filter.js";
+import { Navigation as t } from "../node_modules/lucide-react/dist/esm/icons/navigation.js";
+import { Plus as n } from "../node_modules/lucide-react/dist/esm/icons/plus.js";
+import { RefreshCw as r } from "../node_modules/lucide-react/dist/esm/icons/refresh-cw.js";
+import { joinPath as i } from "../utils/navigation.js";
+import { useMoveTheWheels as a } from "../providers/MoveTheWheelsProvider.js";
+import { useRouteStats as o, useRoutes as s } from "../hooks/useRoutes.js";
+import { Badge as c, Button as l, Card as u, CardContent as d, Select as f, SelectContent as p, SelectItem as m, SelectTrigger as h, SelectValue as g } from "../components/ui.js";
+import { PageLayout as _ } from "../components/PageLayout.js";
+import { ROUTE_STATUS_COLORS as v } from "../constants/index.js";
+import { StatusBadge as y } from "../components/StatusBadge.js";
+import { DataTable as b } from "../components/DataTable.js";
+import { formatDate as x } from "../utils/formatters.js";
+import { useDebouncedValue as S } from "../hooks/useDebouncedValue.js";
+import { useState as C } from "react";
+import { jsx as w, jsxs as T } from "react/jsx-runtime";
+import { CTAOverflowMenu as E, EmphasisPanel as D, PagePurpose as O } from "@burdenoff/fe-libs/ui";
 //#region src/movethewheels/pages/RoutesPage.tsx
-function x() {
-	let { basePath: x, navigate: S } = i(), [C, w] = h(0), [T, E] = h(25), [D, O] = h(""), k = m(D), { routes: A, totalRoutes: j, hasMore: M, isLoading: N, error: P, refetch: F } = o({
-		limit: T,
-		offset: C * T,
-		search: k || void 0
-	}), { stats: I } = a(), L = (e) => S?.(r(x, e));
-	return /* @__PURE__ */ _(l, {
+var k = [
+	{
+		value: "all",
+		label: "All statuses"
+	},
+	{
+		value: "planned",
+		label: "Planned"
+	},
+	{
+		value: "in_progress",
+		label: "In Progress"
+	},
+	{
+		value: "completed",
+		label: "Completed"
+	},
+	{
+		value: "cancelled",
+		label: "Cancelled"
+	}
+];
+function A() {
+	let { basePath: A, navigate: j } = a(), [M, N] = C(0), [P, F] = C(25), [I, L] = C(""), [R, z] = C("all"), B = S(I), { routes: V, totalRoutes: H, hasMore: U, isLoading: W, error: G, refetch: K } = s({
+		limit: P,
+		offset: M * P,
+		search: B || void 0,
+		status: R === "all" ? void 0 : R
+	}), q = R !== "all" || I.length > 0, { stats: J } = o(), Y = (e) => j?.(i(A, e));
+	return /* @__PURE__ */ T(_, {
 		title: "Routes",
-		subtitle: `${I.totalRoutes} routes`,
-		icon: /* @__PURE__ */ g(e, { size: 24 }),
-		headerActions: /* @__PURE__ */ g(v, {
+		subtitle: `${J.totalRoutes} routes`,
+		icon: /* @__PURE__ */ w(t, { size: 24 }),
+		headerActions: /* @__PURE__ */ w(E, {
 			primary: {
 				label: "Create Route",
-				icon: /* @__PURE__ */ g(t, { size: 16 }),
-				onSelect: () => L("routes/new")
+				icon: /* @__PURE__ */ w(n, { size: 16 }),
+				onSelect: () => Y("routes/new")
 			},
 			actions: [{
 				label: "Refresh",
-				icon: /* @__PURE__ */ g(n, { size: 16 }),
-				onSelect: () => F()
+				icon: /* @__PURE__ */ w(r, { size: 16 }),
+				onSelect: () => K()
 			}]
 		}),
 		children: [
-			/* @__PURE__ */ g(b, {
-				icon: /* @__PURE__ */ g(e, { size: 18 }),
+			/* @__PURE__ */ w(O, {
+				icon: /* @__PURE__ */ w(t, { size: 18 }),
 				children: "Routes group multiple delivery stops into an optimized driving plan. Build a route to batch nearby drop-offs, cut distance and fuel, and give drivers a single ordered itinerary — then open one to review stops, distance and optimization status."
 			}),
-			/* @__PURE__ */ _(y, { children: [/* @__PURE__ */ g("p", {
+			/* @__PURE__ */ T(D, { children: [/* @__PURE__ */ w("p", {
 				className: "text-sm font-medium text-text-secondary",
 				children: "Routes at a glance"
-			}), /* @__PURE__ */ _("div", {
+			}), /* @__PURE__ */ T("div", {
 				className: "mt-3 grid grid-cols-3 gap-4",
 				children: [
-					/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("p", {
+					/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
 						className: "text-2xl font-bold text-text-primary tabular-nums",
-						children: I.totalRoutes
-					}), /* @__PURE__ */ g("p", {
+						children: J.totalRoutes
+					}), /* @__PURE__ */ w("p", {
 						className: "text-xs text-text-secondary",
 						children: "Total routes"
 					})] }),
-					/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("p", {
+					/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
 						className: "text-2xl font-bold text-text-primary tabular-nums",
-						children: I.inProgressRoutes
-					}), /* @__PURE__ */ g("p", {
+						children: J.inProgressRoutes
+					}), /* @__PURE__ */ w("p", {
 						className: "text-xs text-text-secondary",
 						children: "In progress"
 					})] }),
-					/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("p", {
+					/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
 						className: "text-2xl font-bold text-text-primary tabular-nums",
-						children: I.optimizedRoutes
-					}), /* @__PURE__ */ g("p", {
+						children: J.optimizedRoutes
+					}), /* @__PURE__ */ w("p", {
 						className: "text-xs text-text-secondary",
 						children: "Optimized"
 					})] })
 				]
 			})] }),
-			/* @__PURE__ */ g(f, {
+			/* @__PURE__ */ w(u, { children: /* @__PURE__ */ w(d, {
+				className: "p-4",
+				children: /* @__PURE__ */ T("div", {
+					className: "flex flex-wrap items-center gap-4",
+					children: [
+						/* @__PURE__ */ T("div", {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ w(e, {
+								size: 16,
+								className: "text-text-secondary"
+							}), /* @__PURE__ */ w("span", {
+								className: "text-sm font-medium",
+								children: "Filters:"
+							})]
+						}),
+						/* @__PURE__ */ T(f, {
+							value: R,
+							onValueChange: (e) => {
+								z(e), N(0);
+							},
+							children: [/* @__PURE__ */ w(h, {
+								className: "w-[180px]",
+								children: /* @__PURE__ */ w(g, { placeholder: "Status" })
+							}), /* @__PURE__ */ w(p, { children: k.map((e) => /* @__PURE__ */ w(m, {
+								value: e.value,
+								children: e.label
+							}, e.value)) })]
+						}),
+						q && /* @__PURE__ */ w(l, {
+							variant: "ghost",
+							size: "sm",
+							onClick: () => {
+								z("all"), L(""), N(0);
+							},
+							children: "Clear filters"
+						})
+					]
+				})
+			}) }),
+			/* @__PURE__ */ w(b, {
 				columns: [
 					{
 						id: "name",
 						header: "Route Name",
 						accessorKey: "name",
 						sortable: !0,
-						cell: (e) => /* @__PURE__ */ g("span", {
+						cell: (e) => /* @__PURE__ */ w("span", {
 							className: "font-medium",
 							children: e.name
 						})
@@ -88,15 +151,15 @@ function x() {
 						header: "Status",
 						accessorKey: "status",
 						sortable: !0,
-						cell: (e) => /* @__PURE__ */ g(d, {
+						cell: (e) => /* @__PURE__ */ w(y, {
 							status: e.status,
-							customColors: u[e.status]
+							customColors: v[e.status]
 						})
 					},
 					{
 						id: "stops",
 						header: "Stops",
-						cell: (e) => /* @__PURE__ */ _(s, {
+						cell: (e) => /* @__PURE__ */ T(c, {
 							variant: "secondary",
 							children: [e.stops.length, " stops"]
 						})
@@ -116,7 +179,7 @@ function x() {
 					{
 						id: "optimized",
 						header: "Optimized",
-						cell: (e) => /* @__PURE__ */ g(s, {
+						cell: (e) => /* @__PURE__ */ w(c, {
 							variant: e.optimized ? "default" : "outline",
 							children: e.optimized ? "Yes" : "No"
 						})
@@ -126,36 +189,36 @@ function x() {
 						header: "Created",
 						accessorKey: "createdAt",
 						sortable: !0,
-						cell: (e) => p(e.createdAt, "short")
+						cell: (e) => x(e.createdAt, "short")
 					}
 				],
-				data: A,
-				isLoading: N,
-				error: P,
-				onRetry: F,
+				data: V,
+				isLoading: W,
+				error: G,
+				onRetry: K,
 				searchable: !0,
 				searchPlaceholder: "Search routes...",
 				searchFields: ["name"],
-				searchQuery: D,
+				searchQuery: I,
 				onSearchQueryChange: (e) => {
-					O(e), w(0);
+					L(e), N(0);
 				},
-				onRowClick: (e) => L(`routes/${e.id}`),
+				onRowClick: (e) => Y(`routes/${e.id}`),
 				getRowId: (e) => e.id,
-				pageIndex: C,
-				pageSize: T,
-				onPageChange: w,
+				pageIndex: M,
+				pageSize: P,
+				onPageChange: N,
 				onPageSizeChange: (e) => {
-					E(e), w(0);
+					F(e), N(0);
 				},
-				totalItems: j,
-				hasNextPage: M,
+				totalItems: H,
+				hasNextPage: U,
 				emptyIllustration: "empty-data",
 				emptyTitle: "No routes yet",
 				emptyDescription: "Create a route to batch deliveries into an optimized driving plan.",
-				emptyAction: /* @__PURE__ */ _(c, {
-					onClick: () => L("routes/new"),
-					children: [/* @__PURE__ */ g(t, {
+				emptyAction: /* @__PURE__ */ T(l, {
+					onClick: () => Y("routes/new"),
+					children: [/* @__PURE__ */ w(n, {
 						size: 16,
 						className: "mr-1.5"
 					}), "Create Route"]
@@ -165,4 +228,4 @@ function x() {
 	});
 }
 //#endregion
-export { x as default };
+export { A as default };