@burdenoff/microfe-theglobalfuel 2026.704.1 → 2026.705.2

package/dist/theglobalfuel/pages/shipments/ShipmentsPage.js

@@ -1,21 +1,25 @@
 import { PageLayout as e } from "../../components/PageLayout.js";
 import { MetricsCard as t } from "../../components/MetricsCard.js";
-import { formatDate as n, formatEnumLabel as r, formatVolume as ee } from "../../utils/formatters.js";
+import { formatDate as n, formatEnumLabel as r, formatVolume as i, toBackendDate as ee } from "../../utils/formatters.js";
 import { StatusBadge as te } from "../../components/StatusBadge.js";
 import { DataTable as ne } from "../../components/DataTable.js";
-import { ErrorView as i, LoadingView as a } from "../../components/StateViews.js";
-import { EmptyState as o } from "../../components/EmptyState.js";
-import { useTheContracts as s, useTheDeliverShipment as c, useTheScheduleShipment as l, useTheShipments as u } from "../../hooks/useTheGlobalFuelApi.js";
+import { ErrorView as re, LoadingView as ie } from "../../components/StateViews.js";
+import { EmptyState as ae } from "../../components/EmptyState.js";
+import { useTheContracts as oe, useTheDeliverShipment as se, useTheScheduleShipment as ce, useTheShipments as a, useTheTransitionShipment as le } from "../../hooks/useTheGlobalFuelApi.js";
+import { useCursorPager as o } from "../../hooks/useCursorPager.js";
+import { useNotify as ue } from "../../hooks/useNotify.js";
 import "../../hooks/index.js";
-import { FilterTabs as re } from "../../components/FilterTabs.js";
-import { EvidenceUpload as ie } from "../../components/EvidenceUpload.js";
-import { FileLink as ae } from "../../components/FileLink.js";
-import { useMemo as d, useState as f } from "react";
-import { ArrowRight as oe, CalendarClock as p, PackageCheck as m, Plus as h, Ship as g, Truck as _ } from "lucide-react";
-import { jsx as v, jsxs as y } from "react/jsx-runtime";
-import { Button as b, Input as x, Label as S, ResponsiveDialog as se, ResponsiveDialogContent as ce, ResponsiveDialogDescription as le, ResponsiveDialogFooter as ue, ResponsiveDialogHeader as de, ResponsiveDialogTitle as fe, Select as C, SelectContent as w, SelectItem as T, SelectTrigger as E, SelectValue as D, Textarea as pe } from "@burdenoff/fe-libs/ui";
+import { SHIPMENT_DELIVERABLE_FROM as de, SHIPMENT_TRANSITIONS as fe, nextStatuses as pe } from "../../utils/transitions.js";
+import { FilterTabs as me } from "../../components/FilterTabs.js";
+import { Pagination as s } from "../../components/Pagination.js";
+import { EvidenceUpload as he } from "../../components/EvidenceUpload.js";
+import { FileLink as ge } from "../../components/FileLink.js";
+import { useMemo as c, useState as l } from "react";
+import { ArrowRight as _e, CalendarClock as ve, PackageCheck as u, Plus as d, Ship as f, Truck as ye } from "lucide-react";
+import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
+import { Button as g, Input as _, Label as v, ResponsiveDialog as be, ResponsiveDialogContent as xe, ResponsiveDialogDescription as Se, ResponsiveDialogFooter as Ce, ResponsiveDialogHeader as we, ResponsiveDialogTitle as Te, Select as y, SelectContent as b, SelectItem as x, SelectTrigger as S, SelectValue as C, Textarea as w } from "@burdenoff/fe-libs/ui";
 //#region src/theglobalfuel/pages/shipments/ShipmentsPage.tsx
-var me = [
+var T = [
 	{
 		value: "ALL",
 		label: "All"
@@ -40,14 +44,14 @@ var me = [
 		value: "CANCELLED",
 		label: "Cancelled"
 	}
-], he = [
+], E = [
 	"PIPELINE",
 	"TANKER",
 	"VESSEL_BULK",
 	"RAIL",
 	"TRUCK",
 	"GRID"
-], O = [
+], D = [
 	"BARRELS",
 	"CUBIC_METERS",
 	"TONNES",
@@ -55,7 +59,7 @@ var me = [
 	"MWH",
 	"GJ",
 	"MCF"
-], k = {
+], O = 25, k = {
 	contractId: "",
 	reference: "",
 	mode: "TANKER",
@@ -68,62 +72,65 @@ var me = [
 	notes: ""
 };
 function A() {
-	let [A, j] = f("ALL"), [M, N] = f("ALL"), [P, F] = f(!1), [I, L] = f(k), [R, z] = f(null), [B, V] = f(null), H = M === "ALL" ? void 0 : M, { data: U, isLoading: ge, isError: _e, refetch: ve } = u(H, A === "ALL" ? void 0 : A), W = u(H, void 0), G = s({ pagination: { limit: 100 } }), K = d(() => G.data?.items ?? [], [G.data]), q = d(() => {
+	let [A, Ee] = l("ALL"), [j, De] = l("ALL"), M = o(), [Oe, N] = l(!1), [P, F] = l(k), [I, L] = l(null), [R, z] = l(null), [ke, B] = l(null), V = ue(), H = j === "ALL" ? void 0 : j, { data: U, isLoading: Ae, isError: je, refetch: Me } = a(H, A === "ALL" ? void 0 : A, {
+		limit: O,
+		cursor: M.cursor
+	}), W = a(H, void 0, { limit: 200 }), G = oe({ pagination: { limit: 100 } }), K = c(() => G.data?.items ?? [], [G.data]), q = c(() => {
 		let e = /* @__PURE__ */ new Map();
 		for (let t of K) e.set(t.id, t);
 		return e;
-	}, [K]), J = l(), Y = c(), X = d(() => U ?? [], [U]), Z = d(() => W.data ?? [], [W.data]), ye = Z.filter((e) => e.status === "SCHEDULED").length, be = Z.filter((e) => e.status === "IN_TRANSIT").length, xe = Z.filter((e) => e.status === "DELIVERED").length, Se = d(() => {
+	}, [K]), J = ce(), Y = se(), Ne = le(), X = c(() => U?.items ?? [], [U]), Z = c(() => W.data?.items ?? [], [W.data]), Pe = Z.filter((e) => e.status === "SCHEDULED").length, Fe = Z.filter((e) => e.status === "IN_TRANSIT").length, Ie = Z.filter((e) => e.status === "DELIVERED").length, Le = c(() => {
 		let e = {};
 		for (let t of Z) e[t.status] = (e[t.status] ?? 0) + 1;
 		return e;
-	}, [Z]), Ce = me.map((e) => ({
+	}, [Z]), Re = T.map((e) => ({
 		value: e.value,
 		label: e.label,
-		count: e.value === "ALL" ? Z.length : Se[e.value] ?? 0
+		count: e.value === "ALL" ? Z.length : Le[e.value] ?? 0
 	})), Q = () => {
-		L(k), z(null), V(null);
-	}, we = async () => {
-		if (!I.contractId) {
-			V("Select the contract this shipment fulfils.");
+		F(k), L(null), z(null);
+	}, ze = async () => {
+		if (!P.contractId) {
+			z("Select the contract this shipment fulfils.");
 			return;
 		}
-		if (!I.reference.trim()) {
-			V("A shipment reference is required.");
+		if (!P.reference.trim()) {
+			z("A shipment reference is required.");
 			return;
 		}
-		let e = Number(I.volume);
-		if (!I.volume || Number.isNaN(e) || e <= 0) {
-			V("Enter a volume greater than zero.");
+		let e = Number(P.volume);
+		if (!P.volume || Number.isNaN(e) || e <= 0) {
+			z("Enter a volume greater than zero."), V.error("Enter a volume greater than zero.");
 			return;
 		}
-		V(null);
+		z(null);
 		try {
 			await J.mutateAsync({
-				contractId: I.contractId,
-				reference: I.reference.trim(),
-				mode: I.mode,
-				carrier: I.carrier.trim() || null,
-				origin: I.origin.trim() || null,
-				destination: I.destination.trim() || null,
+				contractId: P.contractId,
+				reference: P.reference.trim(),
+				mode: P.mode,
+				carrier: P.carrier.trim() || null,
+				origin: P.origin.trim() || null,
+				destination: P.destination.trim() || null,
 				volume: e,
-				unit: I.unit,
-				scheduledAt: I.scheduledAt ? new Date(I.scheduledAt).toISOString() : null,
-				documentFileId: R?.fileId ?? null,
-				notes: I.notes.trim() || null
-			}), F(!1), Q();
+				unit: P.unit,
+				scheduledAt: ee(P.scheduledAt) ?? null,
+				documentFileId: I?.fileId ?? null,
+				notes: P.notes.trim() || null
+			}), V.success("Shipment scheduled"), N(!1), Q();
 		} catch (e) {
-			V(e instanceof Error ? e.message : "Failed to schedule shipment.");
+			z(e instanceof Error ? e.message : "Failed to schedule shipment."), V.fromError(e);
 		}
-	}, Te = [
+	}, Be = [
 		{
 			key: "reference",
 			header: "Shipment",
-			render: (e) => /* @__PURE__ */ y("div", {
+			render: (e) => /* @__PURE__ */ h("div", {
 				className: "min-w-0",
-				children: [/* @__PURE__ */ v("p", {
+				children: [/* @__PURE__ */ m("p", {
 					className: "truncate font-semibold text-text-primary",
 					children: e.reference
-				}), /* @__PURE__ */ v("p", {
+				}), /* @__PURE__ */ m("p", {
 					className: "truncate text-xs text-text-tertiary md:hidden",
 					children: r(e.mode)
 				})]
@@ -135,16 +142,16 @@ function A() {
 			hideOnMobile: !0,
 			render: (e) => {
 				let t = q.get(e.contractId);
-				return t ? /* @__PURE__ */ y("div", {
+				return t ? /* @__PURE__ */ h("div", {
 					className: "min-w-0",
-					children: [/* @__PURE__ */ v("p", {
+					children: [/* @__PURE__ */ m("p", {
 						className: "truncate font-medium text-text-primary",
 						children: t.reference
-					}), /* @__PURE__ */ v("p", {
+					}), /* @__PURE__ */ m("p", {
 						className: "truncate text-xs text-text-tertiary",
 						children: t.counterparty
 					})]
-				}) : /* @__PURE__ */ v("span", {
+				}) : /* @__PURE__ */ m("span", {
 					className: "font-mono text-xs text-text-tertiary",
 					children: e.contractId.slice(0, 8)
 				});
@@ -154,7 +161,7 @@ function A() {
 			key: "mode",
 			header: "Mode",
 			hideOnMobile: !0,
-			render: (e) => /* @__PURE__ */ v("span", {
+			render: (e) => /* @__PURE__ */ m("span", {
 				className: "text-text-secondary",
 				children: r(e.mode)
 			})
@@ -162,7 +169,7 @@ function A() {
 		{
 			key: "status",
 			header: "Status",
-			render: (e) => /* @__PURE__ */ v(te, { status: e.status })
+			render: (e) => /* @__PURE__ */ m(te, { status: e.status })
 		},
 		{
 			key: "route",
@@ -170,18 +177,18 @@ function A() {
 			hideOnMobile: !0,
 			render: (e) => {
 				let t = e.origin?.trim(), n = e.destination?.trim();
-				return !t && !n ? /* @__PURE__ */ v("span", {
+				return !t && !n ? /* @__PURE__ */ m("span", {
 					className: "text-text-tertiary",
 					children: "—"
-				}) : /* @__PURE__ */ y("span", {
+				}) : /* @__PURE__ */ h("span", {
 					className: "inline-flex items-center gap-1.5 text-text-secondary",
 					children: [
-						/* @__PURE__ */ v("span", {
+						/* @__PURE__ */ m("span", {
 							className: "truncate",
 							children: t ?? "—"
 						}),
-						/* @__PURE__ */ v(oe, { className: "h-3.5 w-3.5 shrink-0 text-text-tertiary" }),
-						/* @__PURE__ */ v("span", {
+						/* @__PURE__ */ m(_e, { className: "h-3.5 w-3.5 shrink-0 text-text-tertiary" }),
+						/* @__PURE__ */ m("span", {
 							className: "truncate",
 							children: n ?? "—"
 						})
@@ -194,9 +201,9 @@ function A() {
 			header: "Volume",
 			align: "right",
 			sortValue: (e) => e.volume,
-			render: (e) => /* @__PURE__ */ v("span", {
+			render: (e) => /* @__PURE__ */ m("span", {
 				className: "tabular-nums text-text-primary",
-				children: ee(e.volume, e.unit)
+				children: i(e.volume, e.unit)
 			})
 		},
 		{
@@ -205,7 +212,7 @@ function A() {
 			align: "right",
 			hideOnMobile: !0,
 			sortValue: (e) => e.scheduledAt ?? "",
-			render: (e) => /* @__PURE__ */ v("span", {
+			render: (e) => /* @__PURE__ */ m("span", {
 				className: "text-text-tertiary",
 				children: n(e.scheduledAt)
 			})
@@ -214,7 +221,7 @@ function A() {
 			key: "document",
 			header: "Document",
 			hideOnMobile: !0,
-			render: (e) => e.document?.id ? /* @__PURE__ */ v(ae, { fileId: e.document.id }) : /* @__PURE__ */ v("span", {
+			render: (e) => e.document?.id ? /* @__PURE__ */ m(ge, { fileId: e.document.id }) : /* @__PURE__ */ m("span", {
 				className: "text-text-tertiary",
 				children: "—"
 			})
@@ -223,70 +230,105 @@ function A() {
 			key: "action",
 			header: "",
 			align: "right",
-			render: (e) => e.status === "DELIVERED" || e.status === "CANCELLED" ? /* @__PURE__ */ v("span", {
-				className: "text-text-tertiary",
-				children: "—"
-			}) : /* @__PURE__ */ y(b, {
-				size: "sm",
-				variant: "outline",
-				disabled: Y.isPending,
-				onClick: () => Y.mutate(e.id),
-				children: [/* @__PURE__ */ v(m, { className: "mr-1.5 h-4 w-4" }), " Mark delivered"]
-			})
+			render: (e) => {
+				let t = pe(fe, e.status), n = de.includes(e.status), i = ke === e.id;
+				return t.length === 0 && !n ? /* @__PURE__ */ m("span", {
+					className: "text-text-tertiary",
+					children: "—"
+				}) : /* @__PURE__ */ h("div", {
+					className: "flex items-center justify-end gap-2",
+					children: [t.length > 0 && /* @__PURE__ */ h(y, {
+						value: e.status,
+						disabled: i,
+						onValueChange: (t) => {
+							t !== e.status && (B(e.id), Ne.mutate({
+								id: e.id,
+								status: t
+							}, {
+								onSuccess: () => V.success("Shipment updated"),
+								onError: (e) => V.fromError(e),
+								onSettled: () => B(null)
+							}));
+						},
+						children: [/* @__PURE__ */ m(S, {
+							className: "h-8 w-36",
+							"aria-label": `Change status for shipment ${e.reference}`,
+							children: /* @__PURE__ */ m(C, { placeholder: r(e.status) })
+						}), /* @__PURE__ */ m(b, { children: t.map((e) => /* @__PURE__ */ m(x, {
+							value: e,
+							children: r(e)
+						}, e)) })]
+					}), n && /* @__PURE__ */ h(g, {
+						size: "sm",
+						variant: "outline",
+						disabled: Y.isPending || i,
+						onClick: () => Y.mutate(e.id, {
+							onSuccess: () => V.success("Shipment delivered"),
+							onError: (e) => V.fromError(e)
+						}),
+						children: [/* @__PURE__ */ m(u, { className: "mr-1.5 h-4 w-4" }), " Mark delivered"]
+					})]
+				});
+			}
 		}
-	], $ = A !== "ALL" || M !== "ALL";
-	return /* @__PURE__ */ y(e, {
+	], $ = A !== "ALL" || j !== "ALL";
+	return /* @__PURE__ */ h(e, {
 		title: "Shipments",
 		description: "Cargo movements delivering offtake contracts — pipelines, tankers, vessels, rail & grid.",
-		actions: /* @__PURE__ */ y(b, {
-			onClick: () => F(!0),
-			children: [/* @__PURE__ */ v(h, { className: "mr-1.5 h-4 w-4" }), " Schedule shipment"]
+		actions: /* @__PURE__ */ h(g, {
+			onClick: () => N(!0),
+			children: [/* @__PURE__ */ m(d, { className: "mr-1.5 h-4 w-4" }), " Schedule shipment"]
 		}),
 		children: [
-			/* @__PURE__ */ y("div", {
+			/* @__PURE__ */ h("div", {
 				className: "mb-6 grid grid-cols-2 gap-4 lg:grid-cols-4",
 				children: [
-					/* @__PURE__ */ v(t, {
+					/* @__PURE__ */ m(t, {
 						featured: !0,
-						icon: /* @__PURE__ */ v(g, { className: "h-5 w-5" }),
+						icon: /* @__PURE__ */ m(f, { className: "h-5 w-5" }),
 						value: Z.length,
 						label: "Total shipments"
 					}),
-					/* @__PURE__ */ v(t, {
-						icon: /* @__PURE__ */ v(p, { className: "h-5 w-5" }),
-						value: ye,
+					/* @__PURE__ */ m(t, {
+						icon: /* @__PURE__ */ m(ve, { className: "h-5 w-5" }),
+						value: Pe,
 						label: "Scheduled"
 					}),
-					/* @__PURE__ */ v(t, {
+					/* @__PURE__ */ m(t, {
 						accent: "warning",
-						icon: /* @__PURE__ */ v(_, { className: "h-5 w-5" }),
-						value: be,
+						icon: /* @__PURE__ */ m(ye, { className: "h-5 w-5" }),
+						value: Fe,
 						label: "In transit"
 					}),
-					/* @__PURE__ */ v(t, {
+					/* @__PURE__ */ m(t, {
 						accent: "success",
-						icon: /* @__PURE__ */ v(m, { className: "h-5 w-5" }),
-						value: xe,
+						icon: /* @__PURE__ */ m(u, { className: "h-5 w-5" }),
+						value: Ie,
 						label: "Delivered"
 					})
 				]
 			}),
-			/* @__PURE__ */ y("div", {
+			/* @__PURE__ */ h("div", {
 				className: "mb-5 flex flex-wrap items-center gap-3",
-				children: [/* @__PURE__ */ v(re, {
-					options: Ce,
+				children: [/* @__PURE__ */ m(me, {
+					options: Re,
 					value: A,
-					onChange: j
-				}), /* @__PURE__ */ y(C, {
-					value: M,
-					onValueChange: (e) => N(e),
-					children: [/* @__PURE__ */ v(E, {
+					onChange: (e) => {
+						Ee(e), M.reset();
+					}
+				}), /* @__PURE__ */ h(y, {
+					value: j,
+					onValueChange: (e) => {
+						De(e), M.reset();
+					},
+					children: [/* @__PURE__ */ m(S, {
 						className: "w-56",
-						children: /* @__PURE__ */ v(D, { placeholder: "All contracts" })
-					}), /* @__PURE__ */ y(w, { children: [/* @__PURE__ */ v(T, {
+						"aria-label": "Filter by contract",
+						children: /* @__PURE__ */ m(C, { placeholder: "All contracts" })
+					}), /* @__PURE__ */ h(b, { children: [/* @__PURE__ */ m(x, {
 						value: "ALL",
 						children: "All contracts"
-					}), K.map((e) => /* @__PURE__ */ y(T, {
+					}), K.map((e) => /* @__PURE__ */ h(x, {
 						value: e.id,
 						children: [
 							e.reference,
@@ -296,60 +338,68 @@ function A() {
 					}, e.id))] })]
 				})]
 			}),
-			ge ? /* @__PURE__ */ v(a, { label: "Loading shipments…" }) : _e ? /* @__PURE__ */ v(i, {
+			Ae ? /* @__PURE__ */ m(ie, { label: "Loading shipments…" }) : je ? /* @__PURE__ */ m(re, {
 				message: "Couldn't load shipments.",
-				onRetry: () => ve()
-			}) : X.length === 0 ? /* @__PURE__ */ v(o, {
+				onRetry: () => Me()
+			}) : X.length === 0 ? /* @__PURE__ */ m(ae, {
 				illustration: "empty-data",
-				icon: /* @__PURE__ */ v(g, { className: "h-10 w-10" }),
+				icon: /* @__PURE__ */ m(f, { className: "h-10 w-10" }),
 				title: $ ? "No matching shipments" : "No shipments yet",
 				description: $ ? "No shipments match these filters. Try a different status or contract." : "Schedule your first shipment to start tracking cargo against your offtake contracts.",
-				action: /* @__PURE__ */ y(b, {
-					onClick: () => F(!0),
-					children: [/* @__PURE__ */ v(h, { className: "mr-1.5 h-4 w-4" }), " Schedule shipment"]
+				action: /* @__PURE__ */ h(g, {
+					onClick: () => N(!0),
+					children: [/* @__PURE__ */ m(d, { className: "mr-1.5 h-4 w-4" }), " Schedule shipment"]
 				})
-			}) : /* @__PURE__ */ v(ne, {
-				columns: Te,
+			}) : /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(ne, {
+				columns: Be,
 				rows: X,
 				rowKey: (e) => e.id,
 				defaultSort: {
 					key: "scheduledAt",
 					dir: "desc"
 				}
-			}),
-			/* @__PURE__ */ v(se, {
-				open: P,
+			}), /* @__PURE__ */ m(s, {
+				page: M.page,
+				pageSize: O,
+				itemCount: X.length,
+				hasMore: U?.pageInfo?.hasMore ?? !1,
+				onPageChange: (e) => M.onPageChange(e, U?.pageInfo?.cursor)
+			})] }),
+			/* @__PURE__ */ m(be, {
+				open: Oe,
 				onOpenChange: (e) => {
-					F(e), e || Q();
+					N(e), e || Q();
 				},
-				children: /* @__PURE__ */ y(ce, { children: [
-					/* @__PURE__ */ y(de, { children: [/* @__PURE__ */ v(fe, { children: "Schedule shipment" }), /* @__PURE__ */ v(le, { children: "Book a cargo movement against an offtake contract and track it to delivery." })] }),
-					/* @__PURE__ */ y("div", {
+				children: /* @__PURE__ */ h(xe, { children: [/* @__PURE__ */ h(we, { children: [/* @__PURE__ */ m(Te, { children: "Schedule shipment" }), /* @__PURE__ */ m(Se, { children: "Book a cargo movement against an offtake contract and track it to delivery." })] }), /* @__PURE__ */ h("form", {
+					onSubmit: (e) => {
+						e.preventDefault(), ze();
+					},
+					children: [/* @__PURE__ */ h("div", {
 						className: "grid gap-4 py-2",
 						children: [
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ h("div", {
 								className: "grid gap-1.5",
-								children: [/* @__PURE__ */ v(S, {
+								children: [/* @__PURE__ */ m(v, {
 									htmlFor: "shipContract",
 									children: "Contract *"
-								}), /* @__PURE__ */ y(C, {
-									value: I.contractId,
+								}), /* @__PURE__ */ h(y, {
+									value: P.contractId,
 									onValueChange: (e) => {
 										let t = q.get(e);
-										L((n) => ({
+										F((n) => ({
 											...n,
 											contractId: e,
 											unit: t?.unit ?? n.unit
 										}));
 									},
-									children: [/* @__PURE__ */ v(E, {
+									children: [/* @__PURE__ */ m(S, {
 										id: "shipContract",
-										children: /* @__PURE__ */ v(D, { placeholder: "Select a contract" })
-									}), /* @__PURE__ */ v(w, { children: K.length === 0 ? /* @__PURE__ */ v(T, {
+										children: /* @__PURE__ */ m(C, { placeholder: "Select a contract" })
+									}), /* @__PURE__ */ m(b, { children: K.length === 0 ? /* @__PURE__ */ m(x, {
 										value: "none",
 										disabled: !0,
 										children: "No contracts available"
-									}) : K.map((e) => /* @__PURE__ */ y(T, {
+									}) : K.map((e) => /* @__PURE__ */ h(x, {
 										value: e.id,
 										children: [
 											e.reference,
@@ -359,187 +409,189 @@ function A() {
 									}, e.id)) })]
 								})]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ h("div", {
 								className: "grid gap-2 sm:grid-cols-2",
-								children: [/* @__PURE__ */ y("div", {
+								children: [/* @__PURE__ */ h("div", {
 									className: "grid gap-1.5",
-									children: [/* @__PURE__ */ v(S, {
+									children: [/* @__PURE__ */ m(v, {
 										htmlFor: "shipRef",
 										children: "Reference *"
-									}), /* @__PURE__ */ v(x, {
+									}), /* @__PURE__ */ m(_, {
 										id: "shipRef",
-										value: I.reference,
-										onChange: (e) => L({
-											...I,
+										value: P.reference,
+										onChange: (e) => F({
+											...P,
 											reference: e.target.value
 										}),
 										placeholder: "SHP-2026-0142"
 									})]
-								}), /* @__PURE__ */ y("div", {
+								}), /* @__PURE__ */ h("div", {
 									className: "grid gap-1.5",
-									children: [/* @__PURE__ */ v(S, {
+									children: [/* @__PURE__ */ m(v, {
 										htmlFor: "shipMode",
 										children: "Mode"
-									}), /* @__PURE__ */ y(C, {
-										value: I.mode,
-										onValueChange: (e) => L({
-											...I,
+									}), /* @__PURE__ */ h(y, {
+										value: P.mode,
+										onValueChange: (e) => F({
+											...P,
 											mode: e
 										}),
-										children: [/* @__PURE__ */ v(E, {
+										children: [/* @__PURE__ */ m(S, {
 											id: "shipMode",
-											children: /* @__PURE__ */ v(D, {})
-										}), /* @__PURE__ */ v(w, { children: he.map((e) => /* @__PURE__ */ v(T, {
+											children: /* @__PURE__ */ m(C, {})
+										}), /* @__PURE__ */ m(b, { children: E.map((e) => /* @__PURE__ */ m(x, {
 											value: e,
 											children: r(e)
 										}, e)) })]
 									})]
 								})]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ h("div", {
 								className: "grid gap-2 sm:grid-cols-2",
-								children: [/* @__PURE__ */ y("div", {
+								children: [/* @__PURE__ */ h("div", {
 									className: "grid gap-1.5",
-									children: [/* @__PURE__ */ v(S, {
+									children: [/* @__PURE__ */ m(v, {
 										htmlFor: "shipOrigin",
 										children: "Origin"
-									}), /* @__PURE__ */ v(x, {
+									}), /* @__PURE__ */ m(_, {
 										id: "shipOrigin",
-										value: I.origin,
-										onChange: (e) => L({
-											...I,
+										value: P.origin,
+										onChange: (e) => F({
+											...P,
 											origin: e.target.value
 										}),
 										placeholder: "Ras Tanura Terminal"
 									})]
-								}), /* @__PURE__ */ y("div", {
+								}), /* @__PURE__ */ h("div", {
 									className: "grid gap-1.5",
-									children: [/* @__PURE__ */ v(S, {
+									children: [/* @__PURE__ */ m(v, {
 										htmlFor: "shipDest",
 										children: "Destination"
-									}), /* @__PURE__ */ v(x, {
+									}), /* @__PURE__ */ m(_, {
 										id: "shipDest",
-										value: I.destination,
-										onChange: (e) => L({
-											...I,
+										value: P.destination,
+										onChange: (e) => F({
+											...P,
 											destination: e.target.value
 										}),
 										placeholder: "Rotterdam"
 									})]
 								})]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ h("div", {
 								className: "grid gap-2 sm:grid-cols-3",
 								children: [
-									/* @__PURE__ */ y("div", {
+									/* @__PURE__ */ h("div", {
 										className: "grid gap-1.5",
-										children: [/* @__PURE__ */ v(S, {
+										children: [/* @__PURE__ */ m(v, {
 											htmlFor: "shipVolume",
 											children: "Volume *"
-										}), /* @__PURE__ */ v(x, {
+										}), /* @__PURE__ */ m(_, {
 											id: "shipVolume",
 											type: "number",
 											min: "0",
 											step: "any",
-											value: I.volume,
-											onChange: (e) => L({
-												...I,
+											value: P.volume,
+											onChange: (e) => F({
+												...P,
 												volume: e.target.value
 											}),
 											placeholder: "500000"
 										})]
 									}),
-									/* @__PURE__ */ y("div", {
+									/* @__PURE__ */ h("div", {
 										className: "grid gap-1.5",
-										children: [/* @__PURE__ */ v(S, {
+										children: [/* @__PURE__ */ m(v, {
 											htmlFor: "shipUnit",
 											children: "Unit"
-										}), /* @__PURE__ */ y(C, {
-											value: I.unit,
-											onValueChange: (e) => L({
-												...I,
+										}), /* @__PURE__ */ h(y, {
+											value: P.unit,
+											onValueChange: (e) => F({
+												...P,
 												unit: e
 											}),
-											children: [/* @__PURE__ */ v(E, {
+											children: [/* @__PURE__ */ m(S, {
 												id: "shipUnit",
-												children: /* @__PURE__ */ v(D, {})
-											}), /* @__PURE__ */ v(w, { children: O.map((e) => /* @__PURE__ */ v(T, {
+												children: /* @__PURE__ */ m(C, {})
+											}), /* @__PURE__ */ m(b, { children: D.map((e) => /* @__PURE__ */ m(x, {
 												value: e,
 												children: r(e)
 											}, e)) })]
 										})]
 									}),
-									/* @__PURE__ */ y("div", {
+									/* @__PURE__ */ h("div", {
 										className: "grid gap-1.5",
-										children: [/* @__PURE__ */ v(S, {
+										children: [/* @__PURE__ */ m(v, {
 											htmlFor: "shipScheduled",
 											children: "Scheduled date"
-										}), /* @__PURE__ */ v(x, {
+										}), /* @__PURE__ */ m(_, {
 											id: "shipScheduled",
 											type: "date",
-											value: I.scheduledAt,
-											onChange: (e) => L({
-												...I,
+											value: P.scheduledAt,
+											onChange: (e) => F({
+												...P,
 												scheduledAt: e.target.value
 											})
 										})]
 									})
 								]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ h("div", {
 								className: "grid gap-1.5",
-								children: [/* @__PURE__ */ v(S, {
+								children: [/* @__PURE__ */ m(v, {
 									htmlFor: "shipCarrier",
 									children: "Carrier"
-								}), /* @__PURE__ */ v(x, {
+								}), /* @__PURE__ */ m(_, {
 									id: "shipCarrier",
-									value: I.carrier,
-									onChange: (e) => L({
-										...I,
+									value: P.carrier,
+									onChange: (e) => F({
+										...P,
 										carrier: e.target.value
 									}),
 									placeholder: "Frontline Ltd."
 								})]
 							}),
-							/* @__PURE__ */ v(ie, {
+							/* @__PURE__ */ m(he, {
 								id: "shipDocument",
 								label: "Bill of lading (optional)",
-								value: R,
-								onChange: z,
+								value: I,
+								onChange: L,
 								hint: "Attach the bill of lading or shipping document (PDF or image)."
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ h("div", {
 								className: "grid gap-1.5",
-								children: [/* @__PURE__ */ v(S, {
+								children: [/* @__PURE__ */ m(v, {
 									htmlFor: "shipNotes",
 									children: "Notes"
-								}), /* @__PURE__ */ v(pe, {
+								}), /* @__PURE__ */ m(w, {
 									id: "shipNotes",
-									value: I.notes,
-									onChange: (e) => L({
-										...I,
+									value: P.notes,
+									onChange: (e) => F({
+										...P,
 										notes: e.target.value
 									}),
 									placeholder: "Optional context — laycan window, inspector, terms.",
 									rows: 2
 								})]
 							}),
-							B && /* @__PURE__ */ v("p", {
+							R && /* @__PURE__ */ m("p", {
 								className: "text-sm text-status-error-text",
-								children: B
+								children: R
 							})
 						]
-					}),
-					/* @__PURE__ */ y(ue, { children: [/* @__PURE__ */ v(b, {
+					}), /* @__PURE__ */ h(Ce, { children: [/* @__PURE__ */ m(g, {
+						type: "button",
 						variant: "outline",
-						onClick: () => F(!1),
+						onClick: () => {
+							N(!1), Q();
+						},
 						children: "Cancel"
-					}), /* @__PURE__ */ v(b, {
-						onClick: we,
+					}), /* @__PURE__ */ m(g, {
+						type: "submit",
 						disabled: J.isPending,
 						children: J.isPending ? "Scheduling…" : "Schedule shipment"
-					})] })
-				] })
+					})] })]
+				})] })
 			})
 		]
 	});