@burdenoff/microfe-kadaikodi 2026.704.3 → 2026.704.5

package/dist/kadaikodi/pages/cart-owner/OrderManagementPage.js

@@ -2,14 +2,19 @@ import { useKadaikodi as e } from "../../context/KadaikodiContext.js";
 import { cn as t } from "../../utils/cn.js";
 import { PageLayout as n } from "../../components/PageLayout.js";
 import { EmptyState as r } from "../../components/EmptyState.js";
-import { useOrders as i, useProviders as a, useUpdateOrderStatus as o } from "../../hooks/useKadaikodiApi.js";
-import { formatCurrency as s } from "../../utils/formatters.js";
-import { useEffect as c, useMemo as l, useState as u } from "react";
-import { AlertCircle as d, CheckCircle2 as f, ChefHat as p, MapPin as m, PackageCheck as h, Phone as g, RefreshCw as _, Search as v, ShoppingBag as y, Truck as b, X as x, XCircle as S } from "lucide-react";
+import { useOrders as i, useProviders as ee, useUpdateOrderStatus as te } from "../../hooks/useKadaikodiApi.js";
+import { formatCurrency as a } from "../../utils/formatters.js";
+import { STATUS as o } from "../../components/viz/lib/palette.js";
+import { StatCard as s } from "../../components/viz/StatCard.js";
+import { KanbanBoard as c } from "../../components/viz/KanbanBoard.js";
+import { SegmentedTabs as l } from "../../components/viz/SegmentedTabs.js";
+import "../../components/viz/index.js";
+import { useEffect as u, useMemo as d, useState as f } from "react";
+import { AlertCircle as ne, CheckCircle2 as p, ChefHat as m, Clock as h, MapPin as g, PackageCheck as _, Phone as v, RefreshCw as re, Search as y, ShoppingBag as b, Truck as x, X as ie, XCircle as S } from "lucide-react";
 import { Fragment as C, jsx as w, jsxs as T } from "react/jsx-runtime";
-import { EmphasisPanel as E, PagePurpose as D } from "@burdenoff/fe-libs/ui";
+import { EmphasisPanel as E, PagePurpose as ae } from "@burdenoff/fe-libs/ui";
 //#region src/kadaikodi/pages/cart-owner/OrderManagementPage.tsx
-var O = {
+var D = {
 	pending: {
 		color: "bg-status-warning-bg-subtle text-status-warning-text",
 		label: "New Order"
@@ -38,58 +43,58 @@ var O = {
 		color: "bg-status-error-bg-subtle text-status-error-text",
 		label: "Cancelled"
 	}
-}, k = {
+}, O = {
 	delivery: {
-		icon: b,
+		icon: x,
 		label: "Delivery",
 		color: "bg-accent-purple-subtle text-text-primary"
 	},
 	pickup: {
-		icon: y,
+		icon: b,
 		label: "Pickup",
 		color: "bg-[var(--color-accent-soft)] text-text-primary"
 	},
 	cart_dispatch: {
-		icon: m,
+		icon: g,
 		label: "Cart Dispatch",
 		color: "bg-bg-sunken text-text-secondary"
 	}
-}, A = (e) => {
+}, k = (e) => {
 	let t = new Date(e), n = Math.floor(((/* @__PURE__ */ new Date()).getTime() - t.getTime()) / (1e3 * 60));
 	return n < 1 ? "Just now" : n < 60 ? `${n} min ago` : n < 1440 ? `${Math.floor(n / 60)} hours ago` : t.toLocaleDateString("en-IN", {
 		day: "2-digit",
 		month: "short"
 	});
-}, j = (e) => new Date(e).toLocaleTimeString("en-IN", {
+}, A = (e) => new Date(e).toLocaleTimeString("en-IN", {
 	hour: "numeric",
 	minute: "2-digit",
 	hour12: !0
-}), M = (e) => {
+}), oe = (e) => {
 	let t = ((/* @__PURE__ */ new Date()).getTime() - new Date(e.orderDate).getTime()) / (1e3 * 60);
 	return e.status === "pending" && t > 10 ? "border-status-error-text/50 bg-status-error-bg-subtle" : e.status === "preparing" && t > 30 ? "border-status-warning-text/50 bg-status-warning-bg-subtle" : "border-border-subtle";
-}, N = () => {
-	let { navigateTo: y, currentUser: b } = e(), { data: N = [] } = a(), { data: P = [], isLoading: F } = i({ providerId: l(() => N.find((e) => e.ownerId === b?.id) ?? N[0], [N, b?.id])?.id }), I = o(), [L, R] = u([]);
-	c(() => {
-		R(P);
-	}, [P]);
-	let [z, B] = u({
+}, se = () => {
+	let { navigateTo: se, currentUser: j } = e(), { data: M = [] } = ee(), { data: N = [], isLoading: ce, refetch: le, isFetching: P } = i({ providerId: d(() => M.find((e) => e.ownerId === j?.id) ?? M[0], [M, j?.id])?.id }), F = te(), [I, L] = f([]);
+	u(() => {
+		L(N);
+	}, [N]);
+	let [R, z] = f({
 		status: "",
 		dateRange: "all",
 		searchQuery: "",
 		sortBy: "recent",
 		fulfillmentType: ""
-	}), [V, H] = u(null), [U, W] = u(!1), [G, K] = u(null), q = (e, t) => {
-		K({
+	}), [B, V] = f("board"), [H, U] = f(null), [W, G] = f(!1), [K, q] = f(null), J = (e, t) => {
+		q({
 			text: e,
 			type: t
-		}), setTimeout(() => K(null), 3e3);
-	}, J = l(() => {
-		let e = L.length, t = L.filter((e) => e.status === "pending").length, n = L.filter((e) => [
+		}), setTimeout(() => q(null), 3e3);
+	}, Y = d(() => {
+		let e = I.length, t = I.filter((e) => e.status === "pending").length, n = I.filter((e) => [
 			"confirmed",
 			"preparing",
 			"ready",
 			"out_for_delivery"
-		].includes(e.status)).length, r = L.filter((e) => e.status === "delivered").length, i = L.filter((e) => e.status === "delivered").reduce((e, t) => e + t.total, 0);
+		].includes(e.status)).length, r = I.filter((e) => e.status === "delivered").length, i = I.filter((e) => e.status === "delivered").reduce((e, t) => e + t.total, 0);
 		return {
 			total: e,
 			pending: t,
@@ -98,17 +103,17 @@ var O = {
 			totalRevenue: i,
 			avgOrder: r > 0 ? Math.round(i / r) : 0
 		};
-	}, [L]), Y = l(() => {
-		let e = [...L];
-		if (z.status && (e = e.filter((e) => e.status === z.status)), z.fulfillmentType && (e = e.filter((e) => e.fulfillmentType === z.fulfillmentType)), z.searchQuery) {
-			let t = z.searchQuery.toLowerCase();
+	}, [I]), X = d(() => {
+		let e = [...I];
+		if (R.status && (e = e.filter((e) => e.status === R.status)), R.fulfillmentType && (e = e.filter((e) => e.fulfillmentType === R.fulfillmentType)), R.searchQuery) {
+			let t = R.searchQuery.toLowerCase();
 			e = e.filter((e) => e.id.toLowerCase().includes(t) || (e.customerName || "").toLowerCase().includes(t) || e.items.some((e) => e.name.toLowerCase().includes(t)));
 		}
-		if (z.dateRange !== "all") {
+		if (R.dateRange !== "all") {
 			let t = /* @__PURE__ */ new Date(), n = /* @__PURE__ */ new Date();
-			z.dateRange === "today" ? n.setHours(0, 0, 0, 0) : z.dateRange === "7days" ? n.setDate(t.getDate() - 7) : z.dateRange === "30days" && n.setDate(t.getDate() - 30), e = e.filter((e) => new Date(e.orderDate) >= n);
+			R.dateRange === "today" ? n.setHours(0, 0, 0, 0) : R.dateRange === "7days" ? n.setDate(t.getDate() - 7) : R.dateRange === "30days" && n.setDate(t.getDate() - 30), e = e.filter((e) => new Date(e.orderDate) >= n);
 		}
-		switch (z.sortBy) {
+		switch (R.sortBy) {
 			case "recent":
 				e.sort((e, t) => new Date(t.orderDate).getTime() - new Date(e.orderDate).getTime());
 				break;
@@ -123,53 +128,175 @@ var O = {
 				break;
 		}
 		return e;
-	}, [L, z]), X = (e, t) => {
+	}, [I, R]), Z = d(() => {
+		let e = [...I];
+		if (R.fulfillmentType && (e = e.filter((e) => e.fulfillmentType === R.fulfillmentType)), R.searchQuery) {
+			let t = R.searchQuery.toLowerCase();
+			e = e.filter((e) => e.id.toLowerCase().includes(t) || (e.customerName || "").toLowerCase().includes(t) || e.items.some((e) => e.name.toLowerCase().includes(t)));
+		}
+		if (R.dateRange !== "all") {
+			let t = /* @__PURE__ */ new Date(), n = /* @__PURE__ */ new Date();
+			R.dateRange === "today" ? n.setHours(0, 0, 0, 0) : R.dateRange === "7days" ? n.setDate(t.getDate() - 7) : R.dateRange === "30days" && n.setDate(t.getDate() - 30), e = e.filter((e) => new Date(e.orderDate) >= n);
+		}
+		return e.sort((e, t) => new Date(t.orderDate).getTime() - new Date(e.orderDate).getTime());
+	}, [
+		I,
+		R.fulfillmentType,
+		R.searchQuery,
+		R.dateRange
+	]), ue = async () => {
+		await le(), J("Orders refreshed", "success");
+	}, Q = (e, t) => {
 		let n = {
 			accept: "confirmed",
 			reject: "cancelled",
+			prepare: "preparing",
 			ready: "ready",
 			complete: "delivered"
 		};
-		R((r) => r.map((r) => r.id === e ? {
+		L((r) => r.map((r) => r.id === e ? {
 			...r,
 			status: n[t]
-		} : r)), I.mutate({
+		} : r)), F.mutate({
 			id: e,
 			status: {
 				accept: "CONFIRMED",
 				reject: "CANCELLED",
+				prepare: "PREPARING",
 				ready: "READY",
 				complete: "DELIVERED"
 			}[t]
-		}, { onError: () => q("Could not update the order on the server", "error") }), q({
+		}, { onError: () => J("Could not update the order on the server", "error") }), J({
 			accept: "Order accepted",
 			reject: "Order rejected",
+			prepare: "Order moved to preparing",
 			ready: "Order marked as ready",
 			complete: "Order completed"
-		}[t], "success"), U && V?.id === e && W(!1);
-	};
+		}[t], "success"), W && H?.id === e && G(!1);
+	}, $ = (e) => {
+		let n = O[e.fulfillmentType || "delivery"] || O.delivery, r = n.icon, i = e.status === "pending" ? {
+			label: "Accept",
+			action: "accept"
+		} : e.status === "confirmed" ? {
+			label: "Start Preparing",
+			action: "prepare"
+		} : e.status === "preparing" ? {
+			label: "Mark Ready",
+			action: "ready"
+		} : e.status === "ready" ? {
+			label: "Complete",
+			action: "complete"
+		} : null;
+		return /* @__PURE__ */ T("div", {
+			className: "rounded-[var(--radius-input)] border border-border-subtle bg-bg-surface p-3 shadow-sm",
+			children: [
+				/* @__PURE__ */ T("div", {
+					className: "mb-1.5 flex items-center justify-between gap-2",
+					children: [/* @__PURE__ */ T("span", {
+						className: "truncate text-xs font-medium text-text-secondary",
+						children: ["Order #", e.id.slice(0, 8)]
+					}), /* @__PURE__ */ w("span", {
+						className: "shrink-0 text-[11px] text-text-muted",
+						children: k(e.orderDate)
+					})]
+				}),
+				/* @__PURE__ */ T("div", {
+					className: "mb-1.5 flex items-center justify-between gap-2",
+					children: [/* @__PURE__ */ w("span", {
+						className: "truncate text-sm font-semibold text-text-primary",
+						children: e.customerName || "Customer"
+					}), /* @__PURE__ */ w("span", {
+						className: "shrink-0 text-sm font-bold text-text-primary",
+						children: a(e.total, { minimumFractionDigits: 0 })
+					})]
+				}),
+				/* @__PURE__ */ w("p", {
+					className: "mb-2 line-clamp-2 text-xs text-text-secondary",
+					children: e.items.map((e) => `${e.name} ×${e.quantity}`).join(", ")
+				}),
+				/* @__PURE__ */ w("div", {
+					className: "mb-2 flex items-center gap-1.5",
+					children: /* @__PURE__ */ T("span", {
+						className: t("inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-[10px] font-medium", n.color),
+						children: [/* @__PURE__ */ w(r, { className: "h-3 w-3" }), n.label]
+					})
+				}),
+				/* @__PURE__ */ T("div", {
+					className: "flex gap-1.5",
+					children: [
+						i && /* @__PURE__ */ w("button", {
+							type: "button",
+							onClick: () => Q(e.id, i.action),
+							className: "flex-1 rounded-md bg-action-primary-bg px-2.5 py-1.5 text-xs font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg-hover",
+							children: i.label
+						}),
+						/* @__PURE__ */ w("button", {
+							type: "button",
+							onClick: () => {
+								U(e), G(!0);
+							},
+							className: "rounded-md border border-border-subtle px-2.5 py-1.5 text-xs font-medium text-text-primary transition-colors hover:bg-bg-sunken",
+							children: "Details"
+						}),
+						e.status === "pending" && /* @__PURE__ */ w("button", {
+							type: "button",
+							onClick: () => Q(e.id, "reject"),
+							"aria-label": "Reject order",
+							className: "rounded-md border border-border-subtle px-2 py-1.5 text-status-error-text transition-colors hover:bg-status-error-bg-subtle",
+							children: /* @__PURE__ */ w(S, { className: "h-3.5 w-3.5" })
+						})
+					]
+				})
+			]
+		});
+	}, de = [
+		{
+			id: "new",
+			title: "New",
+			accent: o.warning,
+			items: Z.filter((e) => e.status === "pending").map($)
+		},
+		{
+			id: "preparing",
+			title: "Preparing",
+			accent: o.info,
+			items: Z.filter((e) => e.status === "confirmed" || e.status === "preparing").map($)
+		},
+		{
+			id: "ready",
+			title: "Ready",
+			accent: o.success,
+			items: Z.filter((e) => e.status === "ready" || e.status === "out_for_delivery").map($)
+		},
+		{
+			id: "completed",
+			title: "Completed",
+			items: Z.filter((e) => e.status === "delivered").map($)
+		}
+	];
 	return /* @__PURE__ */ T(n, {
 		title: "Order Management",
 		description: "Manage incoming and active orders",
 		actions: /* @__PURE__ */ T("button", {
 			type: "button",
-			onClick: () => q("Orders refreshed", "success"),
-			className: "inline-flex items-center gap-2 rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken transition-colors",
-			children: [/* @__PURE__ */ w(_, { className: "h-4 w-4" }), "Refresh"]
+			onClick: ue,
+			disabled: P,
+			className: "inline-flex items-center gap-2 rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken transition-colors disabled:opacity-60 disabled:cursor-not-allowed",
+			children: [/* @__PURE__ */ w(re, { className: t("h-4 w-4", P && "animate-spin") }), "Refresh"]
 		}),
 		children: [
-			/* @__PURE__ */ w(D, {
+			/* @__PURE__ */ w(ae, {
 				className: "mb-6",
 				children: "Your live order queue. Use this page to run service as it happens — accept new orders, move them through preparing and ready, hand off for pickup, delivery or cart dispatch, and keep customers updated. Filter by status or type to focus on what needs doing right now, and watch today's totals so you know how the day is going."
 			}),
 			/* @__PURE__ */ T("div", {
 				className: "space-y-4",
 				children: [
-					G && /* @__PURE__ */ T("div", {
-						className: t("flex items-center gap-2 rounded-lg border p-3", G.type === "success" ? "border-status-success-text/30 bg-status-success-bg-subtle" : "border-status-error-text/30 bg-status-error-bg-subtle"),
-						children: [G.type === "success" ? /* @__PURE__ */ w(f, { className: "h-4 w-4 text-status-success-text" }) : /* @__PURE__ */ w(d, { className: "h-4 w-4 text-status-error-text" }), /* @__PURE__ */ w("span", {
-							className: t("text-sm font-medium", G.type === "success" ? "text-status-success-text" : "text-status-error-text"),
-							children: G.text
+					K && /* @__PURE__ */ T("div", {
+						className: t("flex items-center gap-2 rounded-lg border p-3", K.type === "success" ? "border-status-success-text/30 bg-status-success-bg-subtle" : "border-status-error-text/30 bg-status-error-bg-subtle"),
+						children: [K.type === "success" ? /* @__PURE__ */ w(p, { className: "h-4 w-4 text-status-success-text" }) : /* @__PURE__ */ w(ne, { className: "h-4 w-4 text-status-error-text" }), /* @__PURE__ */ w("span", {
+							className: t("text-sm font-medium", K.type === "success" ? "text-status-success-text" : "text-status-error-text"),
+							children: K.text
 						})]
 					}),
 					/* @__PURE__ */ T(E, { children: [/* @__PURE__ */ w("h2", {
@@ -178,68 +305,67 @@ var O = {
 					}), /* @__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: "Total Orders"
-								}), /* @__PURE__ */ w("p", {
-									className: "text-2xl font-bold text-text-primary",
-									children: J.total
-								})]
+							/* @__PURE__ */ w(s, {
+								label: "Total Orders",
+								value: Y.total,
+								icon: /* @__PURE__ */ w(b, { className: "h-4 w-4" })
 							}),
-							/* @__PURE__ */ T("div", {
-								className: "rounded-lg border border-status-warning-text/30 bg-status-warning-bg-subtle p-4 shadow-sm",
-								children: [/* @__PURE__ */ w("p", {
-									className: "text-xs text-status-warning-text",
-									children: "Pending"
-								}), /* @__PURE__ */ w("p", {
-									className: "text-2xl font-bold text-status-warning-text",
-									children: J.pending
-								})]
+							/* @__PURE__ */ w(s, {
+								label: "Pending",
+								value: /* @__PURE__ */ w("span", {
+									className: "text-status-warning-text",
+									children: Y.pending
+								}),
+								icon: /* @__PURE__ */ w(h, { className: "h-4 w-4" })
 							}),
-							/* @__PURE__ */ T("div", {
-								className: "rounded-lg border border-border-focus/30 bg-[var(--color-accent-soft)] p-4 shadow-sm",
-								children: [/* @__PURE__ */ w("p", {
-									className: "text-xs text-text-primary",
-									children: "Active"
-								}), /* @__PURE__ */ w("p", {
-									className: "text-2xl font-bold text-text-primary",
-									children: J.active
-								})]
+							/* @__PURE__ */ w(s, {
+								label: "Active",
+								value: Y.active,
+								icon: /* @__PURE__ */ w(m, { className: "h-4 w-4" })
 							}),
-							/* @__PURE__ */ T("div", {
-								className: "rounded-lg border border-status-success-text/30 bg-status-success-bg-subtle p-4 shadow-sm",
-								children: [/* @__PURE__ */ w("p", {
-									className: "text-xs text-status-success-text",
-									children: "Completed"
-								}), /* @__PURE__ */ w("p", {
-									className: "text-2xl font-bold text-status-success-text",
-									children: J.completed
-								})]
+							/* @__PURE__ */ w(s, {
+								label: "Completed",
+								value: /* @__PURE__ */ w("span", {
+									className: "text-status-success-text",
+									children: Y.completed
+								}),
+								icon: /* @__PURE__ */ w(p, { className: "h-4 w-4" })
 							}),
-							/* @__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: "Total Revenue"
-								}), /* @__PURE__ */ w("p", {
-									className: "text-2xl font-bold text-text-primary",
-									children: s(J.totalRevenue, { minimumFractionDigits: 0 })
-								})]
+							/* @__PURE__ */ w(s, {
+								label: "Total Revenue",
+								value: a(Y.totalRevenue, { minimumFractionDigits: 0 }),
+								icon: /* @__PURE__ */ w(_, { className: "h-4 w-4" })
 							}),
-							/* @__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 Order"
-								}), /* @__PURE__ */ w("p", {
-									className: "text-2xl font-bold text-text-primary",
-									children: s(J.avgOrder, { minimumFractionDigits: 0 })
-								})]
+							/* @__PURE__ */ w(s, {
+								label: "Avg Order",
+								value: a(Y.avgOrder, { minimumFractionDigits: 0 }),
+								icon: /* @__PURE__ */ w(x, { className: "h-4 w-4" })
 							})
 						]
 					})] }),
+					/* @__PURE__ */ T("div", {
+						className: "flex items-center justify-between gap-3",
+						children: [/* @__PURE__ */ w(l, {
+							"aria-label": "Order view",
+							value: B,
+							onChange: (e) => V(e),
+							tabs: [{
+								id: "board",
+								label: "Board"
+							}, {
+								id: "list",
+								label: "List"
+							}]
+						}), /* @__PURE__ */ T("p", {
+							className: "text-xs text-text-secondary",
+							children: [
+								Z.length,
+								" order",
+								Z.length === 1 ? "" : "s",
+								" in view"
+							]
+						})]
+					}),
 					/* @__PURE__ */ w("div", {
 						className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
 						children: /* @__PURE__ */ T("div", {
@@ -247,11 +373,11 @@ var O = {
 							children: [
 								/* @__PURE__ */ T("div", {
 									className: "relative sm:col-span-2 lg:col-span-1",
-									children: [/* @__PURE__ */ w(v, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ w("input", {
+									children: [/* @__PURE__ */ w(y, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ w("input", {
 										type: "text",
 										placeholder: "Search orders...",
-										value: z.searchQuery,
-										onChange: (e) => B((t) => ({
+										value: R.searchQuery,
+										onChange: (e) => z((t) => ({
 											...t,
 											searchQuery: e.target.value
 										})),
@@ -259,8 +385,8 @@ var O = {
 									})]
 								}),
 								/* @__PURE__ */ T("select", {
-									value: z.status,
-									onChange: (e) => B((t) => ({
+									value: R.status,
+									onChange: (e) => z((t) => ({
 										...t,
 										status: e.target.value
 									})),
@@ -297,8 +423,8 @@ var O = {
 									]
 								}),
 								/* @__PURE__ */ T("select", {
-									value: z.fulfillmentType,
-									onChange: (e) => B((t) => ({
+									value: R.fulfillmentType,
+									onChange: (e) => z((t) => ({
 										...t,
 										fulfillmentType: e.target.value
 									})),
@@ -323,8 +449,8 @@ var O = {
 									]
 								}),
 								/* @__PURE__ */ T("select", {
-									value: z.dateRange,
-									onChange: (e) => B((t) => ({
+									value: R.dateRange,
+									onChange: (e) => z((t) => ({
 										...t,
 										dateRange: e.target.value
 									})),
@@ -349,8 +475,8 @@ var O = {
 									]
 								}),
 								/* @__PURE__ */ T("select", {
-									value: z.sortBy,
-									onChange: (e) => B((t) => ({
+									value: R.sortBy,
+									onChange: (e) => z((t) => ({
 										...t,
 										sortBy: e.target.value
 									})),
@@ -377,22 +503,29 @@ var O = {
 							]
 						})
 					}),
-					F ? /* @__PURE__ */ w("div", {
+					ce ? /* @__PURE__ */ w("div", {
 						className: "flex items-center justify-center py-16",
 						children: /* @__PURE__ */ w("div", { className: "h-10 w-10 animate-spin rounded-full border-b-2 border-foreground" })
-					}) : Y.length === 0 ? /* @__PURE__ */ w(r, {
-						illustration: z.searchQuery || z.status ? "empty-search" : "empty-data",
+					}) : B === "board" ? Z.length === 0 ? /* @__PURE__ */ w(r, {
+						illustration: R.searchQuery ? "empty-search" : "empty-data",
 						title: "No orders found",
-						description: z.searchQuery || z.status ? "No orders match your current filters. Try adjusting the status, type or date range." : "New orders from customers will appear here in real time. Make sure your cart is open and accepting orders."
+						description: "New orders from customers appear on the board in real time. Make sure your cart is open and accepting orders."
+					}) : /* @__PURE__ */ w(c, {
+						columns: de,
+						emptyColumnHint: "No orders"
+					}) : X.length === 0 ? /* @__PURE__ */ w(r, {
+						illustration: R.searchQuery || R.status ? "empty-search" : "empty-data",
+						title: "No orders found",
+						description: R.searchQuery || R.status ? "No orders match your current filters. Try adjusting the status, type or date range." : "New orders from customers will appear here in real time. Make sure your cart is open and accepting orders."
 					}) : /* @__PURE__ */ w("div", {
 						className: "space-y-4",
-						children: Y.map((e) => {
-							let n = O[e.status] || {
+						children: X.map((e) => {
+							let n = D[e.status] || {
 								color: "bg-bg-sunken text-text-secondary",
 								label: e.status
-							}, r = k[e.fulfillmentType || "delivery"] || k.delivery, i = r.icon;
+							}, r = O[e.fulfillmentType || "delivery"] || O.delivery, i = r.icon;
 							return /* @__PURE__ */ w("div", {
-								className: t("rounded-lg border bg-bg-surface shadow-sm transition-shadow hover:shadow-md", M(e)),
+								className: t("rounded-lg border bg-bg-surface shadow-sm transition-shadow hover:shadow-md", oe(e)),
 								children: /* @__PURE__ */ T("div", {
 									className: "p-4 sm:p-5",
 									children: [
@@ -421,18 +554,18 @@ var O = {
 													children: [
 														e.customerName || "Customer",
 														" | ",
-														A(e.orderDate)
+														k(e.orderDate)
 													]
 												})]
 											}), /* @__PURE__ */ T("div", {
 												className: "flex items-center gap-3",
 												children: [/* @__PURE__ */ w("p", {
 													className: "text-lg font-bold text-text-primary",
-													children: s(e.total, { minimumFractionDigits: 0 })
+													children: a(e.total, { minimumFractionDigits: 0 })
 												}), /* @__PURE__ */ w("button", {
 													type: "button",
 													onClick: () => {
-														H(e), W(!0);
+														U(e), G(!0);
 													},
 													className: "rounded-md border border-border-subtle px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-bg-sunken transition-colors",
 													children: "View Details"
@@ -458,42 +591,41 @@ var O = {
 											children: [
 												e.status === "pending" && /* @__PURE__ */ T(C, { children: [/* @__PURE__ */ T("button", {
 													type: "button",
-													onClick: () => X(e.id, "accept"),
+													onClick: () => Q(e.id, "accept"),
 													className: "inline-flex items-center gap-1.5 rounded-md bg-status-success-bg-subtle px-3 py-2 text-xs font-medium text-status-success-text hover:bg-status-success-bg-subtle transition-colors",
-													children: [/* @__PURE__ */ w(f, { className: "h-3.5 w-3.5" }), "Accept Order"]
+													children: [/* @__PURE__ */ w(p, { className: "h-3.5 w-3.5" }), "Accept Order"]
 												}), /* @__PURE__ */ T("button", {
 													type: "button",
-													onClick: () => X(e.id, "reject"),
+													onClick: () => Q(e.id, "reject"),
 													className: "inline-flex items-center gap-1.5 rounded-md bg-status-error-bg-subtle px-3 py-2 text-xs font-medium text-status-error-text hover:bg-status-error-bg-subtle transition-colors",
 													children: [/* @__PURE__ */ w(S, { className: "h-3.5 w-3.5" }), "Reject"]
 												})] }),
 												e.status === "confirmed" && /* @__PURE__ */ T("button", {
 													type: "button",
-													onClick: () => X(e.id, "ready"),
+													onClick: () => Q(e.id, "prepare"),
 													className: "inline-flex items-center gap-1.5 rounded-md bg-status-warning-bg-subtle px-3 py-2 text-xs font-medium text-status-warning-text hover:bg-status-warning-bg-subtle transition-colors",
-													children: [/* @__PURE__ */ w(p, { className: "h-3.5 w-3.5" }), "Start Preparing"]
+													children: [/* @__PURE__ */ w(m, { className: "h-3.5 w-3.5" }), "Start Preparing"]
 												}),
 												e.status === "preparing" && /* @__PURE__ */ T("button", {
 													type: "button",
-													onClick: () => X(e.id, "ready"),
+													onClick: () => Q(e.id, "ready"),
 													className: "inline-flex items-center gap-1.5 rounded-md bg-status-success-bg-subtle px-3 py-2 text-xs font-medium text-status-success-text hover:bg-status-success-bg-subtle transition-colors",
-													children: [/* @__PURE__ */ w(h, { className: "h-3.5 w-3.5" }), "Mark as Ready"]
+													children: [/* @__PURE__ */ w(_, { className: "h-3.5 w-3.5" }), "Mark as Ready"]
 												}),
 												e.status === "ready" && e.fulfillmentType === "pickup" && /* @__PURE__ */ T("button", {
 													type: "button",
-													onClick: () => X(e.id, "complete"),
+													onClick: () => Q(e.id, "complete"),
 													className: "inline-flex items-center gap-1.5 rounded-md bg-status-success-bg-subtle px-3 py-2 text-xs font-medium text-status-success-text hover:bg-status-success-bg-subtle transition-colors",
-													children: [/* @__PURE__ */ w(f, { className: "h-3.5 w-3.5" }), "Complete Order"]
+													children: [/* @__PURE__ */ w(p, { className: "h-3.5 w-3.5" }), "Complete Order"]
 												}),
 												[
 													"confirmed",
 													"preparing",
 													"ready"
-												].includes(e.status) && /* @__PURE__ */ T("button", {
-													type: "button",
-													onClick: () => alert("Contact feature coming soon!"),
+												].includes(e.status) && e.customerPhone && /* @__PURE__ */ T("a", {
+													href: `tel:${e.customerPhone}`,
 													className: "inline-flex items-center gap-1.5 rounded-md border border-border-subtle px-3 py-2 text-xs font-medium text-text-primary hover:bg-bg-sunken transition-colors",
-													children: [/* @__PURE__ */ w(g, { className: "h-3.5 w-3.5" }), "Contact Customer"]
+													children: [/* @__PURE__ */ w(v, { className: "h-3.5 w-3.5" }), "Contact Customer"]
 												})
 											]
 										}),
@@ -514,7 +646,7 @@ var O = {
 					})
 				]
 			}),
-			U && V && /* @__PURE__ */ w("div", {
+			W && H && /* @__PURE__ */ w("div", {
 				className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4",
 				children: /* @__PURE__ */ w("div", {
 					className: "w-full max-w-2xl max-h-[90vh] overflow-y-auto rounded-lg border border-border-subtle bg-bg-surface shadow-xl",
@@ -527,9 +659,9 @@ var O = {
 								children: "Order Details"
 							}), /* @__PURE__ */ w("button", {
 								type: "button",
-								onClick: () => W(!1),
+								onClick: () => G(!1),
 								className: "rounded p-1.5 text-text-secondary hover:text-text-primary hover:bg-bg-sunken transition-colors",
-								children: /* @__PURE__ */ w(x, { className: "h-5 w-5" })
+								children: /* @__PURE__ */ w(ie, { className: "h-5 w-5" })
 							})]
 						}), /* @__PURE__ */ T("div", {
 							className: "space-y-4",
@@ -542,28 +674,28 @@ var O = {
 											children: "Order ID"
 										}), /* @__PURE__ */ T("p", {
 											className: "text-sm font-medium text-text-primary",
-											children: ["#", V.id]
+											children: ["#", H.id]
 										})] }),
 										/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
 											className: "text-xs text-text-secondary",
 											children: "Status"
 										}), /* @__PURE__ */ w("span", {
-											className: t("inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium mt-0.5", (O[V.status] || O.pending).color),
-											children: (O[V.status] || O.pending).label
+											className: t("inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium mt-0.5", (D[H.status] || D.pending).color),
+											children: (D[H.status] || D.pending).label
 										})] }),
 										/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
 											className: "text-xs text-text-secondary",
 											children: "Customer"
 										}), /* @__PURE__ */ w("p", {
 											className: "text-sm font-medium text-text-primary",
-											children: V.customerName || "N/A"
+											children: H.customerName || "N/A"
 										})] }),
 										/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
 											className: "text-xs text-text-secondary",
 											children: "Order Time"
 										}), /* @__PURE__ */ w("p", {
 											className: "text-sm font-medium text-text-primary",
-											children: j(V.orderDate)
+											children: A(H.orderDate)
 										})] })
 									]
 								}),
@@ -574,7 +706,7 @@ var O = {
 										children: "Order Items"
 									}), /* @__PURE__ */ w("div", {
 										className: "space-y-2",
-										children: V.items.map((e, t) => /* @__PURE__ */ T("div", {
+										children: H.items.map((e, t) => /* @__PURE__ */ T("div", {
 											className: "flex justify-between items-start",
 											children: [/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
 												className: "text-sm font-medium text-text-primary",
@@ -582,14 +714,14 @@ var O = {
 											}), /* @__PURE__ */ T("p", {
 												className: "text-xs text-text-secondary",
 												children: [
-													s(e.price, { minimumFractionDigits: 0 }),
+													a(e.price, { minimumFractionDigits: 0 }),
 													" x",
 													" ",
 													e.quantity
 												]
 											})] }), /* @__PURE__ */ w("p", {
 												className: "text-sm font-medium text-text-primary",
-												children: s(e.price * e.quantity, { minimumFractionDigits: 0 })
+												children: a(e.price * e.quantity, { minimumFractionDigits: 0 })
 											})]
 										}, t))
 									})]
@@ -599,37 +731,37 @@ var O = {
 									children: [
 										/* @__PURE__ */ T("div", {
 											className: "flex justify-between text-sm text-text-secondary",
-											children: [/* @__PURE__ */ w("span", { children: "Subtotal" }), /* @__PURE__ */ w("span", { children: s(V.subtotal, { minimumFractionDigits: 0 }) })]
+											children: [/* @__PURE__ */ w("span", { children: "Subtotal" }), /* @__PURE__ */ w("span", { children: a(H.subtotal, { minimumFractionDigits: 0 }) })]
 										}),
 										/* @__PURE__ */ T("div", {
 											className: "flex justify-between text-sm text-text-secondary",
-											children: [/* @__PURE__ */ w("span", { children: "Delivery Fee" }), /* @__PURE__ */ w("span", { children: s(V.deliveryFee, { minimumFractionDigits: 0 }) })]
+											children: [/* @__PURE__ */ w("span", { children: "Delivery Fee" }), /* @__PURE__ */ w("span", { children: a(H.deliveryFee, { minimumFractionDigits: 0 }) })]
 										}),
 										/* @__PURE__ */ T("div", {
 											className: "flex justify-between text-sm text-text-secondary",
-											children: [/* @__PURE__ */ w("span", { children: "Tax" }), /* @__PURE__ */ w("span", { children: s(V.taxes, { minimumFractionDigits: 0 }) })]
+											children: [/* @__PURE__ */ w("span", { children: "Tax" }), /* @__PURE__ */ w("span", { children: a(H.taxes, { minimumFractionDigits: 0 }) })]
 										}),
 										/* @__PURE__ */ T("div", {
 											className: "flex justify-between font-semibold text-text-primary pt-2 border-t border-border-subtle",
-											children: [/* @__PURE__ */ w("span", { children: "Total" }), /* @__PURE__ */ w("span", { children: s(V.total, { minimumFractionDigits: 0 }) })]
+											children: [/* @__PURE__ */ w("span", { children: "Total" }), /* @__PURE__ */ w("span", { children: a(H.total, { minimumFractionDigits: 0 }) })]
 										})
 									]
 								}),
-								V.fulfillmentType === "delivery" && V.deliveryAddress && /* @__PURE__ */ T("div", {
+								H.fulfillmentType === "delivery" && H.deliveryAddress && /* @__PURE__ */ T("div", {
 									className: "border-t border-border-subtle pt-4",
 									children: [/* @__PURE__ */ T("h4", {
 										className: "text-sm font-medium text-text-primary mb-2 flex items-center gap-1.5",
-										children: [/* @__PURE__ */ w(m, { className: "h-4 w-4 text-text-secondary" }), "Delivery Address"]
+										children: [/* @__PURE__ */ w(g, { className: "h-4 w-4 text-text-secondary" }), "Delivery Address"]
 									}), /* @__PURE__ */ T("p", {
 										className: "text-sm text-text-secondary",
 										children: [
-											V.deliveryAddress.street,
+											H.deliveryAddress.street,
 											", ",
-											V.deliveryAddress.area,
+											H.deliveryAddress.area,
 											/* @__PURE__ */ w("br", {}),
-											V.deliveryAddress.city,
+											H.deliveryAddress.city,
 											" - ",
-											V.deliveryAddress.pincode
+											H.deliveryAddress.pincode
 										]
 									})]
 								}),
@@ -637,17 +769,17 @@ var O = {
 									className: "flex gap-3 mt-6",
 									children: [/* @__PURE__ */ w("button", {
 										type: "button",
-										onClick: () => W(!1),
+										onClick: () => G(!1),
 										className: "flex-1 rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken transition-colors",
 										children: "Close"
-									}), V.status === "pending" && /* @__PURE__ */ T(C, { children: [/* @__PURE__ */ w("button", {
+									}), H.status === "pending" && /* @__PURE__ */ T(C, { children: [/* @__PURE__ */ w("button", {
 										type: "button",
-										onClick: () => X(V.id, "accept"),
+										onClick: () => Q(H.id, "accept"),
 										className: "flex-1 rounded-md bg-status-success-bg-subtle px-4 py-2 text-sm font-medium text-status-success-text hover:bg-status-success-bg-subtle transition-colors",
 										children: "Accept Order"
 									}), /* @__PURE__ */ w("button", {
 										type: "button",
-										onClick: () => X(V.id, "reject"),
+										onClick: () => Q(H.id, "reject"),
 										className: "flex-1 rounded-md bg-status-error-bg-subtle px-4 py-2 text-sm font-medium text-status-error-text hover:bg-status-error-bg-subtle transition-colors",
 										children: "Reject Order"
 									})] })]
@@ -661,6 +793,6 @@ var O = {
 	});
 };
 //#endregion
-export { N as OrderManagementPage };
+export { se as OrderManagementPage };
 
 //# sourceMappingURL=OrderManagementPage.js.map