@burdenoff/microfe-atheletebridge 2026.624.1 → 2026.625.2

package/dist/atheletebridge/pages/worker/WorkerOrdersPage.js

@@ -7,8 +7,9 @@ import { formatCurrency as a } from "../../utils/formatters.js";
 import { useCallback as o, useEffect as s, useState as c } from "react";
 import { AlertTriangle as l, ArrowRight as u, CheckCircle2 as d, ChefHat as f, ClipboardList as p, CreditCard as m, Loader2 as h, MapPin as g, Navigation as _, Package as v, Phone as y, PlayCircle as b, ShoppingBag as x, Star as S, Truck as C } from "lucide-react";
 import { jsx as w, jsxs as T } from "react/jsx-runtime";
+import { EmphasisPanel as E, PagePurpose as D } from "@burdenoff/fe-libs/ui";
 //#region src/atheletebridge/pages/worker/WorkerOrdersPage.tsx
-var E = [
+var O = [
 	{
 		id: "task-001",
 		orderId: "ORD-2024-001",
@@ -124,11 +125,11 @@ var E = [
 		}
 	}
 ];
-function D(e) {
+function k(e) {
 	let t = /* @__PURE__ */ new Date(), n = new Date(e), r = Math.floor((n.getTime() - t.getTime()) / (1e3 * 60));
 	return r < 0 ? "Overdue" : r < 60 ? `${r} min` : `${Math.floor(r / 60)}h ${r % 60}m`;
 }
-function O(e) {
+function A(e) {
 	switch (e) {
 		case "delivery": return {
 			icon: C,
@@ -152,7 +153,7 @@ function O(e) {
 		};
 	}
 }
-function k(e) {
+function j(e) {
 	switch (e) {
 		case "urgent": return "bg-red-500/20 text-red-600 dark:text-red-400";
 		case "high": return "bg-orange-500/20 text-orange-600 dark:text-orange-400";
@@ -161,35 +162,35 @@ function k(e) {
 		default: return "bg-secondary text-secondary-foreground";
 	}
 }
-var A = () => {
-	let { navigateTo: f } = e(), [v, x] = c(!0), [C, A] = c([]), [j, M] = c(null), [N, P] = c({
+var M = () => {
+	let { navigateTo: f } = e(), [v, x] = c(!0), [C, M] = c([]), [N, P] = c(null), [F, I] = c({
 		status: "",
 		type: "",
 		priority: "",
 		sortBy: "priority"
-	}), [F, I] = c({
+	}), [L, R] = c({
 		totalTasks: 0,
 		completedToday: 0,
 		pendingTasks: 0,
 		averageTime: 0,
 		earnings: 0,
 		rating: 4.8
-	}), [, L] = c(0);
+	}), [, z] = c(0);
 	s(() => {
-		let e = setInterval(() => L((e) => e + 1), 6e4);
+		let e = setInterval(() => z((e) => e + 1), 6e4);
 		return () => clearInterval(e);
 	}, []);
-	let R = o(() => {
+	let B = o(() => {
 		x(!0), setTimeout(() => {
-			let e = [...E];
-			N.status && (e = e.filter((e) => e.status === N.status)), N.type && (e = e.filter((e) => e.type === N.type)), N.priority && (e = e.filter((e) => e.priority === N.priority));
+			let e = [...O];
+			F.status && (e = e.filter((e) => e.status === F.status)), F.type && (e = e.filter((e) => e.type === F.type)), F.priority && (e = e.filter((e) => e.priority === F.priority));
 			let t = {
 				urgent: 0,
 				high: 1,
 				medium: 2,
 				low: 3
 			};
-			switch (N.sortBy) {
+			switch (F.sortBy) {
 				case "priority":
 					e.sort((e, n) => (t[e.priority] ?? 4) - (t[n.priority] ?? 4));
 					break;
@@ -200,7 +201,7 @@ var A = () => {
 					e.sort((e, t) => (e.distance ?? 999) - (t.distance ?? 999));
 					break;
 			}
-			A(e), M(E.find((e) => e.status === "in_progress") ?? null), I({
+			M(e), P(O.find((e) => e.status === "in_progress") ?? null), R({
 				totalTasks: 45,
 				completedToday: 12,
 				pendingTasks: 3,
@@ -209,24 +210,24 @@ var A = () => {
 				rating: 4.8
 			}), x(!1);
 		}, 600);
-	}, [N]);
+	}, [F]);
 	s(() => {
-		R();
-	}, [R]);
-	let z = (e, t) => {
-		P((n) => ({
+		B();
+	}, [B]);
+	let V = (e, t) => {
+		I((n) => ({
 			...n,
 			[e]: t
 		}));
-	}, B = (e) => {
-		let t = E.find((t) => t.id === e);
-		t && (t.status = "in_progress", M(t), R());
-	}, V = (e) => {
-		let t = E.find((t) => t.id === e);
-		t && (t.status = "completed"), M(null), R(), alert("Task completed successfully");
 	}, H = (e) => {
-		window.location.href = `tel:${e.replace(/\s/g, "")}`;
+		let t = O.find((t) => t.id === e);
+		t && (t.status = "in_progress", P(t), B());
 	}, U = (e) => {
+		let t = O.find((t) => t.id === e);
+		t && (t.status = "completed"), P(null), B(), alert("Task completed successfully");
+	}, W = (e) => {
+		window.location.href = `tel:${e.replace(/\s/g, "")}`;
+	}, G = (e) => {
 		if (e.address) {
 			let t = encodeURIComponent(`${e.address.addressLine1}, ${e.address.city}`);
 			window.open(`https://maps.google.com?q=${t}`, "_blank");
@@ -251,72 +252,76 @@ var A = () => {
 		children: /* @__PURE__ */ T("div", {
 			className: "space-y-6",
 			children: [
-				/* @__PURE__ */ T("div", {
-					className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-6 gap-3",
-					children: [
-						/* @__PURE__ */ T("div", {
-							className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
-							children: [/* @__PURE__ */ w("p", {
-								className: "text-xs text-text-secondary",
-								children: "Today's Tasks"
-							}), /* @__PURE__ */ w("p", {
-								className: "text-2xl font-bold text-text-primary",
-								children: F.totalTasks
-							})]
-						}),
-						/* @__PURE__ */ T("div", {
-							className: "rounded-lg border border-green-500/20 bg-green-500/5 p-4 shadow-sm",
-							children: [/* @__PURE__ */ w("p", {
-								className: "text-xs text-green-600 dark:text-green-400",
-								children: "Completed"
-							}), /* @__PURE__ */ w("p", {
-								className: "text-2xl font-bold text-green-600 dark:text-green-400",
-								children: F.completedToday
-							})]
-						}),
-						/* @__PURE__ */ T("div", {
-							className: "rounded-lg border border-yellow-500/20 bg-yellow-500/5 p-4 shadow-sm",
-							children: [/* @__PURE__ */ w("p", {
-								className: "text-xs text-yellow-600 dark:text-yellow-400",
-								children: "Pending"
-							}), /* @__PURE__ */ w("p", {
-								className: "text-2xl font-bold text-yellow-600 dark:text-yellow-400",
-								children: F.pendingTasks
-							})]
-						}),
-						/* @__PURE__ */ T("div", {
-							className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
-							children: [/* @__PURE__ */ w("p", {
-								className: "text-xs text-text-secondary",
-								children: "Avg Time"
-							}), /* @__PURE__ */ T("p", {
-								className: "text-2xl font-bold text-text-primary",
-								children: [F.averageTime, " min"]
-							})]
-						}),
-						/* @__PURE__ */ T("div", {
-							className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
-							children: [/* @__PURE__ */ w("p", {
-								className: "text-xs text-text-secondary",
-								children: "Today's Earnings"
-							}), /* @__PURE__ */ w("p", {
-								className: "text-2xl font-bold text-text-primary",
-								children: a(F.earnings, { minimumFractionDigits: 0 })
-							})]
-						}),
-						/* @__PURE__ */ T("div", {
-							className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
-							children: [/* @__PURE__ */ w("p", {
-								className: "text-xs text-text-secondary",
-								children: "Rating"
-							}), /* @__PURE__ */ T("p", {
-								className: "text-2xl font-bold text-text-primary flex items-center gap-1",
-								children: [/* @__PURE__ */ w(S, { className: "h-4 w-4 fill-yellow-400 text-yellow-400" }), F.rating]
-							})]
-						})
-					]
+				/* @__PURE__ */ w(D, { children: "The orders and tasks assigned to you today. Pick up your current task, work through what you have left, and watch your completion count, earnings and rating climb as you go. This is where you do the work." }),
+				/* @__PURE__ */ w(E, {
+					className: "p-5",
+					children: /* @__PURE__ */ T("div", {
+						className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-6 gap-3",
+						children: [
+							/* @__PURE__ */ T("div", {
+								className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
+								children: [/* @__PURE__ */ w("p", {
+									className: "text-xs text-text-secondary",
+									children: "Today's Tasks"
+								}), /* @__PURE__ */ w("p", {
+									className: "text-2xl font-bold text-text-primary",
+									children: L.totalTasks
+								})]
+							}),
+							/* @__PURE__ */ T("div", {
+								className: "rounded-lg border border-green-500/20 bg-green-500/5 p-4 shadow-sm",
+								children: [/* @__PURE__ */ w("p", {
+									className: "text-xs text-green-600 dark:text-green-400",
+									children: "Completed"
+								}), /* @__PURE__ */ w("p", {
+									className: "text-2xl font-bold text-green-600 dark:text-green-400",
+									children: L.completedToday
+								})]
+							}),
+							/* @__PURE__ */ T("div", {
+								className: "rounded-lg border border-yellow-500/20 bg-yellow-500/5 p-4 shadow-sm",
+								children: [/* @__PURE__ */ w("p", {
+									className: "text-xs text-yellow-600 dark:text-yellow-400",
+									children: "Pending"
+								}), /* @__PURE__ */ w("p", {
+									className: "text-2xl font-bold text-yellow-600 dark:text-yellow-400",
+									children: L.pendingTasks
+								})]
+							}),
+							/* @__PURE__ */ T("div", {
+								className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
+								children: [/* @__PURE__ */ w("p", {
+									className: "text-xs text-text-secondary",
+									children: "Avg Time"
+								}), /* @__PURE__ */ T("p", {
+									className: "text-2xl font-bold text-text-primary",
+									children: [L.averageTime, " min"]
+								})]
+							}),
+							/* @__PURE__ */ T("div", {
+								className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
+								children: [/* @__PURE__ */ w("p", {
+									className: "text-xs text-text-secondary",
+									children: "Today's Earnings"
+								}), /* @__PURE__ */ w("p", {
+									className: "text-2xl font-bold text-text-primary",
+									children: a(L.earnings, { minimumFractionDigits: 0 })
+								})]
+							}),
+							/* @__PURE__ */ T("div", {
+								className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
+								children: [/* @__PURE__ */ w("p", {
+									className: "text-xs text-text-secondary",
+									children: "Rating"
+								}), /* @__PURE__ */ T("p", {
+									className: "text-2xl font-bold text-text-primary flex items-center gap-1",
+									children: [/* @__PURE__ */ w(S, { className: "h-4 w-4 fill-yellow-400 text-yellow-400" }), L.rating]
+								})]
+							})
+						]
+					})
 				}),
-				j && /* @__PURE__ */ T("div", {
+				N && /* @__PURE__ */ T("div", {
 					className: "rounded-lg border-2 border-blue-500/30 bg-blue-500/5 p-5",
 					children: [/* @__PURE__ */ w("h2", {
 						className: "text-base font-semibold text-blue-600 dark:text-blue-400 mb-4",
@@ -330,28 +335,28 @@ var A = () => {
 								children: [
 									/* @__PURE__ */ T("h3", {
 										className: "text-sm font-semibold text-text-primary",
-										children: ["Order #", j.orderId]
+										children: ["Order #", N.orderId]
 									}),
 									(() => {
-										let e = O(j.type), n = e.icon;
+										let e = A(N.type), n = e.icon;
 										return /* @__PURE__ */ T("span", {
 											className: t("inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-[10px] font-medium", e.style),
 											children: [/* @__PURE__ */ w(n, { className: "h-3 w-3" }), e.label]
 										});
 									})(),
 									/* @__PURE__ */ w("span", {
-										className: t("inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium capitalize", k(j.priority)),
-										children: j.priority
+										className: t("inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium capitalize", j(N.priority)),
+										children: N.priority
 									})
 								]
 							}), /* @__PURE__ */ w("p", {
 								className: "text-xs text-text-secondary mt-1",
-								children: j.cartName
+								children: N.cartName
 							})] }), /* @__PURE__ */ T("div", {
 								className: "text-right",
 								children: [/* @__PURE__ */ w("p", {
 									className: "text-xl font-bold text-blue-600 dark:text-blue-400",
-									children: D(j.estimatedTime)
+									children: k(N.estimatedTime)
 								}), /* @__PURE__ */ w("p", {
 									className: "text-xs text-text-secondary",
 									children: "Time remaining"
@@ -369,14 +374,14 @@ var A = () => {
 										}),
 										/* @__PURE__ */ w("p", {
 											className: "text-sm font-medium text-text-primary",
-											children: j.customerName
+											children: N.customerName
 										}),
-										j.address && /* @__PURE__ */ T("p", {
+										N.address && /* @__PURE__ */ T("p", {
 											className: "text-xs text-text-secondary mt-1",
 											children: [
-												j.address.addressLine1,
+												N.address.addressLine1,
 												", ",
-												j.address.city
+												N.address.city
 											]
 										})
 									] }), /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
@@ -384,7 +389,7 @@ var A = () => {
 										children: "Items"
 									}), /* @__PURE__ */ w("div", {
 										className: "space-y-0.5",
-										children: j.items.map((e, t) => /* @__PURE__ */ T("p", {
+										children: N.items.map((e, t) => /* @__PURE__ */ T("p", {
 											className: "text-xs text-text-primary",
 											children: [
 												e.quantity,
@@ -394,14 +399,14 @@ var A = () => {
 										}, t))
 									})] })]
 								}),
-								j.specialInstructions && /* @__PURE__ */ T("div", {
+								N.specialInstructions && /* @__PURE__ */ T("div", {
 									className: "mt-3 p-3 rounded-md bg-yellow-500/10 border border-yellow-500/20",
 									children: [/* @__PURE__ */ T("p", {
 										className: "text-xs font-medium text-yellow-600 dark:text-yellow-400 flex items-center gap-1",
 										children: [/* @__PURE__ */ w(l, { className: "h-3 w-3" }), "Special Instructions:"]
 									}), /* @__PURE__ */ w("p", {
 										className: "text-xs text-yellow-700 dark:text-yellow-300 mt-0.5",
-										children: j.specialInstructions
+										children: N.specialInstructions
 									})]
 								}),
 								/* @__PURE__ */ T("div", {
@@ -409,19 +414,19 @@ var A = () => {
 									children: [
 										/* @__PURE__ */ T("button", {
 											type: "button",
-											onClick: () => H(j.customerPhone),
+											onClick: () => W(N.customerPhone),
 											className: "inline-flex items-center gap-1.5 rounded-md bg-accent px-3 py-2 text-xs font-medium text-text-primary hover:bg-accent/80 transition-colors",
 											children: [/* @__PURE__ */ w(y, { className: "h-3.5 w-3.5" }), "Call Customer"]
 										}),
-										j.type === "delivery" && j.address && /* @__PURE__ */ T("button", {
+										N.type === "delivery" && N.address && /* @__PURE__ */ T("button", {
 											type: "button",
-											onClick: () => U(j),
+											onClick: () => G(N),
 											className: "inline-flex items-center gap-1.5 rounded-md bg-accent px-3 py-2 text-xs font-medium text-text-primary hover:bg-accent/80 transition-colors",
 											children: [/* @__PURE__ */ w(_, { className: "h-3.5 w-3.5" }), "Navigate"]
 										}),
 										/* @__PURE__ */ T("button", {
 											type: "button",
-											onClick: () => V(j.id),
+											onClick: () => U(N.id),
 											className: "ml-auto inline-flex items-center gap-1.5 rounded-md bg-green-500/10 px-3 py-2 text-xs font-medium text-green-600 dark:text-green-400 hover:bg-green-500/20 transition-colors",
 											children: [/* @__PURE__ */ w(d, { className: "h-3.5 w-3.5" }), "Complete Task"]
 										})
@@ -437,8 +442,8 @@ var A = () => {
 						className: "grid grid-cols-1 md:grid-cols-4 gap-3",
 						children: [
 							/* @__PURE__ */ T("select", {
-								value: N.status,
-								onChange: (e) => z("status", e.target.value),
+								value: F.status,
+								onChange: (e) => V("status", e.target.value),
 								className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-blue-500/40",
 								children: [
 									/* @__PURE__ */ w("option", {
@@ -460,8 +465,8 @@ var A = () => {
 								]
 							}),
 							/* @__PURE__ */ T("select", {
-								value: N.type,
-								onChange: (e) => z("type", e.target.value),
+								value: F.type,
+								onChange: (e) => V("type", e.target.value),
 								className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-blue-500/40",
 								children: [
 									/* @__PURE__ */ w("option", {
@@ -483,8 +488,8 @@ var A = () => {
 								]
 							}),
 							/* @__PURE__ */ T("select", {
-								value: N.priority,
-								onChange: (e) => z("priority", e.target.value),
+								value: F.priority,
+								onChange: (e) => V("priority", e.target.value),
 								className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-blue-500/40",
 								children: [
 									/* @__PURE__ */ w("option", {
@@ -510,8 +515,8 @@ var A = () => {
 								]
 							}),
 							/* @__PURE__ */ T("select", {
-								value: N.sortBy,
-								onChange: (e) => z("sortBy", e.target.value),
+								value: F.sortBy,
+								onChange: (e) => V("sortBy", e.target.value),
 								className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-blue-500/40",
 								children: [
 									/* @__PURE__ */ w("option", {
@@ -532,13 +537,14 @@ var A = () => {
 					})
 				}),
 				C.length === 0 ? /* @__PURE__ */ w(i, {
+					illustration: "empty-data",
 					icon: /* @__PURE__ */ w(p, { className: "h-12 w-12" }),
 					title: "No tasks available",
 					description: "Check back later for new tasks"
 				}) : /* @__PURE__ */ w("div", {
 					className: "space-y-3",
 					children: C.map((e) => {
-						let n = O(e.type), i = n.icon;
+						let n = A(e.type), i = n.icon;
 						return /* @__PURE__ */ T("div", {
 							className: "rounded-lg border border-border-subtle bg-bg-surface p-5 shadow-sm hover:shadow-md transition-shadow",
 							children: [
@@ -556,7 +562,7 @@ var A = () => {
 												children: [/* @__PURE__ */ w(i, { className: "h-3 w-3" }), n.label]
 											}),
 											/* @__PURE__ */ w("span", {
-												className: t("inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium capitalize", k(e.priority)),
+												className: t("inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium capitalize", j(e.priority)),
 												children: e.priority
 											})
 										]
@@ -607,8 +613,8 @@ var A = () => {
 											className: "text-xs text-text-secondary",
 											children: "Time"
 										}), /* @__PURE__ */ w("p", {
-											className: t("text-xs font-medium", D(e.estimatedTime) === "Overdue" ? "text-red-600 dark:text-red-400" : "text-text-primary"),
-											children: D(e.estimatedTime)
+											className: t("text-xs font-medium", k(e.estimatedTime) === "Overdue" ? "text-red-600 dark:text-red-400" : "text-text-primary"),
+											children: k(e.estimatedTime)
 										})] })
 									]
 								}),
@@ -617,14 +623,14 @@ var A = () => {
 									children: [
 										/* @__PURE__ */ T("button", {
 											type: "button",
-											onClick: () => B(e.id),
-											disabled: j !== null,
-											className: t("inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs font-medium transition-colors", j === null ? "bg-blue-500/10 text-blue-600 dark:text-blue-400 hover:bg-blue-500/20" : "bg-bg-sunken text-text-secondary cursor-not-allowed"),
-											children: [/* @__PURE__ */ w(b, { className: "h-3.5 w-3.5" }), j ? "Complete current first" : "Start Task"]
+											onClick: () => H(e.id),
+											disabled: N !== null,
+											className: t("inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs font-medium transition-colors", N === null ? "bg-blue-500/10 text-blue-600 dark:text-blue-400 hover:bg-blue-500/20" : "bg-bg-sunken text-text-secondary cursor-not-allowed"),
+											children: [/* @__PURE__ */ w(b, { className: "h-3.5 w-3.5" }), N ? "Complete current first" : "Start Task"]
 										}),
 										/* @__PURE__ */ T("button", {
 											type: "button",
-											onClick: () => H(e.customerPhone),
+											onClick: () => W(e.customerPhone),
 											className: "inline-flex items-center gap-1.5 rounded-md bg-accent px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-accent/80 transition-colors",
 											children: [/* @__PURE__ */ w(y, { className: "h-3.5 w-3.5" }), "Call"]
 										}),
@@ -638,11 +644,11 @@ var A = () => {
 										})
 									]
 								}),
-								e.status === "in_progress" && e.id !== j?.id && /* @__PURE__ */ T("div", {
+								e.status === "in_progress" && e.id !== N?.id && /* @__PURE__ */ T("div", {
 									className: "flex items-center gap-2 border-t border-border-subtle pt-3",
 									children: [/* @__PURE__ */ T("button", {
 										type: "button",
-										onClick: () => V(e.id),
+										onClick: () => U(e.id),
 										className: "inline-flex items-center gap-1.5 rounded-md bg-green-500/10 px-3 py-1.5 text-xs font-medium text-green-600 dark:text-green-400 hover:bg-green-500/20 transition-colors",
 										children: [/* @__PURE__ */ w(d, { className: "h-3.5 w-3.5" }), "Complete"]
 									}), /* @__PURE__ */ T("button", {
@@ -670,6 +676,6 @@ var A = () => {
 	});
 };
 //#endregion
-export { A as WorkerOrdersPage };
+export { M as WorkerOrdersPage };
 
 //# sourceMappingURL=WorkerOrdersPage.js.map