@burdenoff/microfe-movethewheels 2026.626.2 → 2026.703.2

package/dist/VehicleDetailsPage-Bceo5oz3.js

@@ -0,0 +1,410 @@
+import { A as e, F as t, I as n, L as r, M as i, P as a, R as o, ct as s, d as c, f as l, g as u, h as d, i as f, j as p, l as m, n as h, ot as g, r as _, u as v } from "./PageLayout-D4LDHJJq.js";
+import { t as y } from "./arrow-left-n48Y-Wis.js";
+import { t as b } from "./file-text-DWWY6_f5.js";
+import { n as x, t as S } from "./wrench-CANXWxF-.js";
+import { t as C } from "./map-pin-BGiCvyCs.js";
+import { t as w } from "./save-CojywNhG.js";
+import { t as T } from "./square-pen-CopE9GmB.js";
+import { t as E } from "./truck-C0v_hbLR.js";
+import { a as D, r as O } from "./useFleet-DKqXZ16m.js";
+import { a as k, r as A } from "./StatusBadge-BZurYHMy.js";
+import { r as j } from "./formatters-CF2S2l1m.js";
+import { t as M } from "./FormError-BlOjnXOq.js";
+import { useState as N } from "react";
+import { useParams as P } from "react-router-dom";
+import { jsx as F, jsxs as I } from "react/jsx-runtime";
+import { EmphasisPanel as L, NextSteps as R, PagePurpose as z } from "@burdenoff/fe-libs/ui";
+//#region src/movethewheels/pages/VehicleDetailsPage.tsx
+var B = [
+	{
+		value: "TRUCK",
+		label: "Truck"
+	},
+	{
+		value: "VAN",
+		label: "Van"
+	},
+	{
+		value: "MOTORCYCLE",
+		label: "Motorcycle"
+	},
+	{
+		value: "BICYCLE",
+		label: "Bicycle"
+	},
+	{
+		value: "FLATBED",
+		label: "Flatbed"
+	},
+	{
+		value: "REFRIGERATED",
+		label: "Refrigerated"
+	},
+	{
+		value: "SEMI_TRAILER",
+		label: "Semi-Trailer"
+	},
+	{
+		value: "DRONE",
+		label: "Drone"
+	}
+];
+function V() {
+	let { basePath: i, navigate: c } = g(), { createVehicle: l } = O(), [u, d] = N({
+		vehicleNumber: "",
+		type: "VAN",
+		make: "",
+		model: "",
+		licensePlate: ""
+	}), [m, h] = N(!1), [_, b] = N(null), x = () => c?.(s(i, "fleet/vehicles")), S = async (e) => {
+		if (e.preventDefault(), !u.vehicleNumber.trim()) {
+			b("Vehicle number is required.");
+			return;
+		}
+		h(!0), b(null);
+		try {
+			let e = await l({
+				vehicleNumber: u.vehicleNumber.trim(),
+				type: u.type,
+				make: u.make.trim() || void 0,
+				model: u.model.trim() || void 0,
+				licensePlate: u.licensePlate.trim() || void 0
+			});
+			c?.(s(i, `fleet/vehicles/${e.id}`));
+		} catch (e) {
+			console.error("Failed to create vehicle:", e), b(e instanceof Error ? e.message : "Failed to create vehicle. Please try again."), h(!1);
+		}
+	};
+	return /* @__PURE__ */ I(f, {
+		title: "Add Vehicle",
+		subtitle: "Register a new vehicle in your fleet",
+		icon: /* @__PURE__ */ F(E, { size: 24 }),
+		headerActions: /* @__PURE__ */ I("div", {
+			className: "flex gap-2",
+			children: [/* @__PURE__ */ I(v, {
+				variant: "outline",
+				onClick: x,
+				disabled: m,
+				children: [/* @__PURE__ */ F(y, { size: 16 }), " Cancel"]
+			}), /* @__PURE__ */ I(v, {
+				onClick: S,
+				disabled: m,
+				children: [
+					/* @__PURE__ */ F(w, { size: 16 }),
+					" ",
+					m ? "Saving..." : "Add Vehicle"
+				]
+			})]
+		}),
+		children: [/* @__PURE__ */ F(z, {
+			icon: /* @__PURE__ */ F(E, { size: 18 }),
+			children: "Add a vehicle so it can be assigned to deliveries and routes. Give it a fleet number and type to start — make, model and plate help identify it on the road."
+		}), /* @__PURE__ */ I("form", {
+			onSubmit: S,
+			className: "max-w-2xl space-y-6",
+			children: [/* @__PURE__ */ F(M, { message: _ }), /* @__PURE__ */ I(L, { children: [/* @__PURE__ */ F("h2", {
+				className: "text-base font-semibold text-text-primary mb-4",
+				children: "Vehicle Details"
+			}), /* @__PURE__ */ I("div", {
+				className: "space-y-4",
+				children: [/* @__PURE__ */ I("div", {
+					className: "grid grid-cols-1 md:grid-cols-2 gap-4",
+					children: [/* @__PURE__ */ I("div", {
+						className: "space-y-2",
+						children: [/* @__PURE__ */ I(p, {
+							htmlFor: "vehicleNumber",
+							children: ["Vehicle Number ", /* @__PURE__ */ F("span", {
+								className: "text-status-error-text",
+								children: "*"
+							})]
+						}), /* @__PURE__ */ F(e, {
+							id: "vehicleNumber",
+							value: u.vehicleNumber,
+							onChange: (e) => d((t) => ({
+								...t,
+								vehicleNumber: e.target.value
+							})),
+							placeholder: "MTW-001",
+							required: !0
+						})]
+					}), /* @__PURE__ */ I("div", {
+						className: "space-y-2",
+						children: [/* @__PURE__ */ I(p, {
+							htmlFor: "type",
+							children: ["Type ", /* @__PURE__ */ F("span", {
+								className: "text-status-error-text",
+								children: "*"
+							})]
+						}), /* @__PURE__ */ I(a, {
+							value: u.type,
+							onValueChange: (e) => d((t) => ({
+								...t,
+								type: e
+							})),
+							children: [/* @__PURE__ */ F(r, {
+								id: "type",
+								children: /* @__PURE__ */ F(o, {})
+							}), /* @__PURE__ */ F(t, { children: B.map((e) => /* @__PURE__ */ F(n, {
+								value: e.value,
+								children: e.label
+							}, e.value)) })]
+						})]
+					})]
+				}), /* @__PURE__ */ I("div", {
+					className: "grid grid-cols-1 md:grid-cols-3 gap-4",
+					children: [
+						/* @__PURE__ */ I("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ F(p, {
+								htmlFor: "make",
+								children: "Make"
+							}), /* @__PURE__ */ F(e, {
+								id: "make",
+								value: u.make,
+								onChange: (e) => d((t) => ({
+									...t,
+									make: e.target.value
+								})),
+								placeholder: "Ford"
+							})]
+						}),
+						/* @__PURE__ */ I("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ F(p, {
+								htmlFor: "model",
+								children: "Model"
+							}), /* @__PURE__ */ F(e, {
+								id: "model",
+								value: u.model,
+								onChange: (e) => d((t) => ({
+									...t,
+									model: e.target.value
+								})),
+								placeholder: "Transit"
+							})]
+						}),
+						/* @__PURE__ */ I("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ F(p, {
+								htmlFor: "licensePlate",
+								children: "License Plate"
+							}), /* @__PURE__ */ F(e, {
+								id: "licensePlate",
+								value: u.licensePlate,
+								onChange: (e) => d((t) => ({
+									...t,
+									licensePlate: e.target.value
+								})),
+								placeholder: "ABC-1234"
+							})]
+						})
+					]
+				})]
+			})] })]
+		})]
+	});
+}
+function H() {
+	let { vehicleId: e } = P(), { basePath: t, navigate: n } = g(), { vehicle: r, isLoading: a, error: o, refetch: p } = D(e), w = () => n?.(s(t, "fleet/vehicles")), O = (e) => n?.(s(t, e));
+	return e ? a ? /* @__PURE__ */ F(_, { message: "Loading vehicle details..." }) : o || !r ? /* @__PURE__ */ F(h, {
+		title: "Vehicle not found",
+		onRetry: p
+	}) : /* @__PURE__ */ I(f, {
+		title: r.vehicleNumber,
+		subtitle: `${r.make} ${r.model} (${r.year})`,
+		icon: /* @__PURE__ */ F(E, { size: 24 }),
+		headerActions: /* @__PURE__ */ I("div", {
+			className: "flex gap-2",
+			children: [/* @__PURE__ */ I(v, {
+				variant: "outline",
+				onClick: w,
+				children: [/* @__PURE__ */ F(y, { size: 16 }), " Back"]
+			}), /* @__PURE__ */ I(v, { children: [/* @__PURE__ */ F(T, { size: 16 }), " Edit"] })]
+		}),
+		headerContent: /* @__PURE__ */ I("div", {
+			className: "flex gap-2",
+			children: [/* @__PURE__ */ F(A, {
+				status: r.status,
+				type: "vehicle"
+			}), /* @__PURE__ */ F(k, { type: r.type })]
+		}),
+		children: [
+			/* @__PURE__ */ F(z, {
+				icon: /* @__PURE__ */ F(E, { size: 18 }),
+				children: "The full record for this vehicle — specs, capacity, fuel and mileage, maintenance schedule and current location. Use it to confirm a vehicle is fuelled, serviced and the right size before dispatching it on a delivery."
+			}),
+			/* @__PURE__ */ F(R, {
+				storageKey: "movethewheels-vehicle-details",
+				steps: [{
+					id: "assign",
+					label: "Assign to a delivery",
+					description: "Put this vehicle on an order that fits its capacity.",
+					icon: /* @__PURE__ */ F(C, { size: 16 }),
+					onClick: () => O("orders")
+				}, {
+					id: "maintenance",
+					label: "Schedule maintenance",
+					description: "Keep it road-ready and compliant.",
+					icon: /* @__PURE__ */ F(S, { size: 16 }),
+					onClick: () => {}
+				}]
+			}),
+			/* @__PURE__ */ I("div", {
+				className: "grid grid-cols-1 lg:grid-cols-3 gap-6",
+				children: [/* @__PURE__ */ I("div", {
+					className: "lg:col-span-2 space-y-6",
+					children: [
+						/* @__PURE__ */ I(L, { children: [/* @__PURE__ */ F("h2", {
+							className: "text-base font-semibold text-text-primary mb-4",
+							children: "Vehicle Information"
+						}), /* @__PURE__ */ I("div", {
+							className: "grid grid-cols-2 md:grid-cols-4 gap-6",
+							children: [
+								/* @__PURE__ */ I("div", { children: [/* @__PURE__ */ F("p", {
+									className: "text-sm text-text-secondary",
+									children: "Type"
+								}), /* @__PURE__ */ F("p", {
+									className: "font-medium capitalize",
+									children: r.type
+								})] }),
+								/* @__PURE__ */ I("div", { children: [/* @__PURE__ */ F("p", {
+									className: "text-sm text-text-secondary",
+									children: "Make"
+								}), /* @__PURE__ */ F("p", {
+									className: "font-medium",
+									children: r.make
+								})] }),
+								/* @__PURE__ */ I("div", { children: [/* @__PURE__ */ F("p", {
+									className: "text-sm text-text-secondary",
+									children: "Model"
+								}), /* @__PURE__ */ F("p", {
+									className: "font-medium",
+									children: r.model
+								})] }),
+								/* @__PURE__ */ I("div", { children: [/* @__PURE__ */ F("p", {
+									className: "text-sm text-text-secondary",
+									children: "Year"
+								}), /* @__PURE__ */ F("p", {
+									className: "font-medium",
+									children: r.year
+								})] })
+							]
+						})] }),
+						/* @__PURE__ */ I(c, { children: [/* @__PURE__ */ F(d, { children: /* @__PURE__ */ F(u, { children: "Capacity" }) }), /* @__PURE__ */ F(l, { children: /* @__PURE__ */ I("div", {
+							className: "grid grid-cols-3 gap-6",
+							children: [
+								/* @__PURE__ */ I("div", { children: [/* @__PURE__ */ F("p", {
+									className: "text-sm text-text-secondary",
+									children: "Weight"
+								}), /* @__PURE__ */ I("p", {
+									className: "text-2xl font-bold",
+									children: [r.capacity.weight, /* @__PURE__ */ F("span", {
+										className: "text-sm font-normal",
+										children: " kg"
+									})]
+								})] }),
+								/* @__PURE__ */ I("div", { children: [/* @__PURE__ */ F("p", {
+									className: "text-sm text-text-secondary",
+									children: "Volume"
+								}), /* @__PURE__ */ I("p", {
+									className: "text-2xl font-bold",
+									children: [r.capacity.volume, /* @__PURE__ */ F("span", {
+										className: "text-sm font-normal",
+										children: " m³"
+									})]
+								})] }),
+								r.capacity.pallets && /* @__PURE__ */ I("div", { children: [/* @__PURE__ */ F("p", {
+									className: "text-sm text-text-secondary",
+									children: "Pallets"
+								}), /* @__PURE__ */ F("p", {
+									className: "text-2xl font-bold",
+									children: r.capacity.pallets
+								})] })
+							]
+						}) })] }),
+						/* @__PURE__ */ I(c, { children: [/* @__PURE__ */ F(d, { children: /* @__PURE__ */ I(u, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ F(b, { size: 18 }), " Documents"]
+						}) }), /* @__PURE__ */ F(l, { children: r.documents.length > 0 ? /* @__PURE__ */ F("div", {
+							className: "space-y-3",
+							children: r.documents.map((e) => /* @__PURE__ */ I("div", {
+								className: "flex items-center justify-between p-3 border rounded-lg",
+								children: [/* @__PURE__ */ I("div", { children: [/* @__PURE__ */ F("p", {
+									className: "font-medium capitalize",
+									children: e.type.replace("_", " ")
+								}), /* @__PURE__ */ I("p", {
+									className: "text-sm text-text-secondary",
+									children: ["Expires: ", j(e.expiryDate)]
+								})] }), /* @__PURE__ */ F(m, {
+									variant: e.verified ? "default" : "secondary",
+									children: e.verified ? "Verified" : "Pending"
+								})]
+							}, e.id))
+						}) : /* @__PURE__ */ F("p", {
+							className: "text-text-secondary text-center py-4",
+							children: "No documents uploaded"
+						}) })] })
+					]
+				}), /* @__PURE__ */ I("div", {
+					className: "space-y-6",
+					children: [
+						/* @__PURE__ */ I(c, { children: [/* @__PURE__ */ F(d, { children: /* @__PURE__ */ I(u, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ F(x, { size: 18 }), " Fuel & Mileage"]
+						}) }), /* @__PURE__ */ I(l, {
+							className: "space-y-4",
+							children: [r.fuelLevel !== void 0 && /* @__PURE__ */ I("div", { children: [/* @__PURE__ */ I("div", {
+								className: "flex justify-between text-sm mb-2",
+								children: [/* @__PURE__ */ F("span", { children: "Fuel Level" }), /* @__PURE__ */ I("span", { children: [r.fuelLevel, "%"] })]
+							}), /* @__PURE__ */ F(i, { value: r.fuelLevel })] }), r.mileage !== void 0 && /* @__PURE__ */ I("div", { children: [/* @__PURE__ */ F("p", {
+								className: "text-sm text-text-secondary",
+								children: "Total Mileage"
+							}), /* @__PURE__ */ I("p", {
+								className: "text-2xl font-bold",
+								children: [
+									r.mileage.toLocaleString(),
+									" ",
+									/* @__PURE__ */ F("span", {
+										className: "text-sm font-normal",
+										children: "miles"
+									})
+								]
+							})] })]
+						})] }),
+						/* @__PURE__ */ I(c, { children: [/* @__PURE__ */ F(d, { children: /* @__PURE__ */ I(u, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ F(S, { size: 18 }), " Maintenance"]
+						}) }), /* @__PURE__ */ I(l, {
+							className: "space-y-3",
+							children: [/* @__PURE__ */ I("div", { children: [/* @__PURE__ */ F("p", {
+								className: "text-sm text-text-secondary",
+								children: "Last Maintenance"
+							}), /* @__PURE__ */ F("p", {
+								className: "font-medium",
+								children: r.lastMaintenance ? j(r.lastMaintenance) : "N/A"
+							})] }), /* @__PURE__ */ I("div", { children: [/* @__PURE__ */ F("p", {
+								className: "text-sm text-text-secondary",
+								children: "Next Scheduled"
+							}), /* @__PURE__ */ F("p", {
+								className: "font-medium",
+								children: r.nextMaintenance ? j(r.nextMaintenance) : "N/A"
+							})] })]
+						})] }),
+						r.currentLocation && /* @__PURE__ */ I(c, { children: [/* @__PURE__ */ F(d, { children: /* @__PURE__ */ I(u, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ F(C, { size: 18 }), " Current Location"]
+						}) }), /* @__PURE__ */ I(l, { children: [/* @__PURE__ */ F("p", {
+							className: "text-sm",
+							children: r.currentLocation.address || "Location updating..."
+						}), /* @__PURE__ */ I("p", {
+							className: "text-xs text-text-secondary mt-1",
+							children: ["Updated ", j(r.currentLocation.timestamp || /* @__PURE__ */ new Date(), "relative")]
+						})] })] })
+					]
+				})]
+			})
+		]
+	}) : /* @__PURE__ */ F(V, {});
+}
+//#endregion
+export { H as default };

package/dist/{VehiclesPage-UlxPWP9K.js → VehiclesPage-VBtOep91.js}

@@ -1,43 +1,41 @@
-import { M as e, i as t } from "./PageLayout-D3N8MCTm.js";
-import { t as n } from "./DataTable-CD9ZhpLB.js";
-import { t as r } from "./download-Dpa9vqoG.js";
-import { t as i } from "./plus-Dl1rLeJR.js";
-import { t as a } from "./refresh-cw-CWfERAit.js";
-import { t as o } from "./truck-CtDjNFbi.js";
-import { r as s } from "./graphqlClient-CdJyR_ed.js";
-import { o as c } from "./useFleet-BdETplNE.js";
-import { a as l, r as u } from "./StatusBadge-CijYQXtb.js";
-import { t as d } from "./navigation-BgnOfsVd.js";
+import { M as e, ct as t, i as n, ot as r } from "./PageLayout-D4LDHJJq.js";
+import { t as i } from "./DataTable-DmciIKKM.js";
+import { t as a } from "./download-DRXxoiQR.js";
+import { t as o } from "./plus-Z76q-FZm.js";
+import { t as s } from "./refresh-cw-DKt6f5T6.js";
+import { t as c } from "./truck-C0v_hbLR.js";
+import { o as l } from "./useFleet-DKqXZ16m.js";
+import { a as u, r as d } from "./StatusBadge-BZurYHMy.js";
 import { jsx as f, jsxs as p } from "react/jsx-runtime";
 import { CTAOverflowMenu as m, EmphasisPanel as h, PagePurpose as g } from "@burdenoff/fe-libs/ui";
 //#region src/movethewheels/pages/VehiclesPage.tsx
 function _() {
-	let { basePath: _, navigate: v } = s(), { vehicles: y, totalVehicles: b, isLoading: x, refetch: S } = c(), C = (e) => {
-		v && v(d(_, e));
+	let { basePath: _, navigate: v } = r(), { vehicles: y, totalVehicles: b, isLoading: x, refetch: S } = l(), C = (e) => {
+		v && v(t(_, e));
 	};
-	return /* @__PURE__ */ p(t, {
+	return /* @__PURE__ */ p(n, {
 		title: "Vehicles",
 		subtitle: `${b} vehicles in fleet`,
-		icon: /* @__PURE__ */ f(o, { size: 24 }),
+		icon: /* @__PURE__ */ f(c, { size: 24 }),
 		headerActions: /* @__PURE__ */ f(m, {
 			primary: {
 				label: "Add Vehicle",
-				icon: /* @__PURE__ */ f(i, { size: 16 }),
-				onSelect: () => {}
+				icon: /* @__PURE__ */ f(o, { size: 16 }),
+				onSelect: () => C("fleet/vehicles/new")
 			},
 			actions: [{
 				label: "Refresh",
-				icon: /* @__PURE__ */ f(a, { size: 16 }),
+				icon: /* @__PURE__ */ f(s, { size: 16 }),
 				onSelect: () => S()
 			}, {
 				label: "Export",
-				icon: /* @__PURE__ */ f(r, { size: 16 }),
+				icon: /* @__PURE__ */ f(a, { size: 16 }),
 				onSelect: () => {}
 			}]
 		}),
 		children: [
 			/* @__PURE__ */ f(g, {
-				icon: /* @__PURE__ */ f(o, { size: 18 }),
+				icon: /* @__PURE__ */ f(c, { size: 18 }),
 				children: "Every truck, van and bike in your fleet. Monitor capacity, fuel level, mileage and maintenance status here so you always know which vehicles are road-ready before dispatching an order."
 			}),
 			/* @__PURE__ */ p(h, { children: [/* @__PURE__ */ f("p", {
@@ -69,7 +67,7 @@ function _() {
 					})] })
 				]
 			})] }),
-			/* @__PURE__ */ f(n, {
+			/* @__PURE__ */ f(i, {
 				columns: [
 					{
 						id: "vehicleNumber",
@@ -85,7 +83,7 @@ function _() {
 						id: "type",
 						header: "Type",
 						accessorKey: "type",
-						cell: (e) => /* @__PURE__ */ f(l, { type: e.type })
+						cell: (e) => /* @__PURE__ */ f(u, { type: e.type })
 					},
 					{
 						id: "details",
@@ -107,7 +105,7 @@ function _() {
 						header: "Status",
 						accessorKey: "status",
 						sortable: !0,
-						cell: (e) => /* @__PURE__ */ f(u, {
+						cell: (e) => /* @__PURE__ */ f(d, {
 							status: e.status,
 							type: "vehicle"
 						})