@corensystem/coren-ui 1.0.0-next.20260924.75108.887a9c2

package/dist/pages/workforce-crews.mjs

@@ -0,0 +1,1091 @@
+import { Badge } from "../badge.mjs";
+import { HoverTooltip } from "../tooltip.mjs";
+import { Button } from "../button.mjs";
+import { Card } from "../card.mjs";
+import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle } from "../dialog.mjs";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../select.mjs";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "../dropdown-menu.mjs";
+import { Input } from "../input.mjs";
+import { DatePicker } from "../date-picker.mjs";
+import { Checkbox } from "../checkbox.mjs";
+import { Avatar, AvatarFallback } from "../avatar.mjs";
+import { ConfirmDialog } from "../confirm-dialog.mjs";
+import { Filter as Filter$1, FilterCategory, FilterContent, FilterOption, FilterTrigger } from "../filter.mjs";
+import { DataTable, DataTableColumnHeader } from "../data-table.mjs";
+import { PushPanel, PushPanelClose, PushPanelContainer, PushPanelHeader, PushPanelHeaderActions, PushPanelHeaderTitle, PushPanelMain, PushPanelProvider, PushPanelTitle } from "../push-panel.mjs";
+import { MetricCard } from "../metric-card.mjs";
+import { Toaster, toast } from "../sonner.mjs";
+import { WorkerProfile } from "../worker-profile.mjs";
+import { AlertTriangle, ArrowLeft, Download, MoreHorizontal, Plus, RotateCcw, SquarePen, Trash2, Users, X } from "lucide-react";
+import { useEffect, useMemo, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region src/pages/workforce-crews.tsx
+function initials(name) {
+	return name.split(/\s+/).filter(Boolean).slice(0, 2).map((part) => part[0]?.toUpperCase() ?? "").join("");
+}
+function dash(value) {
+	return value === null || value === void 0 || value === "" ? /* @__PURE__ */ jsx("span", {
+		className: "wwc:text-muted-foreground",
+		children: "—"
+	}) : value;
+}
+const CREW_MANAGERS = [
+	{
+		name: "Moayad Test",
+		id: "12345666"
+	},
+	{
+		name: "TAYYAB HASNAIN JANJUA",
+		id: "2510300417"
+	},
+	{
+		name: "AHMED AL-RASHID",
+		id: "2481930022"
+	}
+];
+const CREW_TYPES = [
+	"Default resource pool crew type",
+	"PKG4",
+	"Manpower crew",
+	"Direct labour crew"
+];
+const DISCIPLINES = [
+	"MANPOWER",
+	"CIVIL",
+	"MECHANICAL",
+	"ELECTRICAL"
+];
+function member(id, name, code, trade) {
+	return {
+		id,
+		name,
+		code,
+		title: null,
+		trade,
+		effectiveDate: "03 Jan, 2026",
+		shiftType: "day",
+		nationality: "India"
+	};
+}
+const TAMIMI_MEMBERS = [
+	member("cw-1", "MUHAMMAD SALEEM", "2528868132", "Indirect-Driver"),
+	member("cw-2", "TEJ KUMAR PAKHRIN", "2415366026", "Indirect-Driver"),
+	member("cw-3", "SABIN MATHEW", "2617843699", "Indirect-Driver")
+];
+function roster(prefix, count) {
+	const NAMES = [
+		"RAJESH KUMAR",
+		"BIKASH THAPA",
+		"ARUN NAIR",
+		"SANTOSH RANA",
+		"DEEPAK SHARMA",
+		"IMRAN KHAN",
+		"SURESH PATEL",
+		"NABIN GURUNG",
+		"VIJAY SINGH",
+		"MANOJ YADAV",
+		"PRAKASH RAI",
+		"AMIT VERMA",
+		"RAM BAHADUR",
+		"KRISHNA MAGAR"
+	];
+	const TRADES = [
+		"Direct-Helper",
+		"Direct-Scaffolder",
+		"Indirect-Driver",
+		"Direct-Mason",
+		"Direct-Steel Fixer"
+	];
+	return Array.from({ length: count }, (_, i) => member(`${prefix}-${i}`, NAMES[i % NAMES.length], `25${(1e6 + i * 137) % 9999999}`, TRADES[i % TRADES.length]));
+}
+const CREWS = [
+	{
+		id: "c-dsco",
+		name: "DSCO",
+		code: "DSCO",
+		managerName: "Moayad Test",
+		managerId: "12345666",
+		type: "PKG4",
+		discipline: "MANPOWER",
+		createdAt: "08 Sep, 2025",
+		missingInfo: false,
+		members: roster("dsco", 3)
+	},
+	{
+		id: "c-bq",
+		name: "TR-BIN QURAYA",
+		code: "TR-BQ",
+		managerName: "TAYYAB HASNAIN JANJUA",
+		managerId: "2510300417",
+		type: "Default resource pool crew type",
+		discipline: "MANPOWER",
+		createdAt: "12 Oct, 2025",
+		missingInfo: true,
+		members: roster("bq", 5)
+	},
+	{
+		id: "c-actavo",
+		name: "TR-ACTAVO",
+		code: "TR-ACTAVO",
+		managerName: "TAYYAB HASNAIN JANJUA",
+		managerId: "2510300417",
+		type: "Default resource pool crew type",
+		discipline: "MANPOWER",
+		createdAt: "12 Oct, 2025",
+		missingInfo: false,
+		members: roster("actavo", 2)
+	},
+	{
+		id: "c-tawal",
+		name: "TR-TAWAL",
+		code: "TR-TAWAL",
+		managerName: "TAYYAB HASNAIN JANJUA",
+		managerId: "2510300417",
+		type: "Default resource pool crew type",
+		discipline: "MANPOWER",
+		createdAt: "12 Oct, 2025",
+		missingInfo: true,
+		members: roster("tawal", 6)
+	},
+	{
+		id: "c-tamimi",
+		name: "TR-TAMIMI",
+		code: "TR-TAMIMI",
+		managerName: "TAYYAB HASNAIN JANJUA",
+		managerId: "2510300417",
+		type: "Default resource pool crew type",
+		discipline: "MANPOWER",
+		createdAt: "12 Oct, 2025",
+		missingInfo: false,
+		members: TAMIMI_MEMBERS
+	},
+	{
+		id: "c-redcamel",
+		name: "TR-RED CAMEL",
+		code: "TR-RED CAMEL",
+		managerName: "TAYYAB HASNAIN JANJUA",
+		managerId: "2510300417",
+		type: "Default resource pool crew type",
+		discipline: "MANPOWER",
+		createdAt: "12 Oct, 2025",
+		missingInfo: false,
+		members: roster("redcamel", 14)
+	},
+	{
+		id: "c-united",
+		name: "TR-UNITED",
+		code: "TR-UNITED",
+		managerName: "TAYYAB HASNAIN JANJUA",
+		managerId: "2510300417",
+		type: "Default resource pool crew type",
+		discipline: "MANPOWER",
+		createdAt: "12 Oct, 2025",
+		missingInfo: false,
+		members: roster("united", 10)
+	},
+	{
+		id: "c-hurricane",
+		name: "TR-HURRICANE",
+		code: "TR-HURRICANE",
+		managerName: "TAYYAB HASNAIN JANJUA",
+		managerId: "2510300417",
+		type: "Default resource pool crew type",
+		discipline: "MANPOWER",
+		createdAt: "12 Oct, 2025",
+		missingInfo: true,
+		members: roster("hurricane", 4)
+	},
+	{
+		id: "c-falcon",
+		name: "TR-FALCON",
+		code: "TR-FALCON",
+		managerName: "AHMED AL-RASHID",
+		managerId: "2481930022",
+		type: "PKG4",
+		discipline: "CIVIL",
+		createdAt: "20 Nov, 2025",
+		missingInfo: false,
+		members: roster("falcon", 8)
+	},
+	{
+		id: "c-oryx",
+		name: "TR-ORYX",
+		code: "TR-ORYX",
+		managerName: "AHMED AL-RASHID",
+		managerId: "2481930022",
+		type: "Manpower crew",
+		discipline: "MECHANICAL",
+		createdAt: "02 Dec, 2025",
+		missingInfo: false,
+		members: roster("oryx", 7)
+	}
+];
+function crewWorkerGeneral(worker, crew) {
+	return [{
+		id: "identity",
+		fields: [
+			{
+				label: "Worker Code",
+				value: worker.code
+			},
+			{
+				label: "Title",
+				value: dash(worker.title)
+			},
+			{
+				label: "Trade",
+				value: worker.trade
+			},
+			{
+				label: "Nationality",
+				value: dash(worker.nationality)
+			}
+		]
+	}, {
+		id: "assignment",
+		fields: [
+			{
+				label: "Crew",
+				value: crew.name
+			},
+			{
+				label: "Discipline",
+				value: crew.discipline
+			},
+			{
+				label: "Shift Type",
+				value: worker.shiftType
+			},
+			{
+				label: "Effective Date",
+				value: worker.effectiveDate
+			}
+		]
+	}];
+}
+function crewWorkerDevice(worker) {
+	return [
+		{
+			label: "Device ID",
+			value: dash(null)
+		},
+		{
+			label: "Assigned",
+			value: /* @__PURE__ */ jsx(Badge, {
+				variant: "infoSoft",
+				className: "wwc:h-5 wwc:text-xs",
+				children: "Not assigned"
+			})
+		},
+		{
+			label: "Worker Code",
+			value: worker.code
+		}
+	];
+}
+const EMPTY_DRAFT = {
+	name: "",
+	code: "",
+	managerId: "",
+	effectiveDate: void 0,
+	type: "",
+	discipline: ""
+};
+function CrewFormModal({ open, onOpenChange, mode, initial, onSubmit }) {
+	const [draft, setDraft] = useState(initial);
+	const [seed, setSeed] = useState(null);
+	const [attempted, setAttempted] = useState(false);
+	if (open && seed !== initial) {
+		setSeed(initial);
+		setDraft(initial);
+		setAttempted(false);
+	}
+	const set = (key, value) => setDraft((d) => ({
+		...d,
+		[key]: value
+	}));
+	const missing = {
+		name: !draft.name.trim(),
+		code: !draft.code.trim(),
+		managerId: !draft.managerId,
+		effectiveDate: !draft.effectiveDate,
+		type: !draft.type,
+		discipline: !draft.discipline
+	};
+	const valid = !Object.values(missing).some(Boolean);
+	const submit = () => {
+		if (!valid) {
+			setAttempted(true);
+			return;
+		}
+		onSubmit(draft);
+		onOpenChange(false);
+	};
+	const err = (k) => attempted && missing[k];
+	return /* @__PURE__ */ jsx(Dialog, {
+		open,
+		onOpenChange,
+		children: /* @__PURE__ */ jsxs(DialogContent, {
+			className: "wwc:flex wwc:max-h-[92vh] wwc:w-[calc(100vw-2rem)] wwc:max-w-md wwc:flex-col wwc:gap-0 wwc:overflow-hidden wwc:p-0 wwc:[&>button]:hidden",
+			children: [
+				/* @__PURE__ */ jsxs(DialogHeader, { children: [/* @__PURE__ */ jsxs(DialogTitle, { children: [/* @__PURE__ */ jsx(Users, { className: "wwc:h-5 wwc:w-5 wwc:text-primary" }), mode === "add" ? "Add New Crew" : "Edit Crew"] }), /* @__PURE__ */ jsx(Button, {
+					variant: "outline",
+					size: "sm",
+					onClick: () => onOpenChange(false),
+					children: "Hide"
+				})] }),
+				/* @__PURE__ */ jsxs("div", {
+					className: "wwc:min-h-0 wwc:flex-1 wwc:space-y-5 wwc:overflow-y-auto wwc:px-6 wwc:py-5",
+					children: [
+						/* @__PURE__ */ jsx(Field, {
+							label: "Crew Name",
+							required: true,
+							error: err("name"),
+							children: /* @__PURE__ */ jsx(Input, {
+								placeholder: "Enter Crew Name",
+								value: draft.name,
+								"aria-invalid": err("name"),
+								onChange: (e) => set("name", e.target.value)
+							})
+						}),
+						/* @__PURE__ */ jsx(Field, {
+							label: "Crew Code",
+							required: true,
+							error: err("code"),
+							children: /* @__PURE__ */ jsx(Input, {
+								placeholder: "Enter Crew Code",
+								value: draft.code,
+								"aria-invalid": err("code"),
+								onChange: (e) => set("code", e.target.value)
+							})
+						}),
+						/* @__PURE__ */ jsx(Field, {
+							label: "Crew Manager",
+							required: true,
+							error: err("managerId"),
+							children: /* @__PURE__ */ jsxs(Select, {
+								value: draft.managerId,
+								onValueChange: (v) => set("managerId", v),
+								children: [/* @__PURE__ */ jsx(SelectTrigger, {
+									"aria-invalid": err("managerId"),
+									className: "wwc:w-full",
+									children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select Crew Manager" })
+								}), /* @__PURE__ */ jsx(SelectContent, { children: CREW_MANAGERS.map((m) => /* @__PURE__ */ jsxs(SelectItem, {
+									value: m.id,
+									children: [
+										m.name,
+										" · ",
+										m.id
+									]
+								}, m.id)) })]
+							})
+						}),
+						/* @__PURE__ */ jsx(Field, {
+							label: "Effective Date",
+							required: true,
+							error: err("effectiveDate"),
+							children: /* @__PURE__ */ jsx(DatePicker, {
+								date: draft.effectiveDate,
+								onDateChange: (d) => set("effectiveDate", d),
+								placeholder: "Select Effective Date",
+								className: "wwc:w-full"
+							})
+						}),
+						/* @__PURE__ */ jsx(Field, {
+							label: "Crew Type",
+							required: true,
+							error: err("type"),
+							children: /* @__PURE__ */ jsxs(Select, {
+								value: draft.type,
+								onValueChange: (v) => set("type", v),
+								children: [/* @__PURE__ */ jsx(SelectTrigger, {
+									"aria-invalid": err("type"),
+									className: "wwc:w-full",
+									children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select Crew Type" })
+								}), /* @__PURE__ */ jsx(SelectContent, { children: CREW_TYPES.map((t) => /* @__PURE__ */ jsx(SelectItem, {
+									value: t,
+									children: t
+								}, t)) })]
+							})
+						}),
+						/* @__PURE__ */ jsx(Field, {
+							label: "Discipline",
+							required: true,
+							error: err("discipline"),
+							children: /* @__PURE__ */ jsxs(Select, {
+								value: draft.discipline,
+								onValueChange: (v) => set("discipline", v),
+								children: [/* @__PURE__ */ jsx(SelectTrigger, {
+									"aria-invalid": err("discipline"),
+									className: "wwc:w-full",
+									children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select Discipline" })
+								}), /* @__PURE__ */ jsx(SelectContent, { children: DISCIPLINES.map((d) => /* @__PURE__ */ jsx(SelectItem, {
+									value: d,
+									children: d
+								}, d)) })]
+							})
+						})
+					]
+				}),
+				/* @__PURE__ */ jsxs(DialogFooter, { children: [/* @__PURE__ */ jsx(Button, {
+					variant: "outline",
+					className: "wwc:flex-1",
+					onClick: () => setDraft(EMPTY_DRAFT),
+					children: "Clear"
+				}), /* @__PURE__ */ jsx(Button, {
+					className: "wwc:flex-1",
+					onClick: submit,
+					children: "Save"
+				})] })
+			]
+		})
+	});
+}
+function Field({ label, required, error, children }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:space-y-1.5",
+		children: [
+			/* @__PURE__ */ jsxs("label", {
+				className: "wwc:flex wwc:items-center wwc:gap-0.5 wwc:text-sm wwc:font-semibold",
+				children: [label, required ? /* @__PURE__ */ jsx("span", {
+					className: "wwc:text-destructive",
+					children: "*"
+				}) : null]
+			}),
+			children,
+			error ? /* @__PURE__ */ jsxs("p", {
+				className: "wwc:text-xs wwc:text-destructive",
+				children: [label, " is required."]
+			}) : null
+		]
+	});
+}
+function makeCrewColumns(onOpen, onEdit, onDelete) {
+	return [
+		{
+			id: "select",
+			enableSorting: false,
+			enableHiding: false,
+			meta: { cellClassName: "wwc:w-px wwc:pr-0" },
+			header: ({ table }) => /* @__PURE__ */ jsx(Checkbox, {
+				checked: table.getIsAllPageRowsSelected() ? true : table.getIsSomePageRowsSelected() ? "indeterminate" : false,
+				onCheckedChange: (v) => table.toggleAllPageRowsSelected(!!v),
+				"aria-label": "Select all"
+			}),
+			cell: ({ row }) => /* @__PURE__ */ jsx(Checkbox, {
+				checked: row.getIsSelected(),
+				onCheckedChange: (v) => row.toggleSelected(!!v),
+				"aria-label": "Select row"
+			})
+		},
+		{
+			accessorKey: "name",
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Crew Name"
+			}),
+			cell: ({ row }) => /* @__PURE__ */ jsxs("button", {
+				type: "button",
+				onClick: () => onOpen(row.original),
+				className: "wwc:flex wwc:flex-col wwc:text-left",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "wwc:font-medium wwc:underline wwc:underline-offset-2 wwc:transition-colors wwc:hover:text-primary",
+					children: row.original.name
+				}), /* @__PURE__ */ jsx("span", {
+					className: "wwc:text-xs wwc:text-muted-foreground",
+					children: row.original.code
+				})]
+			})
+		},
+		{
+			accessorKey: "managerName",
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Crew Manager"
+			}),
+			meta: { cellClassName: "wwc:whitespace-nowrap" },
+			cell: ({ row }) => /* @__PURE__ */ jsxs("div", {
+				className: "wwc:flex wwc:items-center wwc:gap-2",
+				children: [/* @__PURE__ */ jsx(Avatar, {
+					className: "wwc:h-7 wwc:w-7",
+					children: /* @__PURE__ */ jsx(AvatarFallback, {
+						className: "wwc:text-[10px]",
+						children: initials(row.original.managerName)
+					})
+				}), /* @__PURE__ */ jsxs("div", {
+					className: "wwc:flex wwc:flex-col",
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "wwc:font-medium",
+						children: row.original.managerName
+					}), /* @__PURE__ */ jsx("span", {
+						className: "wwc:text-xs wwc:text-muted-foreground",
+						children: row.original.managerId
+					})]
+				})]
+			})
+		},
+		{
+			accessorKey: "type",
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Crew Type"
+			}),
+			cell: ({ row }) => row.original.type
+		},
+		{
+			accessorKey: "discipline",
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Discipline"
+			}),
+			cell: ({ row }) => row.original.discipline
+		},
+		{
+			id: "members",
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Members"
+			}),
+			cell: ({ row }) => row.original.missingInfo ? /* @__PURE__ */ jsxs("div", {
+				className: "wwc:flex wwc:items-center wwc:gap-2",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "wwc:flex wwc:h-6 wwc:w-6 wwc:items-center wwc:justify-center wwc:rounded wwc:bg-amber-100 wwc:text-amber-600 wwc:dark:bg-amber-500/20",
+					children: /* @__PURE__ */ jsx(AlertTriangle, { className: "wwc:h-3.5 wwc:w-3.5" })
+				}), /* @__PURE__ */ jsxs("div", {
+					className: "wwc:flex wwc:flex-col",
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "wwc:text-sm",
+						children: "Missing Information"
+					}), /* @__PURE__ */ jsxs("button", {
+						type: "button",
+						onClick: () => onOpen(row.original),
+						className: "wwc:flex wwc:items-center wwc:gap-1 wwc:text-xs wwc:text-primary wwc:hover:underline",
+						children: [/* @__PURE__ */ jsx(RotateCcw, { className: "wwc:h-3 wwc:w-3" }), "Resolve"]
+					})]
+				})]
+			}) : /* @__PURE__ */ jsx("span", {
+				className: "wwc:tabular-nums",
+				children: row.original.members.length
+			})
+		},
+		{
+			id: "actions",
+			enableSorting: false,
+			enableHiding: false,
+			meta: { cellClassName: "wwc:w-px wwc:max-w-none wwc:overflow-visible wwc:whitespace-nowrap wwc:text-right" },
+			cell: ({ row }) => /* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
+				asChild: true,
+				children: /* @__PURE__ */ jsx(Button, {
+					variant: "ghost",
+					icon: true,
+					"aria-label": "Row actions",
+					className: "wwc:h-7 wwc:w-7 wwc:text-muted-foreground",
+					children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "wwc:h-4 wwc:w-4" })
+				})
+			}), /* @__PURE__ */ jsxs(DropdownMenuContent, {
+				align: "end",
+				className: "wwc:w-44",
+				children: [
+					/* @__PURE__ */ jsxs(DropdownMenuItem, {
+						onClick: () => onOpen(row.original),
+						children: [/* @__PURE__ */ jsx(Users, { className: "wwc:h-4 wwc:w-4" }), "View crew"]
+					}),
+					/* @__PURE__ */ jsxs(DropdownMenuItem, {
+						onClick: () => onEdit(row.original),
+						children: [/* @__PURE__ */ jsx(SquarePen, { className: "wwc:h-4 wwc:w-4" }), "Edit crew"]
+					}),
+					/* @__PURE__ */ jsxs(DropdownMenuItem, {
+						className: "wwc:text-destructive wwc:focus:text-destructive",
+						onClick: () => onDelete(row.original),
+						children: [/* @__PURE__ */ jsx(Trash2, { className: "wwc:h-4 wwc:w-4" }), "Delete crew"]
+					})
+				]
+			})] })
+		}
+	];
+}
+const uniqueCrewValues = (crews, key) => Array.from(new Set(crews.map((c) => c[key]))).sort();
+function IconAction({ label, icon, onClick }) {
+	return /* @__PURE__ */ jsx(HoverTooltip, {
+		content: label,
+		children: /* @__PURE__ */ jsx(Button, {
+			variant: "outline",
+			icon: true,
+			"aria-label": label,
+			onClick,
+			children: icon
+		})
+	});
+}
+function CrewsList({ crews, onOpen, onAdd, onEdit, onDelete }) {
+	const [filters, setFilters] = useState({});
+	const columns = useMemo(() => makeCrewColumns(onOpen, onEdit, (crew) => onDelete([crew.id])), [
+		onOpen,
+		onEdit,
+		onDelete
+	]);
+	const filtered = useMemo(() => crews.filter((crew) => Object.entries(filters).every(([key, selected]) => {
+		if (!selected || selected.length === 0) return true;
+		return selected.includes(String(crew[key]));
+	})), [crews, filters]);
+	const totalWorkers = useMemo(() => filtered.reduce((sum, c) => sum + c.members.length, 0), [filtered]);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:min-h-0 wwc:flex-1 wwc:overflow-auto wwc:p-6",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "wwc:mb-4 wwc:grid wwc:grid-cols-1 wwc:gap-4 wwc:sm:grid-cols-2",
+			children: [/* @__PURE__ */ jsx(MetricCard, {
+				title: "Total Crews",
+				value: filtered.length
+			}), /* @__PURE__ */ jsx(MetricCard, {
+				title: "Total Workers Assigned to Crews",
+				value: totalWorkers.toLocaleString()
+			})]
+		}), /* @__PURE__ */ jsx(Filter$1, {
+			value: filters,
+			onChange: setFilters,
+			children: /* @__PURE__ */ jsx(DataTable, {
+				columns,
+				data: filtered,
+				searchKey: "name",
+				searchPlaceholder: "Search crews…",
+				showColumnToggle: true,
+				recordLabel: "crew",
+				pageSize: 15,
+				toolbarExtra: /* @__PURE__ */ jsxs(Fragment$1, { children: [
+					/* @__PURE__ */ jsx(FilterTrigger, {}),
+					/* @__PURE__ */ jsxs(FilterContent, { children: [
+						/* @__PURE__ */ jsx(FilterCategory, {
+							value: "type",
+							label: "Crew Type",
+							children: uniqueCrewValues(crews, "type").map((type) => /* @__PURE__ */ jsx(FilterOption, {
+								value: type,
+								children: type
+							}, type))
+						}),
+						/* @__PURE__ */ jsx(FilterCategory, {
+							value: "discipline",
+							label: "Discipline",
+							children: uniqueCrewValues(crews, "discipline").map((discipline) => /* @__PURE__ */ jsx(FilterOption, {
+								value: discipline,
+								children: discipline
+							}, discipline))
+						}),
+						/* @__PURE__ */ jsx(FilterCategory, {
+							value: "managerName",
+							label: "Crew Manager",
+							children: uniqueCrewValues(crews, "managerName").map((manager) => /* @__PURE__ */ jsx(FilterOption, {
+								value: manager,
+								children: manager
+							}, manager))
+						})
+					] }),
+					/* @__PURE__ */ jsx(IconAction, {
+						label: "Export",
+						icon: /* @__PURE__ */ jsx(Download, { className: "wwc:h-4 wwc:w-4" })
+					}),
+					/* @__PURE__ */ jsxs(Button, {
+						onClick: onAdd,
+						children: [/* @__PURE__ */ jsx(Plus, { className: "wwc:h-4 wwc:w-4" }), "Add Crew(s)"]
+					})
+				] }),
+				bulkActions: [{
+					label: "Delete",
+					variant: "destructive",
+					icon: /* @__PURE__ */ jsx(Trash2, { className: "wwc:h-4 wwc:w-4" }),
+					onClick: (selectedIds) => {
+						const ids = selectedIds.map((index) => filtered[Number(index)]?.id).filter((id) => id !== void 0);
+						if (ids.length > 0) onDelete(ids);
+					}
+				}]
+			})
+		})]
+	});
+}
+function makeRosterColumns(onView, onRemove) {
+	return [
+		{
+			id: "select",
+			enableSorting: false,
+			enableHiding: false,
+			meta: { cellClassName: "wwc:w-px wwc:pr-0" },
+			header: ({ table }) => /* @__PURE__ */ jsx(Checkbox, {
+				checked: table.getIsAllPageRowsSelected() ? true : table.getIsSomePageRowsSelected() ? "indeterminate" : false,
+				onCheckedChange: (v) => table.toggleAllPageRowsSelected(!!v),
+				"aria-label": "Select all"
+			}),
+			cell: ({ row }) => /* @__PURE__ */ jsx(Checkbox, {
+				checked: row.getIsSelected(),
+				onCheckedChange: (v) => row.toggleSelected(!!v),
+				"aria-label": "Select row"
+			})
+		},
+		{
+			accessorKey: "name",
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Worker Name"
+			}),
+			meta: { cellClassName: "wwc:whitespace-nowrap" },
+			cell: ({ row }) => /* @__PURE__ */ jsxs("button", {
+				type: "button",
+				onClick: () => onView(row.original),
+				"aria-label": `View ${row.original.name}`,
+				className: "wwc:flex wwc:items-center wwc:gap-2 wwc:text-left",
+				children: [/* @__PURE__ */ jsx(Avatar, {
+					className: "wwc:h-7 wwc:w-7",
+					children: /* @__PURE__ */ jsx(AvatarFallback, {
+						className: "wwc:text-[10px]",
+						children: initials(row.original.name)
+					})
+				}), /* @__PURE__ */ jsxs("div", {
+					className: "wwc:flex wwc:flex-col",
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "wwc:font-medium wwc:underline wwc:underline-offset-2 wwc:transition-colors wwc:hover:text-primary",
+						children: row.original.name
+					}), /* @__PURE__ */ jsx("span", {
+						className: "wwc:text-xs wwc:text-muted-foreground",
+						children: row.original.code
+					})]
+				})]
+			})
+		},
+		{
+			accessorKey: "title",
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Title"
+			}),
+			cell: ({ row }) => dash(row.original.title)
+		},
+		{
+			accessorKey: "trade",
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Trade"
+			}),
+			cell: ({ row }) => row.original.trade
+		},
+		{
+			accessorKey: "effectiveDate",
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Effective Date"
+			}),
+			cell: ({ row }) => row.original.effectiveDate
+		},
+		{
+			accessorKey: "shiftType",
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Shift Type"
+			}),
+			cell: ({ row }) => row.original.shiftType
+		},
+		{
+			id: "actions",
+			enableSorting: false,
+			enableHiding: false,
+			meta: { cellClassName: "wwc:w-px wwc:max-w-none wwc:overflow-visible wwc:whitespace-nowrap wwc:text-right" },
+			cell: ({ row }) => /* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
+				asChild: true,
+				children: /* @__PURE__ */ jsx(Button, {
+					variant: "ghost",
+					icon: true,
+					"aria-label": "Row actions",
+					className: "wwc:h-7 wwc:w-7 wwc:text-muted-foreground",
+					children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "wwc:h-4 wwc:w-4" })
+				})
+			}), /* @__PURE__ */ jsxs(DropdownMenuContent, {
+				align: "end",
+				className: "wwc:w-44",
+				children: [/* @__PURE__ */ jsxs(DropdownMenuItem, {
+					onClick: () => onView(row.original),
+					children: [/* @__PURE__ */ jsx(Users, { className: "wwc:h-4 wwc:w-4" }), "View worker"]
+				}), /* @__PURE__ */ jsxs(DropdownMenuItem, {
+					className: "wwc:text-destructive wwc:focus:text-destructive",
+					onClick: () => onRemove(row.original),
+					children: [/* @__PURE__ */ jsx(Trash2, { className: "wwc:h-4 wwc:w-4" }), "Remove from crew"]
+				})]
+			})] })
+		}
+	];
+}
+function CrewDetail({ crew, onBack, onEdit }) {
+	const [selectedId, setSelectedId] = useState(null);
+	const [members, setMembers] = useState(crew.members);
+	const [seededId, setSeededId] = useState(crew.id);
+	if (seededId !== crew.id) {
+		setSeededId(crew.id);
+		setMembers(crew.members);
+	}
+	const [pendingRemove, setPendingRemove] = useState(null);
+	const columns = useMemo(() => makeRosterColumns((w) => setSelectedId(w.id), (w) => setPendingRemove(w)), []);
+	const selected = members.find((w) => w.id === selectedId) ?? null;
+	return /* @__PURE__ */ jsxs(PushPanelProvider, {
+		open: !!selected,
+		onOpenChange: (open) => !open && setSelectedId(null),
+		side: "right",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "wwc:flex wwc:min-h-0 wwc:flex-1 wwc:flex-col",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "wwc:flex wwc:shrink-0 wwc:items-center wwc:justify-between wwc:gap-4 wwc:border-b wwc:border-border wwc:px-6 wwc:py-3",
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "wwc:flex wwc:items-center wwc:gap-3",
+					children: [
+						/* @__PURE__ */ jsxs(Button, {
+							variant: "ghost",
+							size: "sm",
+							className: "wwc:gap-1.5",
+							onClick: onBack,
+							children: [/* @__PURE__ */ jsx(ArrowLeft, { className: "wwc:h-4 wwc:w-4" }), "Back"]
+						}),
+						/* @__PURE__ */ jsx("div", { className: "wwc:h-5 wwc:w-px wwc:bg-border" }),
+						/* @__PURE__ */ jsx("h1", {
+							className: "wwc:text-lg wwc:font-semibold wwc:tracking-tight",
+							children: crew.name
+						})
+					]
+				}), /* @__PURE__ */ jsxs(Button, {
+					variant: "outline",
+					size: "sm",
+					className: "wwc:gap-1.5",
+					onClick: onEdit,
+					children: [/* @__PURE__ */ jsx(SquarePen, { className: "wwc:h-4 wwc:w-4" }), "Edit"]
+				})]
+			}), /* @__PURE__ */ jsxs(PushPanelContainer, {
+				className: "wwc:min-h-0 wwc:flex-1",
+				children: [/* @__PURE__ */ jsx(PushPanelMain, {
+					className: "wwc:h-full wwc:overflow-auto",
+					children: /* @__PURE__ */ jsxs("div", {
+						className: "wwc:w-full wwc:p-6",
+						children: [/* @__PURE__ */ jsxs("div", {
+							className: "wwc:mb-6 wwc:grid wwc:grid-cols-1 wwc:gap-4 wwc:md:grid-cols-3",
+							children: [
+								/* @__PURE__ */ jsxs(Card, {
+									className: "wwc:p-4",
+									children: [/* @__PURE__ */ jsx("span", {
+										className: "wwc:text-sm wwc:text-muted-foreground",
+										children: "Crew Manager"
+									}), /* @__PURE__ */ jsxs("div", {
+										className: "wwc:mt-2 wwc:flex wwc:items-center wwc:gap-2",
+										children: [/* @__PURE__ */ jsx(Avatar, {
+											className: "wwc:h-8 wwc:w-8",
+											children: /* @__PURE__ */ jsx(AvatarFallback, {
+												className: "wwc:text-[10px]",
+												children: initials(crew.managerName)
+											})
+										}), /* @__PURE__ */ jsxs("div", {
+											className: "wwc:flex wwc:flex-col",
+											children: [/* @__PURE__ */ jsx("span", {
+												className: "wwc:font-medium",
+												children: crew.managerName
+											}), /* @__PURE__ */ jsx("span", {
+												className: "wwc:text-xs wwc:text-muted-foreground",
+												children: crew.managerId
+											})]
+										})]
+									})]
+								}),
+								/* @__PURE__ */ jsxs(Card, {
+									className: "wwc:p-4",
+									children: [/* @__PURE__ */ jsx("span", {
+										className: "wwc:text-sm wwc:text-muted-foreground",
+										children: "Total Workers"
+									}), /* @__PURE__ */ jsx("div", {
+										className: "wwc:mt-2 wwc:text-2xl wwc:font-bold wwc:tabular-nums",
+										children: members.length
+									})]
+								}),
+								/* @__PURE__ */ jsxs(Card, {
+									className: "wwc:p-4",
+									children: [/* @__PURE__ */ jsx("span", {
+										className: "wwc:text-sm wwc:text-muted-foreground",
+										children: "Created at"
+									}), /* @__PURE__ */ jsx("div", {
+										className: "wwc:mt-2 wwc:text-lg wwc:font-semibold",
+										children: crew.createdAt
+									})]
+								})
+							]
+						}), /* @__PURE__ */ jsx(DataTable, {
+							columns,
+							data: members,
+							searchKey: "name",
+							searchPlaceholder: "Search",
+							recordLabel: "worker",
+							pageSize: 15,
+							toolbarExtra: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs(Button, {
+								variant: "outline",
+								children: [/* @__PURE__ */ jsx(Download, { className: "wwc:h-4 wwc:w-4" }), "Export"]
+							}), /* @__PURE__ */ jsxs(Button, {
+								onClick: () => toast.success("Assign workers — pick from the roster"),
+								children: [/* @__PURE__ */ jsx(Plus, { className: "wwc:h-4 wwc:w-4" }), "Assign Worker(s)"]
+							})] })
+						})]
+					})
+				}), /* @__PURE__ */ jsxs(PushPanel, {
+					width: 360,
+					className: "wwc:h-full",
+					children: [/* @__PURE__ */ jsxs(PushPanelHeader, { children: [/* @__PURE__ */ jsxs(PushPanelHeaderTitle, { children: [/* @__PURE__ */ jsx(Avatar, {
+						className: "wwc:h-7 wwc:w-7",
+						children: /* @__PURE__ */ jsx(AvatarFallback, {
+							className: "wwc:text-xs",
+							children: selected ? initials(selected.name) : "?"
+						})
+					}), /* @__PURE__ */ jsx(PushPanelTitle, {
+						className: "wwc:truncate",
+						children: selected?.name ?? "Worker"
+					})] }), /* @__PURE__ */ jsx(PushPanelHeaderActions, { children: /* @__PURE__ */ jsx(PushPanelClose, {
+						asChild: true,
+						children: /* @__PURE__ */ jsx(Button, {
+							variant: "ghost",
+							icon: true,
+							"aria-label": "Close profile",
+							className: "wwc:h-6 wwc:w-6",
+							children: /* @__PURE__ */ jsx(X, { className: "wwc:h-4 wwc:w-4" })
+						})
+					}) })] }), selected && /* @__PURE__ */ jsx(WorkerProfile, {
+						general: crewWorkerGeneral(selected, crew),
+						device: crewWorkerDevice(selected)
+					})]
+				})]
+			})]
+		}), /* @__PURE__ */ jsx(ConfirmDialog, {
+			open: pendingRemove !== null,
+			onOpenChange: (o) => !o && setPendingRemove(null),
+			destructive: true,
+			title: "Remove from crew?",
+			description: /* @__PURE__ */ jsxs(Fragment$1, { children: [
+				/* @__PURE__ */ jsx("span", {
+					className: "wwc:font-medium wwc:text-foreground",
+					children: pendingRemove?.name ?? "This worker"
+				}),
+				" will be removed from ",
+				crew.name,
+				". The worker's own record stays intact."
+			] }),
+			confirmLabel: "Remove",
+			onConfirm: () => {
+				if (!pendingRemove) return;
+				setMembers((prev) => prev.filter((m) => m.id !== pendingRemove.id));
+				toast.success(`${pendingRemove.name} removed from ${crew.name}`);
+				setPendingRemove(null);
+			}
+		})]
+	});
+}
+/** The Crews tab — a crew list that drills into a crew detail page, with an Add/Edit crew modal. */
+function CrewsView() {
+	const [crews, setCrews] = useState(CREWS);
+	const [openCrewId, setOpenCrewId] = useState(null);
+	const [modal, setModal] = useState(null);
+	const [pendingDelete, setPendingDelete] = useState(null);
+	const openCrew = crews.find((c) => c.id === openCrewId) ?? null;
+	const [ownToaster, setOwnToaster] = useState(false);
+	useEffect(() => {
+		const has = document.querySelector("[data-sonner-toaster], section[aria-live][aria-label*=\"Notification\"]");
+		setOwnToaster(!has);
+	}, []);
+	const draftFor = (crewId) => {
+		const crew = crews.find((c) => c.id === crewId);
+		if (!crew) return EMPTY_DRAFT;
+		const mgr = CREW_MANAGERS.find((m) => m.name === crew.managerName);
+		return {
+			name: crew.name,
+			code: crew.code,
+			managerId: mgr?.id ?? "",
+			effectiveDate: void 0,
+			type: crew.type,
+			discipline: crew.discipline
+		};
+	};
+	const submit = (draft) => {
+		const mgr = CREW_MANAGERS.find((m) => m.id === draft.managerId);
+		if (modal?.mode === "edit" && modal.crewId) {
+			setCrews((prev) => prev.map((c) => c.id === modal.crewId ? {
+				...c,
+				name: draft.name,
+				code: draft.code,
+				managerName: mgr?.name ?? c.managerName,
+				managerId: draft.managerId,
+				type: draft.type,
+				discipline: draft.discipline
+			} : c));
+			toast.success(`Crew “${draft.name}” updated`);
+		} else {
+			const id = `c-new-${draft.code || draft.name}`;
+			setCrews((prev) => [{
+				id,
+				name: draft.name,
+				code: draft.code,
+				managerName: mgr?.name ?? "—",
+				managerId: draft.managerId,
+				type: draft.type,
+				discipline: draft.discipline,
+				createdAt: "26 Jul, 2026",
+				missingInfo: false,
+				members: []
+			}, ...prev]);
+			toast.success(`Crew “${draft.name}” created`);
+		}
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:flex wwc:min-h-0 wwc:flex-1 wwc:flex-col",
+		children: [
+			openCrew ? /* @__PURE__ */ jsx(CrewDetail, {
+				crew: openCrew,
+				onBack: () => setOpenCrewId(null),
+				onEdit: () => setModal({
+					mode: "edit",
+					crewId: openCrew.id
+				})
+			}) : /* @__PURE__ */ jsx(CrewsList, {
+				crews,
+				onOpen: (crew) => setOpenCrewId(crew.id),
+				onAdd: () => setModal({
+					mode: "add",
+					crewId: null
+				}),
+				onEdit: (crew) => setModal({
+					mode: "edit",
+					crewId: crew.id
+				}),
+				onDelete: (ids) => setPendingDelete(ids)
+			}),
+			/* @__PURE__ */ jsx(CrewFormModal, {
+				open: modal !== null,
+				onOpenChange: (o) => !o && setModal(null),
+				mode: modal?.mode ?? "add",
+				initial: modal ? draftFor(modal.crewId) : EMPTY_DRAFT,
+				onSubmit: submit
+			}),
+			/* @__PURE__ */ jsx(ConfirmDialog, {
+				open: pendingDelete !== null,
+				onOpenChange: (o) => !o && setPendingDelete(null),
+				destructive: true,
+				title: pendingDelete && pendingDelete.length > 1 ? "Delete crews?" : "Delete crew?",
+				description: pendingDelete ? pendingDelete.length > 1 ? /* @__PURE__ */ jsxs(Fragment$1, { children: [pendingDelete.length, " crews will be permanently deleted. Their worker assignments are released. This can't be undone."] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
+					/* @__PURE__ */ jsx("span", {
+						className: "wwc:font-medium wwc:text-foreground",
+						children: crews.find((c) => c.id === pendingDelete[0])?.name ?? "This crew"
+					}),
+					" ",
+					"will be permanently deleted. Its worker assignments are released. This can't be undone."
+				] }) : null,
+				confirmLabel: "Delete",
+				onConfirm: () => {
+					if (!pendingDelete) return;
+					const set = new Set(pendingDelete);
+					setCrews((prev) => prev.filter((c) => !set.has(c.id)));
+					toast.success(pendingDelete.length > 1 ? `${pendingDelete.length} crews deleted` : "Crew deleted");
+					setPendingDelete(null);
+				}
+			}),
+			ownToaster ? /* @__PURE__ */ jsx(Toaster, { position: "top-right" }) : null
+		]
+	});
+}
+//#endregion
+export { CrewsView };
+
+//# sourceMappingURL=workforce-crews.mjs.map