@burdenoff/microfe-coolandlovely 2026.625.1 → 2026.625.2

package/dist/coolandlovely/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/coolandlovely/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-status-error-bg-subtle/20 text-status-error-text";
 		case "high": return "bg-accent-orange-subtle/20 text-accent-orange";
@@ -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");
@@ -245,14 +246,18 @@ var A = () => {
 				})]
 			})
 		})
-	}) : /* @__PURE__ */ w(n, {
+	}) : /* @__PURE__ */ T(n, {
 		title: "My Orders",
 		description: "Manage your assigned orders",
-		children: /* @__PURE__ */ T("div", {
+		children: [/* @__PURE__ */ w(D, {
+			className: "mb-6",
+			icon: /* @__PURE__ */ w(p, { className: "h-4 w-4" }),
+			children: "Every order and task assigned to you, with the active one front and centre. Start, update and complete tasks as you work through them, filter to find a specific job, and watch today's completion count and earnings climb as you go."
+		}), /* @__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",
+				/* @__PURE__ */ T(E, {
+					className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-6 gap-3 p-4",
 					children: [
 						/* @__PURE__ */ T("div", {
 							className: "rounded-lg border border-border-seam bg-bg-surface p-4 bg-gloss-card shadow-pop",
@@ -261,7 +266,7 @@ var A = () => {
 								children: "Today's Tasks"
 							}), /* @__PURE__ */ w("p", {
 								className: "text-2xl font-bold text-text-primary",
-								children: F.totalTasks
+								children: L.totalTasks
 							})]
 						}),
 						/* @__PURE__ */ T("div", {
@@ -271,7 +276,7 @@ var A = () => {
 								children: "Completed"
 							}), /* @__PURE__ */ w("p", {
 								className: "text-2xl font-bold text-status-success-text",
-								children: F.completedToday
+								children: L.completedToday
 							})]
 						}),
 						/* @__PURE__ */ T("div", {
@@ -281,7 +286,7 @@ var A = () => {
 								children: "Pending"
 							}), /* @__PURE__ */ w("p", {
 								className: "text-2xl font-bold text-status-warning-text",
-								children: F.pendingTasks
+								children: L.pendingTasks
 							})]
 						}),
 						/* @__PURE__ */ T("div", {
@@ -291,7 +296,7 @@ var A = () => {
 								children: "Avg Time"
 							}), /* @__PURE__ */ T("p", {
 								className: "text-2xl font-bold text-text-primary",
-								children: [F.averageTime, " min"]
+								children: [L.averageTime, " min"]
 							})]
 						}),
 						/* @__PURE__ */ T("div", {
@@ -301,7 +306,7 @@ var A = () => {
 								children: "Today's Earnings"
 							}), /* @__PURE__ */ w("p", {
 								className: "text-2xl font-bold text-text-primary",
-								children: a(F.earnings, { minimumFractionDigits: 0 })
+								children: a(L.earnings, { minimumFractionDigits: 0 })
 							})]
 						}),
 						/* @__PURE__ */ T("div", {
@@ -311,12 +316,12 @@ var A = () => {
 								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-status-warning-text text-status-warning-text" }), F.rating]
+								children: [/* @__PURE__ */ w(S, { className: "h-4 w-4 fill-status-warning-text text-status-warning-text" }), L.rating]
 							})]
 						})
 					]
 				}),
-				j && /* @__PURE__ */ T("div", {
+				N && /* @__PURE__ */ T("div", {
 					className: "rounded-lg border-2 border-accent-blue-subtle/30 bg-accent-blue-subtle/5 p-5",
 					children: [/* @__PURE__ */ w("h2", {
 						className: "text-base font-semibold text-accent-blue 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-accent-blue",
-									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-status-warning-bg-subtle/10 border border-status-warning-border/20",
 									children: [/* @__PURE__ */ T("p", {
 										className: "text-xs font-medium text-status-warning-text flex items-center gap-1",
 										children: [/* @__PURE__ */ w(l, { className: "h-3 w-3" }), "Special Instructions:"]
 									}), /* @__PURE__ */ w("p", {
 										className: "text-xs text-status-warning-text 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-status-success-bg-subtle/10 px-3 py-2 text-xs font-medium text-status-success-text hover:bg-status-success-bg-subtle/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-accent-blue-subtle/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-accent-blue-subtle/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-accent-blue-subtle/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-accent-blue-subtle/40",
 								children: [
 									/* @__PURE__ */ w("option", {
@@ -532,13 +537,13 @@ var A = () => {
 					})
 				}),
 				C.length === 0 ? /* @__PURE__ */ w(i, {
-					icon: /* @__PURE__ */ w(p, { className: "h-12 w-12" }),
+					illustration: "empty-sessions",
 					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-seam bg-bg-surface p-5 hover:shadow-md transition-shadow bg-gloss-card shadow-pop",
 							children: [
@@ -556,7 +561,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 +612,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-status-error-text" : "text-text-primary"),
-											children: D(e.estimatedTime)
+											className: t("text-xs font-medium", k(e.estimatedTime) === "Overdue" ? "text-status-error-text" : "text-text-primary"),
+											children: k(e.estimatedTime)
 										})] })
 									]
 								}),
@@ -617,14 +622,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-accent-blue-subtle/10 text-accent-blue hover:bg-accent-blue-subtle/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-accent-blue-subtle/10 text-accent-blue hover:bg-accent-blue-subtle/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 +643,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-status-success-bg-subtle/10 px-3 py-1.5 text-xs font-medium text-status-success-text hover:bg-status-success-bg-subtle/20 transition-colors",
 										children: [/* @__PURE__ */ w(d, { className: "h-3.5 w-3.5" }), "Complete"]
 									}), /* @__PURE__ */ T("button", {
@@ -666,10 +671,10 @@ var A = () => {
 					})
 				})
 			]
-		})
+		})]
 	});
 };
 //#endregion
-export { A as WorkerOrdersPage };
+export { M as WorkerOrdersPage };
 
 //# sourceMappingURL=WorkerOrdersPage.js.map