@burdenoff/microfe-kadaikodi 2026.626.2 → 2026.704.2

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

@@ -2,308 +2,99 @@ 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 { useMemo as i, useState as a } from "react";
-import { AlertCircle as o, CheckCircle2 as s, Clock as c, Edit2 as l, Mail as u, Phone as d, Search as f, Star as p, Trash2 as m, UserPlus as h, X as g } from "lucide-react";
-import { jsx as _, jsxs as v } from "react/jsx-runtime";
+import { useCreateProviderWorker as i, useProviderWorkers as a, useProviders as o } from "../../hooks/useKadaikodiApi.js";
+import { useMemo as s, useState as c } from "react";
+import { AlertCircle as l, CheckCircle2 as u, Mail as d, Phone as f, Search as p, UserPlus as m, X as h } from "lucide-react";
+import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
 import { EmphasisPanel as y, PagePurpose as b } from "@burdenoff/fe-libs/ui";
 //#region src/kadaikodi/pages/cart-owner/StaffManagementPage.tsx
 var x = [
-	{
-		id: "staff-001",
-		firstName: "Ravi",
-		lastName: "Kumar",
-		email: "ravi@dosaexpress.in",
-		phone: "+91-9876543210",
-		role: "delivery",
-		status: "active",
-		dateJoined: "2023-06-15",
-		lastActive: "2024-01-16T10:00:00Z",
-		hourlyRate: 200,
-		hoursWorked: 160,
-		totalEarnings: 32e3,
-		performance: {
-			rating: 4.8,
-			tasksCompleted: 245,
-			customerRating: 4.7,
-			punctuality: 95
-		},
-		currentShift: "09:00 - 17:00",
-		shiftsThisWeek: 5
-	},
-	{
-		id: "staff-002",
-		firstName: "Suresh",
-		lastName: "Worker",
-		email: "suresh@dosaexpress.in",
-		phone: "+91-9876543211",
-		role: "chef",
-		status: "active",
-		dateJoined: "2023-08-20",
-		lastActive: "2024-01-16T09:30:00Z",
-		hourlyRate: 250,
-		hoursWorked: 148,
-		totalEarnings: 37e3,
-		performance: {
-			rating: 4.6,
-			tasksCompleted: 312,
-			customerRating: 4.5,
-			punctuality: 90
-		},
-		currentShift: "10:00 - 18:00",
-		shiftsThisWeek: 4
-	},
-	{
-		id: "staff-003",
-		firstName: "Amit",
-		lastName: "Sharma",
-		email: "amit@dosaexpress.in",
-		phone: "+91-9876543212",
-		role: "delivery",
-		status: "on-leave",
-		dateJoined: "2023-10-01",
-		hourlyRate: 180,
-		hoursWorked: 120,
-		totalEarnings: 21600,
-		performance: {
-			rating: 4.4,
-			tasksCompleted: 178,
-			customerRating: 4.3,
-			punctuality: 85
-		},
-		shiftsThisWeek: 0
-	},
-	{
-		id: "staff-004",
-		firstName: "Priya",
-		lastName: "Helper",
-		email: "priya@dosaexpress.in",
-		phone: "+91-9876543213",
-		role: "server",
-		status: "inactive",
-		dateJoined: "2024-01-05",
-		hourlyRate: 150,
-		hoursWorked: 40,
-		totalEarnings: 6e3,
-		performance: {
-			rating: 4.7,
-			tasksCompleted: 56,
-			customerRating: 4.8,
-			punctuality: 98
-		},
-		shiftsThisWeek: 0
-	},
-	{
-		id: "staff-005",
-		firstName: "Kiran",
-		lastName: "B.",
-		email: "kiran@dosaexpress.in",
-		phone: "+91-9876543214",
-		role: "cashier",
-		status: "active",
-		dateJoined: "2023-12-10",
-		lastActive: "2024-01-16T11:00:00Z",
-		hourlyRate: 175,
-		hoursWorked: 80,
-		totalEarnings: 14e3,
-		performance: {
-			rating: 4.3,
-			tasksCompleted: 134,
-			customerRating: 4.2,
-			punctuality: 88
-		},
-		currentShift: "11:00 - 19:00",
-		shiftsThisWeek: 5
-	},
-	{
-		id: "staff-006",
-		firstName: "Meera",
-		lastName: "Devi",
-		email: "meera@dosaexpress.in",
-		phone: "+91-9876543215",
-		role: "manager",
-		status: "active",
-		dateJoined: "2023-04-01",
-		lastActive: "2024-01-16T08:00:00Z",
-		hourlyRate: 350,
-		hoursWorked: 168,
-		totalEarnings: 58800,
-		performance: {
-			rating: 4.9,
-			tasksCompleted: 420,
-			customerRating: 4.9,
-			punctuality: 99
-		},
-		currentShift: "08:00 - 16:00",
-		shiftsThisWeek: 6
-	}
-], S = {
-	active: {
-		label: "Active",
+	"MANAGER",
+	"CHEF",
+	"SERVER",
+	"DELIVERY",
+	"CASHIER"
+], S = (e) => e.replace(/_/g, " ").toLowerCase().replace(/\b\w/g, (e) => e.toUpperCase()), C = (e) => {
+	let t = e.toUpperCase();
+	return t === "ACTIVE" ? {
+		label: S(e),
 		color: "text-status-success-text",
 		dot: "bg-status-success-text"
-	},
-	inactive: {
-		label: "Inactive",
-		color: "text-text-secondary",
-		dot: "bg-muted-foreground"
-	},
-	"on-leave": {
-		label: "On Leave",
+	} : t === "ON_LEAVE" || t === "ON-LEAVE" ? {
+		label: S(e),
 		color: "text-status-warning-text",
 		dot: "bg-status-warning-text"
-	},
-	terminated: {
-		label: "Terminated",
-		color: "text-status-error-text",
-		dot: "bg-status-error-text"
-	}
-}, C = {
-	manager: {
-		label: "Manager",
-		color: "bg-accent-purple-subtle text-text-primary"
-	},
-	chef: {
-		label: "Chef",
-		color: "bg-status-warning-bg-subtle text-status-warning-text"
-	},
-	server: {
-		label: "Server",
-		color: "bg-[var(--color-accent-soft)] text-text-primary"
-	},
-	delivery: {
-		label: "Delivery",
-		color: "bg-status-success-bg-subtle text-status-success-text"
-	},
-	cashier: {
-		label: "Cashier",
-		color: "bg-[var(--color-accent-soft)] text-text-primary"
-	}
-}, w = {
+	} : {
+		label: S(e),
+		color: "text-text-secondary",
+		dot: "bg-muted-foreground"
+	};
+}, w = (e) => {
+	if (!e || typeof e != "object") return {};
+	let t = e;
+	return {
+		email: typeof t.email == "string" ? t.email : void 0,
+		phone: typeof t.phone == "string" ? t.phone : void 0
+	};
+}, T = {
+	name: "",
 	email: "",
-	firstName: "",
-	lastName: "",
 	phone: "",
-	role: "server",
-	hourlyRate: 150
-}, T = () => {
-	let { navigateTo: T } = e(), [E, D] = a(x), [O, k] = a(""), [A, j] = a(""), [M, N] = a(""), [P, F] = a("name"), [I, L] = a(!1), [R, z] = a(!1), [B, V] = a(null), [H, U] = a(w), [W, G] = a({
-		firstName: "",
-		lastName: "",
-		email: "",
-		phone: "",
-		role: "server",
-		hourlyRate: 150,
-		status: "active"
-	}), [K, q] = a(null), J = (e, t) => {
-		q({
+	role: "SERVER"
+}, E = () => {
+	let { currentUser: E } = e(), { data: D = [], isLoading: O } = o(), k = s(() => D.find((e) => e.ownerId === E?.id) ?? D[0], [D, E?.id]), A = k?.id, { data: j = [], isLoading: M } = a(A), N = i(), [P, F] = c(""), [I, L] = c(""), [R, z] = c(""), [B, V] = c(!1), [H, U] = c(T), [W, G] = c(null), K = (e, t) => {
+		G({
 			text: e,
 			type: t
-		}), setTimeout(() => q(null), 3e3);
-	}, Y = E.filter((e) => e.status === "active").length, X = E.filter((e) => e.status === "on-leave").length, Z = E.length > 0 ? (E.reduce((e, t) => e + t.performance.rating, 0) / E.length).toFixed(1) : "0";
-	E.reduce((e, t) => e + t.totalEarnings, 0);
-	let Q = i(() => {
-		let e = [...E];
-		if (O) {
-			let t = O.toLowerCase();
-			e = e.filter((e) => `${e.firstName} ${e.lastName}`.toLowerCase().includes(t) || e.email.toLowerCase().includes(t) || e.phone.includes(t));
+		}), setTimeout(() => G(null), 3e3);
+	}, q = s(() => [...new Set(j.map((e) => e.role))].sort(), [j]), J = s(() => [...new Set(j.map((e) => e.status))].sort(), [j]), Y = j.filter((e) => e.status.toUpperCase() === "ACTIVE").length, X = j.filter((e) => {
+		let t = e.status.toUpperCase();
+		return t === "ON_LEAVE" || t === "ON-LEAVE";
+	}).length, Z = s(() => {
+		let e = [...j];
+		if (P) {
+			let t = P.toLowerCase();
+			e = e.filter((e) => {
+				let n = w(e.metadata);
+				return e.name.toLowerCase().includes(t) || e.role.toLowerCase().includes(t) || (n.email ?? "").toLowerCase().includes(t) || (n.phone ?? "").includes(t);
+			});
 		}
-		switch (A && (e = e.filter((e) => e.role === A)), M && (e = e.filter((e) => e.status === M)), P) {
-			case "name":
-				e.sort((e, t) => `${e.firstName} ${e.lastName}`.localeCompare(`${t.firstName} ${t.lastName}`));
-				break;
-			case "rating":
-				e.sort((e, t) => t.performance.rating - e.performance.rating);
-				break;
-			case "hours":
-				e.sort((e, t) => t.hoursWorked - e.hoursWorked);
-				break;
-			case "joined":
-				e.sort((e, t) => new Date(t.dateJoined).getTime() - new Date(e.dateJoined).getTime());
-				break;
-		}
-		return e;
+		return I && (e = e.filter((e) => e.role === I)), R && (e = e.filter((e) => e.status === R)), e.sort((e, t) => e.name.localeCompare(t.name)), e;
 	}, [
-		E,
-		O,
-		A,
-		M,
-		P
-	]), $ = () => {
-		if (!H.email || !H.firstName || !H.lastName) {
-			J("Please fill in all required fields", "error");
-			return;
-		}
-		let e = {
-			id: `staff-${Date.now()}`,
-			...H,
-			status: "active",
-			dateJoined: (/* @__PURE__ */ new Date()).toISOString().split("T")[0],
-			hoursWorked: 0,
-			totalEarnings: 0,
-			performance: {
-				rating: 0,
-				tasksCompleted: 0,
-				customerRating: 0,
-				punctuality: 0
-			},
-			shiftsThisWeek: 0
-		};
-		D((t) => [...t, e]), L(!1), U(w), J("Staff member invited successfully", "success");
-	}, ee = (e) => {
-		V(e), G({
-			firstName: e.firstName,
-			lastName: e.lastName,
-			email: e.email,
-			phone: e.phone,
-			role: e.role,
-			hourlyRate: e.hourlyRate,
-			status: e.status
-		}), z(!0);
-	}, te = () => {
-		B && (D((e) => e.map((e) => e.id === B.id ? {
-			...e,
-			...W
-		} : e)), z(!1), J("Staff member updated successfully", "success"));
-	}, ne = (e) => {
-		D((t) => t.map((t) => {
-			if (t.id === e) {
-				let e = t.status === "active" ? "inactive" : "active";
-				return {
-					...t,
-					status: e
-				};
-			}
-			return t;
-		})), J("Staff status updated", "success");
-	}, re = (e) => {
-		confirm("Are you sure you want to remove this staff member?") && (D((t) => t.filter((t) => t.id !== e)), J("Staff member removed", "success"));
-	};
+		j,
+		P,
+		I,
+		R
+	]), Q = !!(P || I || R);
 	return /* @__PURE__ */ v(n, {
 		title: "Staff Management",
-		description: "Manage your workers, delivery partners, and shifts",
+		description: "Manage your workers and delivery partners",
 		actions: /* @__PURE__ */ v("button", {
 			type: "button",
 			onClick: () => {
-				U(w), L(!0);
+				U(T), V(!0);
 			},
-			className: "inline-flex items-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent/80 transition-colors",
-			children: [/* @__PURE__ */ _(h, { className: "h-4 w-4" }), "Invite Staff"]
+			disabled: !A,
+			className: t("inline-flex items-center gap-2 rounded-md px-4 py-2 text-sm font-medium transition-colors", A ? "bg-accent text-text-primary hover:bg-accent/80" : "bg-bg-sunken text-text-secondary cursor-not-allowed"),
+			children: [/* @__PURE__ */ _(m, { className: "h-4 w-4" }), "Add Staff"]
 		}),
 		children: [
 			/* @__PURE__ */ _(b, {
 				className: "mb-6",
-				children: "Your team in one place. Use this page to invite workers and delivery partners, see who's active or on leave right now, manage roles and ratings, and keep shifts covered so orders go out on time. Invite new staff and review performance to build a reliable crew around your cart."
+				children: "Your team in one place. Use this page to add workers and delivery partners to your cart, see who's active, and keep your roster organised so orders go out on time. Build a reliable crew around your cart."
 			}),
 			/* @__PURE__ */ v("div", {
 				className: "space-y-4",
-				children: [
-					K && /* @__PURE__ */ v("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__ */ _(s, { className: "h-4 w-4 text-status-success-text" }) : /* @__PURE__ */ _(o, { className: "h-4 w-4 text-status-error-text" }), /* @__PURE__ */ _("span", {
-							className: t("text-sm font-medium", K.type === "success" ? "text-status-success-text" : "text-status-error-text"),
-							children: K.text
-						})]
-					}),
+				children: [W && /* @__PURE__ */ v("div", {
+					className: t("flex items-center gap-2 rounded-lg border p-3", W.type === "success" ? "border-status-success-text/30 bg-status-success-bg-subtle" : "border-status-error-text/30 bg-status-error-bg-subtle"),
+					children: [W.type === "success" ? /* @__PURE__ */ _(u, { className: "h-4 w-4 text-status-success-text" }) : /* @__PURE__ */ _(l, { className: "h-4 w-4 text-status-error-text" }), /* @__PURE__ */ _("span", {
+						className: t("text-sm font-medium", W.type === "success" ? "text-status-success-text" : "text-status-error-text"),
+						children: W.text
+					})]
+				}), O ? /* @__PURE__ */ _("div", {
+					className: "flex items-center justify-center py-24",
+					children: /* @__PURE__ */ _("div", { className: "h-10 w-10 animate-spin rounded-full border-b-2 border-foreground" })
+				}) : k ? /* @__PURE__ */ v(g, { children: [
 					/* @__PURE__ */ v(y, { children: [/* @__PURE__ */ _("h2", {
 						className: "mb-4 text-base font-semibold text-text-primary",
 						children: "Team Overview"
@@ -314,7 +105,7 @@ var x = [
 								className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
 								children: [/* @__PURE__ */ _("p", {
 									className: "text-2xl font-bold text-text-primary",
-									children: E.length
+									children: j.length
 								}), /* @__PURE__ */ _("p", {
 									className: "text-xs text-text-secondary",
 									children: "Total Staff"
@@ -327,7 +118,7 @@ var x = [
 									children: Y
 								}), /* @__PURE__ */ _("p", {
 									className: "text-xs text-text-secondary",
-									children: "Active Now"
+									children: "Active"
 								})]
 							}),
 							/* @__PURE__ */ v("div", {
@@ -344,10 +135,10 @@ var x = [
 								className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
 								children: [/* @__PURE__ */ _("p", {
 									className: "text-2xl font-bold text-text-primary",
-									children: Z
+									children: q.length
 								}), /* @__PURE__ */ _("p", {
 									className: "text-xs text-text-secondary",
-									children: "Avg. Rating"
+									children: "Roles"
 								})]
 							})
 						]
@@ -355,231 +146,124 @@ var x = [
 					/* @__PURE__ */ _("div", {
 						className: "rounded-lg border border-border-subtle bg-bg-surface p-4 shadow-sm",
 						children: /* @__PURE__ */ v("div", {
-							className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3",
+							className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3",
 							children: [
 								/* @__PURE__ */ v("div", {
 									className: "relative",
-									children: [/* @__PURE__ */ _(f, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ _("input", {
+									children: [/* @__PURE__ */ _(p, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ _("input", {
 										type: "text",
 										placeholder: "Search staff...",
-										value: O,
-										onChange: (e) => k(e.target.value),
+										value: P,
+										onChange: (e) => F(e.target.value),
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface pl-10 pr-4 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 									})]
 								}),
 								/* @__PURE__ */ v("select", {
-									value: A,
-									onChange: (e) => j(e.target.value),
+									value: I,
+									onChange: (e) => L(e.target.value),
 									className: "rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary",
 									children: [/* @__PURE__ */ _("option", {
 										value: "",
 										children: "All Roles"
-									}), Object.entries(C).map(([e, t]) => /* @__PURE__ */ _("option", {
+									}), q.map((e) => /* @__PURE__ */ _("option", {
 										value: e,
-										children: t.label
+										children: S(e)
 									}, e))]
 								}),
 								/* @__PURE__ */ v("select", {
-									value: M,
-									onChange: (e) => N(e.target.value),
+									value: R,
+									onChange: (e) => z(e.target.value),
 									className: "rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary",
 									children: [/* @__PURE__ */ _("option", {
 										value: "",
 										children: "All Status"
-									}), Object.entries(S).map(([e, t]) => /* @__PURE__ */ _("option", {
+									}), J.map((e) => /* @__PURE__ */ _("option", {
 										value: e,
-										children: t.label
+										children: S(e)
 									}, e))]
-								}),
-								/* @__PURE__ */ v("select", {
-									value: P,
-									onChange: (e) => F(e.target.value),
-									className: "rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary",
-									children: [
-										/* @__PURE__ */ _("option", {
-											value: "name",
-											children: "Name A-Z"
-										}),
-										/* @__PURE__ */ _("option", {
-											value: "rating",
-											children: "Rating: High to Low"
-										}),
-										/* @__PURE__ */ _("option", {
-											value: "hours",
-											children: "Hours: Most Worked"
-										}),
-										/* @__PURE__ */ _("option", {
-											value: "joined",
-											children: "Recently Joined"
-										})
-									]
 								})
 							]
 						})
 					}),
-					Q.length === 0 ? /* @__PURE__ */ _(r, {
-						illustration: O || A || M ? "empty-search" : "empty-people",
+					M ? /* @__PURE__ */ _("div", {
+						className: "flex items-center justify-center py-16",
+						children: /* @__PURE__ */ _("div", { className: "h-10 w-10 animate-spin rounded-full border-b-2 border-foreground" })
+					}) : Z.length === 0 ? /* @__PURE__ */ _(r, {
+						illustration: Q ? "empty-search" : "empty-people",
 						title: "No staff members found",
-						description: O || A || M ? "No team members match your current filters. Try clearing them or searching for a different name." : "You have no staff yet. Invite your first worker or delivery partner to start building your team.",
-						action: O || A || M ? /* @__PURE__ */ _("button", {
+						description: Q ? "No team members match your current filters. Try clearing them or searching for a different name." : "You have no staff yet. Add your first worker or delivery partner to start building your team.",
+						action: Q ? /* @__PURE__ */ _("button", {
 							type: "button",
 							onClick: () => {
-								k(""), j(""), N(""), F("name");
+								F(""), L(""), z("");
 							},
 							className: "rounded-md border border-border-subtle px-4 py-2 text-sm text-text-primary hover:bg-bg-sunken",
 							children: "Clear filters"
 						}) : /* @__PURE__ */ v("button", {
 							type: "button",
 							onClick: () => {
-								U(w), L(!0);
+								U(T), V(!0);
 							},
 							className: "inline-flex items-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent/80",
-							children: [/* @__PURE__ */ _(h, { className: "h-4 w-4" }), "Invite Staff"]
+							children: [/* @__PURE__ */ _(m, { className: "h-4 w-4" }), "Add Staff"]
 						})
 					}) : /* @__PURE__ */ _("div", {
 						className: "rounded-lg border border-border-subtle bg-bg-surface shadow-sm divide-y divide-border",
-						children: Q.map((e) => {
-							let n = S[e.status], r = C[e.role];
-							return /* @__PURE__ */ v("div", {
+						children: Z.map((e) => {
+							let n = C(e.status), r = w(e.metadata);
+							return /* @__PURE__ */ _("div", {
 								className: "p-4 sm:p-5 hover:bg-bg-sunken/30 transition-colors",
-								children: [/* @__PURE__ */ v("div", {
+								children: /* @__PURE__ */ _("div", {
 									className: "flex flex-col sm:flex-row sm:items-center gap-4",
-									children: [/* @__PURE__ */ v("div", {
+									children: /* @__PURE__ */ v("div", {
 										className: "flex items-center gap-4 flex-1 min-w-0",
 										children: [/* @__PURE__ */ v("div", {
 											className: "relative shrink-0",
 											children: [/* @__PURE__ */ _("div", {
 												className: "flex h-12 w-12 items-center justify-center rounded-full bg-bg-sunken text-sm font-semibold text-text-primary",
-												children: `${e.firstName[0]}${e.lastName[0]}`
+												children: e.name.split(" ").map((e) => e[0]).filter(Boolean).slice(0, 2).join("").toUpperCase() || "?"
 											}), /* @__PURE__ */ _("span", { className: t("absolute -bottom-0.5 -right-0.5 h-3.5 w-3.5 rounded-full border-2 border-card", n.dot) })]
 										}), /* @__PURE__ */ v("div", {
 											className: "flex-1 min-w-0",
 											children: [/* @__PURE__ */ v("div", {
 												className: "flex items-center gap-2 flex-wrap",
 												children: [
-													/* @__PURE__ */ v("p", {
+													/* @__PURE__ */ _("p", {
 														className: "text-sm font-medium text-text-primary",
-														children: [
-															e.firstName,
-															" ",
-															e.lastName
-														]
+														children: e.name
 													}),
 													/* @__PURE__ */ _("span", {
-														className: t("inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium", r.color),
-														children: r.label
+														className: "inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium bg-[var(--color-accent-soft)] text-text-primary",
+														children: S(e.role)
 													}),
 													/* @__PURE__ */ _("span", {
 														className: t("text-xs", n.color),
 														children: n.label
 													})
 												]
-											}), /* @__PURE__ */ v("div", {
+											}), (r.email || r.phone) && /* @__PURE__ */ v("div", {
 												className: "flex items-center gap-3 mt-1 text-xs text-text-secondary flex-wrap",
-												children: [/* @__PURE__ */ v("span", {
+												children: [r.email && /* @__PURE__ */ v("span", {
 													className: "flex items-center gap-1",
-													children: [/* @__PURE__ */ _(u, { className: "h-3 w-3" }), e.email]
-												}), /* @__PURE__ */ v("span", {
+													children: [/* @__PURE__ */ _(d, { className: "h-3 w-3" }), r.email]
+												}), r.phone && /* @__PURE__ */ v("span", {
 													className: "flex items-center gap-1",
-													children: [/* @__PURE__ */ _(d, { className: "h-3 w-3" }), e.phone]
+													children: [/* @__PURE__ */ _(f, { className: "h-3 w-3" }), r.phone]
 												})]
 											})]
 										})]
-									}), /* @__PURE__ */ v("div", {
-										className: "flex items-center gap-4 sm:gap-6",
-										children: [/* @__PURE__ */ v("div", {
-											className: "hidden md:flex items-center gap-4 text-xs",
-											children: [
-												/* @__PURE__ */ v("div", {
-													className: "text-center",
-													children: [/* @__PURE__ */ v("p", {
-														className: "font-bold text-text-primary flex items-center gap-0.5 justify-center",
-														children: [/* @__PURE__ */ _(p, { className: "h-3 w-3 fill-status-warning-text text-status-warning-text" }), e.performance.rating]
-													}), /* @__PURE__ */ _("p", {
-														className: "text-text-secondary",
-														children: "Rating"
-													})]
-												}),
-												/* @__PURE__ */ v("div", {
-													className: "text-center",
-													children: [/* @__PURE__ */ _("p", {
-														className: "font-bold text-text-primary",
-														children: e.performance.tasksCompleted
-													}), /* @__PURE__ */ _("p", {
-														className: "text-text-secondary",
-														children: "Tasks"
-													})]
-												}),
-												/* @__PURE__ */ v("div", {
-													className: "text-center",
-													children: [/* @__PURE__ */ v("p", {
-														className: "font-bold text-text-primary",
-														children: [e.performance.punctuality, "%"]
-													}), /* @__PURE__ */ _("p", {
-														className: "text-text-secondary",
-														children: "On Time"
-													})]
-												}),
-												e.currentShift && /* @__PURE__ */ v("div", {
-													className: "text-center",
-													children: [/* @__PURE__ */ v("p", {
-														className: "font-bold text-text-primary flex items-center gap-0.5 justify-center",
-														children: [/* @__PURE__ */ _(c, { className: "h-3 w-3 text-text-secondary" }), e.currentShift]
-													}), /* @__PURE__ */ _("p", {
-														className: "text-text-secondary",
-														children: "Shift"
-													})]
-												})
-											]
-										}), /* @__PURE__ */ v("div", {
-											className: "flex items-center gap-1",
-											children: [
-												/* @__PURE__ */ _("button", {
-													type: "button",
-													onClick: () => ne(e.id),
-													className: t("h-6 w-11 rounded-full transition-colors relative", e.status === "active" ? "bg-status-success-text" : "bg-muted-foreground/30"),
-													title: e.status === "active" ? "Deactivate" : "Activate",
-													children: /* @__PURE__ */ _("div", { className: t("absolute top-0.5 h-5 w-5 rounded-full bg-white transition-transform", e.status === "active" ? "translate-x-5" : "translate-x-0.5") })
-												}),
-												/* @__PURE__ */ _("button", {
-													type: "button",
-													onClick: () => ee(e),
-													className: "rounded p-1.5 text-text-secondary hover:bg-bg-sunken hover:text-text-primary transition-colors",
-													title: "Edit",
-													children: /* @__PURE__ */ _(l, { className: "h-4 w-4" })
-												}),
-												/* @__PURE__ */ _("button", {
-													type: "button",
-													onClick: () => re(e.id),
-													className: "rounded p-1.5 text-text-secondary hover:bg-status-error-bg-subtle hover:text-status-error-text transition-colors",
-													title: "Remove",
-													children: /* @__PURE__ */ _(m, { className: "h-4 w-4" })
-												})
-											]
-										})]
-									})]
-								}), /* @__PURE__ */ v("div", {
-									className: "md:hidden flex items-center gap-4 mt-3 text-xs text-text-secondary",
-									children: [
-										/* @__PURE__ */ v("span", {
-											className: "flex items-center gap-0.5",
-											children: [/* @__PURE__ */ _(p, { className: "h-3 w-3 fill-status-warning-text text-status-warning-text" }), e.performance.rating]
-										}),
-										/* @__PURE__ */ v("span", { children: [e.performance.tasksCompleted, " tasks"] }),
-										/* @__PURE__ */ v("span", { children: [e.performance.punctuality, "% on time"] }),
-										e.currentShift && /* @__PURE__ */ v("span", {
-											className: "flex items-center gap-0.5",
-											children: [/* @__PURE__ */ _(c, { className: "h-3 w-3" }), e.currentShift]
-										}),
-										/* @__PURE__ */ v("span", { children: [e.shiftsThisWeek, " shifts/wk"] })
-									]
-								})]
+									})
+								})
 							}, e.id);
 						})
 					})
-				]
+				] }) : /* @__PURE__ */ _(r, {
+					illustration: "empty-people",
+					title: "Create your cart first",
+					description: "You need a service provider before you can add staff. Set up your cart to get started."
+				})]
 			}),
-			I && /* @__PURE__ */ _("div", {
+			B && /* @__PURE__ */ _("div", {
 				className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4",
 				children: /* @__PURE__ */ _("div", {
 					className: "w-full max-w-lg rounded-lg border border-border-subtle bg-bg-surface shadow-xl",
@@ -590,64 +274,38 @@ var x = [
 								className: "flex items-center justify-between mb-4",
 								children: [/* @__PURE__ */ _("h3", {
 									className: "text-lg font-semibold text-text-primary",
-									children: "Invite Staff Member"
+									children: "Add Staff Member"
 								}), /* @__PURE__ */ _("button", {
 									type: "button",
-									onClick: () => L(!1),
+									onClick: () => V(!1),
 									className: "rounded p-1.5 text-text-secondary hover:text-text-primary hover:bg-bg-sunken",
-									children: /* @__PURE__ */ _(g, { className: "h-5 w-5" })
+									children: /* @__PURE__ */ _(h, { className: "h-5 w-5" })
 								})]
 							}),
 							/* @__PURE__ */ v("div", {
 								className: "space-y-4",
 								children: [
-									/* @__PURE__ */ v("div", {
-										className: "grid grid-cols-2 gap-4",
-										children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-											className: "block text-sm font-medium text-text-primary mb-1",
-											children: "First Name *"
-										}), /* @__PURE__ */ _("input", {
-											type: "text",
-											value: H.firstName,
-											onChange: (e) => U((t) => ({
-												...t,
-												firstName: e.target.value
-											})),
-											className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary"
-										})] }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-											className: "block text-sm font-medium text-text-primary mb-1",
-											children: "Last Name *"
-										}), /* @__PURE__ */ _("input", {
-											type: "text",
-											value: H.lastName,
-											onChange: (e) => U((t) => ({
-												...t,
-												lastName: e.target.value
-											})),
-											className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary"
-										})] })]
-									}),
 									/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
 										className: "block text-sm font-medium text-text-primary mb-1",
-										children: "Email *"
+										children: "Full Name *"
 									}), /* @__PURE__ */ _("input", {
-										type: "email",
-										value: H.email,
+										type: "text",
+										value: H.name,
 										onChange: (e) => U((t) => ({
 											...t,
-											email: e.target.value
+											name: e.target.value
 										})),
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary"
 									})] }),
 									/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
 										className: "block text-sm font-medium text-text-primary mb-1",
-										children: "Phone"
+										children: "Email"
 									}), /* @__PURE__ */ _("input", {
-										type: "tel",
-										value: H.phone,
+										type: "email",
+										value: H.email,
 										onChange: (e) => U((t) => ({
 											...t,
-											phone: e.target.value
+											email: e.target.value
 										})),
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary"
 									})] }),
@@ -655,169 +313,30 @@ var x = [
 										className: "grid grid-cols-2 gap-4",
 										children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
 											className: "block text-sm font-medium text-text-primary mb-1",
-											children: "Role"
-										}), /* @__PURE__ */ _("select", {
-											value: H.role,
-											onChange: (e) => U((t) => ({
-												...t,
-												role: e.target.value
-											})),
-											className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary",
-											children: Object.entries(C).map(([e, t]) => /* @__PURE__ */ _("option", {
-												value: e,
-												children: t.label
-											}, e))
-										})] }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-											className: "block text-sm font-medium text-text-primary mb-1",
-											children: "Hourly Rate (₹)"
+											children: "Phone"
 										}), /* @__PURE__ */ _("input", {
-											type: "number",
-											value: H.hourlyRate,
+											type: "tel",
+											value: H.phone,
 											onChange: (e) => U((t) => ({
 												...t,
-												hourlyRate: parseInt(e.target.value) || 0
-											})),
-											className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary"
-										})] })]
-									})
-								]
-							}),
-							/* @__PURE__ */ v("div", {
-								className: "flex gap-3 mt-6",
-								children: [/* @__PURE__ */ _("button", {
-									type: "button",
-									onClick: () => L(!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",
-									children: "Cancel"
-								}), /* @__PURE__ */ _("button", {
-									type: "button",
-									onClick: $,
-									className: "flex-1 rounded-md bg-accent px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent/80",
-									children: "Send Invite"
-								})]
-							})
-						]
-					})
-				})
-			}),
-			R && B && /* @__PURE__ */ _("div", {
-				className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4",
-				children: /* @__PURE__ */ _("div", {
-					className: "w-full max-w-lg rounded-lg border border-border-subtle bg-bg-surface shadow-xl",
-					children: /* @__PURE__ */ v("div", {
-						className: "p-6",
-						children: [
-							/* @__PURE__ */ v("div", {
-								className: "flex items-center justify-between mb-4",
-								children: [/* @__PURE__ */ _("h3", {
-									className: "text-lg font-semibold text-text-primary",
-									children: "Edit Staff Member"
-								}), /* @__PURE__ */ _("button", {
-									type: "button",
-									onClick: () => z(!1),
-									className: "rounded p-1.5 text-text-secondary hover:text-text-primary hover:bg-bg-sunken",
-									children: /* @__PURE__ */ _(g, { className: "h-5 w-5" })
-								})]
-							}),
-							/* @__PURE__ */ v("div", {
-								className: "space-y-4",
-								children: [
-									/* @__PURE__ */ v("div", {
-										className: "grid grid-cols-2 gap-4",
-										children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-											className: "block text-sm font-medium text-text-primary mb-1",
-											children: "First Name"
-										}), /* @__PURE__ */ _("input", {
-											type: "text",
-											value: W.firstName,
-											onChange: (e) => G((t) => ({
-												...t,
-												firstName: e.target.value
+												phone: e.target.value
 											})),
 											className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary"
 										})] }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
 											className: "block text-sm font-medium text-text-primary mb-1",
-											children: "Last Name"
-										}), /* @__PURE__ */ _("input", {
-											type: "text",
-											value: W.lastName,
-											onChange: (e) => G((t) => ({
+											children: "Role *"
+										}), /* @__PURE__ */ _("select", {
+											value: H.role,
+											onChange: (e) => U((t) => ({
 												...t,
-												lastName: e.target.value
+												role: e.target.value
 											})),
-											className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary"
+											className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary",
+											children: x.map((e) => /* @__PURE__ */ _("option", {
+												value: e,
+												children: S(e)
+											}, e))
 										})] })]
-									}),
-									/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-										className: "block text-sm font-medium text-text-primary mb-1",
-										children: "Email"
-									}), /* @__PURE__ */ _("input", {
-										type: "email",
-										value: W.email,
-										onChange: (e) => G((t) => ({
-											...t,
-											email: e.target.value
-										})),
-										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary"
-									})] }),
-									/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-										className: "block text-sm font-medium text-text-primary mb-1",
-										children: "Phone"
-									}), /* @__PURE__ */ _("input", {
-										type: "tel",
-										value: W.phone,
-										onChange: (e) => G((t) => ({
-											...t,
-											phone: e.target.value
-										})),
-										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary"
-									})] }),
-									/* @__PURE__ */ v("div", {
-										className: "grid grid-cols-3 gap-4",
-										children: [
-											/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-												className: "block text-sm font-medium text-text-primary mb-1",
-												children: "Role"
-											}), /* @__PURE__ */ _("select", {
-												value: W.role,
-												onChange: (e) => G((t) => ({
-													...t,
-													role: e.target.value
-												})),
-												className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary",
-												children: Object.entries(C).map(([e, t]) => /* @__PURE__ */ _("option", {
-													value: e,
-													children: t.label
-												}, e))
-											})] }),
-											/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-												className: "block text-sm font-medium text-text-primary mb-1",
-												children: "Rate (₹/hr)"
-											}), /* @__PURE__ */ _("input", {
-												type: "number",
-												value: W.hourlyRate,
-												onChange: (e) => G((t) => ({
-													...t,
-													hourlyRate: parseInt(e.target.value) || 0
-												})),
-												className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary"
-											})] }),
-											/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-												className: "block text-sm font-medium text-text-primary mb-1",
-												children: "Status"
-											}), /* @__PURE__ */ _("select", {
-												value: W.status,
-												onChange: (e) => G((t) => ({
-													...t,
-													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",
-												children: Object.entries(S).map(([e, t]) => /* @__PURE__ */ _("option", {
-													value: e,
-													children: t.label
-												}, e))
-											})] })
-										]
 									})
 								]
 							}),
@@ -825,14 +344,39 @@ var x = [
 								className: "flex gap-3 mt-6",
 								children: [/* @__PURE__ */ _("button", {
 									type: "button",
-									onClick: () => z(!1),
+									onClick: () => V(!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",
 									children: "Cancel"
 								}), /* @__PURE__ */ _("button", {
 									type: "button",
-									onClick: te,
-									className: "flex-1 rounded-md bg-accent px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent/80",
-									children: "Save Changes"
+									onClick: () => {
+										if (!H.name.trim() || !H.role) {
+											K("Please provide a name and role", "error");
+											return;
+										}
+										if (!A) {
+											K("No cart found to add staff to", "error");
+											return;
+										}
+										N.mutate({
+											providerId: A,
+											name: H.name.trim(),
+											role: H.role,
+											workerId: H.email.trim() || H.name.trim(),
+											metadata: {
+												email: H.email.trim() || void 0,
+												phone: H.phone.trim() || void 0
+											}
+										}, {
+											onSuccess: () => {
+												V(!1), U(T), K("Staff member added successfully", "success");
+											},
+											onError: () => K("Could not add staff member. Please try again.", "error")
+										});
+									},
+									disabled: N.isPending,
+									className: t("flex-1 rounded-md px-4 py-2 text-sm font-medium transition-colors", N.isPending ? "bg-bg-sunken text-text-secondary cursor-not-allowed" : "bg-accent text-text-primary hover:bg-accent/80"),
+									children: N.isPending ? "Adding..." : "Add Staff"
 								})]
 							})
 						]
@@ -843,6 +387,6 @@ var x = [
 	});
 };
 //#endregion
-export { T as StaffManagementPage };
+export { E as StaffManagementPage };
 
 //# sourceMappingURL=StaffManagementPage.js.map