npm - @burdenoff/microfe-assethandler - Versions diffs - 2026.625.2 → 2026.703.1 - Mend

@burdenoff/microfe-assethandler 2026.625.2 → 2026.703.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (76) hide show

package/dist/assethandler/pages/AssetsAssetCheckInOutPage.js CHANGED Viewed

@@ -1,238 +1,352 @@
 import { useAssetHandlerStore as e } from "../store/assethandlerStore.js";
-import { useState as t } from "react";
-import { AlertTriangle as n, ArrowDownToLine as r, ArrowUpFromLine as i, Clock as a, Search as o } from "lucide-react";
-import { Badge as s, Button as c, Card as l, CardContent as u, EmphasisPanel as d, GradientText as f, IllustratedEmptyState as p, Input as m, PagePurpose as h, Tabs as g, TabsContent as _, TabsList as v, TabsTrigger as y } from "@burdenoff/fe-libs/ui";
-import { jsx as b, jsxs as x } from "react/jsx-runtime";
+import { notify as t } from "../utils/toast.js";
+import { useMemo as n, useState as r } from "react";
+import { AlertTriangle as i, ArrowDownToLine as a, ArrowUpFromLine as o, Clock as s, Search as c } from "lucide-react";
+import { Badge as l, Button as u, Card as d, CardContent as f, EmphasisPanel as p, GradientText as m, IllustratedEmptyState as h, Input as g, PagePurpose as ee, Tabs as _, TabsContent as v, TabsList as y, TabsTrigger as b } from "@burdenoff/fe-libs/ui";
+import { jsx as x, jsxs as S } from "react/jsx-runtime";
+import { gql as C } from "@apollo/client";
+import { useMutation as w, useQuery as T } from "@apollo/client/react";
 //#region src/assethandler/pages/AssetsAssetCheckInOutPage.tsx
-var S = {
-	active: "default",
-	returned: "secondary",
-	overdue: "destructive"
+var E = C`
+  query AssetHandlerAssetAssignments {
+    assetAssignments {
+      id
+      assetId
+      assetName
+      assignedTo
+      assignedBy
+      checkedOutAt
+      dueAt
+      checkedInAt
+      status
+      notes
+    }
+  }
+`, D = C`
+  mutation AssetHandlerCheckOutAsset($input: CheckOutAssetInput!) {
+    checkOutAsset(input: $input) {
+      id
+      status
+    }
+  }
+`, O = C`
+  mutation AssetHandlerCheckInAsset($input: CheckInAssetInput!) {
+    checkInAsset(input: $input) {
+      id
+      status
+    }
+  }
+`, k = {
+	CHECKED_OUT: "default",
+	RETURNED: "secondary",
+	OVERDUE: "destructive"
+}, A = {
+	CHECKED_OUT: "checked out",
+	RETURNED: "returned",
+	OVERDUE: "overdue"
 };
-function C() {
-	let { checkInOutRecords: C } = e(), [w, T] = t(""), E = C.filter((e) => e.status === "active"), D = C.filter((e) => e.status === "overdue"), O = C.filter((e) => e.status === "returned"), k = C.filter((e) => w === "" || e.assetName.toLowerCase().includes(w.toLowerCase()) || e.userName.toLowerCase().includes(w.toLowerCase()));
-	return /* @__PURE__ */ x("div", {
+function j() {
+	let { assets: C } = e(), [j, M] = r(""), [te, N] = r(!1), [P, F] = r(""), [I, L] = r(""), [R, z] = r(""), [B, V] = r(""), { data: H, loading: U, refetch: W } = T(E, { fetchPolicy: "cache-and-network" }), [G, { loading: K }] = w(D, {
+		onCompleted: () => {
+			t.success("Asset checked out", "The assignment has been recorded."), N(!1), F(""), L(""), z(""), V(""), W();
+		},
+		onError: (e) => t.error("Check-out failed", e.message)
+	}), [q, { loading: J }] = w(O, {
+		onCompleted: () => {
+			t.success("Asset checked in", "The asset has been returned."), W();
+		},
+		onError: (e) => t.error("Check-in failed", e.message)
+	}), Y = n(() => H?.assetAssignments ?? [], [H]), X = Y.filter((e) => e.status === "CHECKED_OUT"), Z = Y.filter((e) => e.status === "OVERDUE"), Q = Y.filter((e) => e.status === "RETURNED"), $ = Y.filter((e) => j === "" || e.assetName.toLowerCase().includes(j.toLowerCase()) || e.assignedTo.toLowerCase().includes(j.toLowerCase()));
+	return /* @__PURE__ */ S("div", {
 		className: "space-y-6 p-6",
 		children: [
-			/* @__PURE__ */ x("div", {
+			/* @__PURE__ */ S("div", {
 				className: "flex items-center justify-between",
-				children: [/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("h1", {
+				children: [/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("h1", {
 					className: "text-2xl font-bold",
-					children: /* @__PURE__ */ b(f, { children: "Asset Check-In / Check-Out" })
-				}), /* @__PURE__ */ b("p", {
+					children: /* @__PURE__ */ x(m, { children: "Asset Check-In / Check-Out" })
+				}), /* @__PURE__ */ x("p", {
 					className: "text-sm text-text-secondary",
 					children: "Manage asset assignments and returns"
 				})] }), /* @__PURE__ */ x("div", {
 					className: "flex gap-2",
-					children: [/* @__PURE__ */ x(c, {
-						variant: "outline",
+					children: /* @__PURE__ */ S(u, {
 						size: "sm",
-						children: [/* @__PURE__ */ b(r, { className: "mr-2 h-4 w-4" }), "Check In"]
-					}), /* @__PURE__ */ x(c, {
-						size: "sm",
-						children: [/* @__PURE__ */ b(i, { className: "mr-2 h-4 w-4" }), "Check Out"]
-					})]
+						onClick: () => N((e) => !e),
+						children: [/* @__PURE__ */ x(o, { className: "mr-2 h-4 w-4" }), "Check Out"]
+					})
 				})]
 			}),
-			/* @__PURE__ */ b(h, { children: "Know who has what, right now. Check assets out to people for a job or loan period and check them back in on return — with condition logged each way. Use it to chase overdue items and make sure nothing walks off without a trace." }),
-			/* @__PURE__ */ x("div", {
+			/* @__PURE__ */ x(ee, { children: "Know who has what, right now. Check assets out to people for a job or loan period and check them back in on return. Use it to chase overdue items and make sure nothing walks off without a trace." }),
+			te && /* @__PURE__ */ S(p, { children: [/* @__PURE__ */ x("h2", {
+				className: "text-sm font-semibold mb-3",
+				children: "Check out an asset"
+			}), /* @__PURE__ */ S("form", {
+				className: "grid gap-3 md:grid-cols-2 lg:grid-cols-4",
+				onSubmit: (e) => {
+					if (e.preventDefault(), !P || !I.trim()) {
+						t.warning("Missing details", "Choose an asset and who is receiving it.");
+						return;
+					}
+					G({ variables: { input: {
+						assetId: P,
+						assignedTo: I.trim(),
+						dueAt: R ? new Date(R).toISOString() : null,
+						notes: B.trim() || null
+					} } });
+				},
+				children: [
+					/* @__PURE__ */ S("select", {
+						className: "rounded-md border px-3 py-2 bg-bg-base",
+						value: P,
+						onChange: (e) => F(e.target.value),
+						"aria-label": "Asset to check out",
+						children: [/* @__PURE__ */ x("option", {
+							value: "",
+							children: "Select an asset…"
+						}), C.map((e) => /* @__PURE__ */ S("option", {
+							value: e.id,
+							children: [
+								e.name,
+								" (",
+								e.assetTag,
+								")"
+							]
+						}, e.id))]
+					}),
+					/* @__PURE__ */ x(g, {
+						placeholder: "Assign to (name or email)",
+						value: I,
+						onChange: (e) => L(e.target.value)
+					}),
+					/* @__PURE__ */ x(g, {
+						type: "date",
+						"aria-label": "Due date",
+						value: R,
+						onChange: (e) => z(e.target.value)
+					}),
+					/* @__PURE__ */ x(g, {
+						placeholder: "Notes (optional)",
+						value: B,
+						onChange: (e) => V(e.target.value)
+					}),
+					/* @__PURE__ */ S("div", {
+						className: "md:col-span-2 lg:col-span-4 flex gap-2",
+						children: [/* @__PURE__ */ x(u, {
+							type: "submit",
+							size: "sm",
+							disabled: K,
+							children: K ? "Checking out…" : "Confirm check-out"
+						}), /* @__PURE__ */ x(u, {
+							type: "button",
+							variant: "outline",
+							size: "sm",
+							onClick: () => N(!1),
+							children: "Cancel"
+						})]
+					})
+				]
+			})] }),
+			/* @__PURE__ */ S("div", {
 				className: "grid gap-4 md:grid-cols-4",
 				children: [
-					/* @__PURE__ */ x(d, { children: [/* @__PURE__ */ x("div", {
+					/* @__PURE__ */ S(p, { children: [/* @__PURE__ */ S("div", {
 						className: "flex items-center gap-2 text-sm text-text-secondary",
-						children: [/* @__PURE__ */ b(i, { className: "h-4 w-4" }), "Active Checkouts"]
-					}), /* @__PURE__ */ b("p", {
+						children: [/* @__PURE__ */ x(o, { className: "h-4 w-4" }), "Active Checkouts"]
+					}), /* @__PURE__ */ x("p", {
 						className: "text-2xl font-bold mt-1 tabular-nums",
-						children: E.length
+						children: X.length
 					})] }),
-					/* @__PURE__ */ b(l, { children: /* @__PURE__ */ x(u, {
+					/* @__PURE__ */ x(d, { children: /* @__PURE__ */ S(f, {
 						className: "pt-4",
-						children: [/* @__PURE__ */ x("div", {
+						children: [/* @__PURE__ */ S("div", {
 							className: "flex items-center gap-2 text-sm text-text-secondary",
-							children: [/* @__PURE__ */ b(n, { className: "h-4 w-4 text-status-error-text" }), "Overdue"]
-						}), /* @__PURE__ */ b("p", {
+							children: [/* @__PURE__ */ x(i, { className: "h-4 w-4 text-status-error-text" }), "Overdue"]
+						}), /* @__PURE__ */ x("p", {
 							className: "text-2xl font-bold mt-1 text-status-error-text",
-							children: D.length
+							children: Z.length
 						})]
 					}) }),
-					/* @__PURE__ */ b(l, { children: /* @__PURE__ */ x(u, {
+					/* @__PURE__ */ x(d, { children: /* @__PURE__ */ S(f, {
 						className: "pt-4",
-						children: [/* @__PURE__ */ x("div", {
+						children: [/* @__PURE__ */ S("div", {
 							className: "flex items-center gap-2 text-sm text-text-secondary",
-							children: [/* @__PURE__ */ b(r, { className: "h-4 w-4" }), "Returned"]
-						}), /* @__PURE__ */ b("p", {
+							children: [/* @__PURE__ */ x(a, { className: "h-4 w-4" }), "Returned"]
+						}), /* @__PURE__ */ x("p", {
 							className: "text-2xl font-bold mt-1",
-							children: O.length
+							children: Q.length
 						})]
 					}) }),
-					/* @__PURE__ */ b(l, { children: /* @__PURE__ */ x(u, {
+					/* @__PURE__ */ x(d, { children: /* @__PURE__ */ S(f, {
 						className: "pt-4",
-						children: [/* @__PURE__ */ x("div", {
+						children: [/* @__PURE__ */ S("div", {
 							className: "flex items-center gap-2 text-sm text-text-secondary",
-							children: [/* @__PURE__ */ b(a, { className: "h-4 w-4" }), "Total Records"]
-						}), /* @__PURE__ */ b("p", {
+							children: [/* @__PURE__ */ x(s, { className: "h-4 w-4" }), "Total Records"]
+						}), /* @__PURE__ */ x("p", {
 							className: "text-2xl font-bold mt-1",
-							children: C.length
+							children: Y.length
 						})]
 					}) })
 				]
 			}),
-			/* @__PURE__ */ x("div", {
+			/* @__PURE__ */ S("div", {
 				className: "relative max-w-md",
-				children: [/* @__PURE__ */ b(o, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary" }), /* @__PURE__ */ b(m, {
-					placeholder: "Search by asset or user name...",
-					value: w,
-					onChange: (e) => T(e.target.value),
+				children: [/* @__PURE__ */ x(c, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary" }), /* @__PURE__ */ x(g, {
+					placeholder: "Search by asset or person…",
+					value: j,
+					onChange: (e) => M(e.target.value),
 					className: "pl-9"
 				})]
 			}),
-			/* @__PURE__ */ x(g, {
+			/* @__PURE__ */ S(_, {
 				defaultValue: "all",
-				children: [/* @__PURE__ */ x(v, { children: [
-					/* @__PURE__ */ x(y, {
+				children: [/* @__PURE__ */ S(y, { children: [
+					/* @__PURE__ */ S(b, {
 						value: "all",
 						children: [
 							"All (",
-							k.length,
+							$.length,
 							")"
 						]
 					}),
-					/* @__PURE__ */ x(y, {
+					/* @__PURE__ */ S(b, {
 						value: "active",
 						children: [
 							"Active (",
-							E.length,
+							X.length,
 							")"
 						]
 					}),
-					/* @__PURE__ */ x(y, {
+					/* @__PURE__ */ S(b, {
 						value: "overdue",
 						children: [
 							"Overdue (",
-							D.length,
+							Z.length,
 							")"
 						]
 					}),
-					/* @__PURE__ */ x(y, {
+					/* @__PURE__ */ S(b, {
 						value: "returned",
 						children: [
 							"Returned (",
-							O.length,
+							Q.length,
 							")"
 						]
 					})
 				] }), [
-					"all",
-					"active",
-					"overdue",
-					"returned"
-				].map((e) => {
-					let t = e === "all" ? k : k.filter((t) => t.status === e);
-					return /* @__PURE__ */ b(_, {
+					["all", null],
+					["active", "CHECKED_OUT"],
+					["overdue", "OVERDUE"],
+					["returned", "RETURNED"]
+				].map(([e, t]) => {
+					let n = t === null ? $ : $.filter((e) => e.status === t);
+					return /* @__PURE__ */ x(v, {
 						value: e,
 						className: "mt-4",
-						children: /* @__PURE__ */ b(l, { children: /* @__PURE__ */ b(u, {
+						children: /* @__PURE__ */ x(d, { children: /* @__PURE__ */ x(f, {
 							className: "p-0",
-							children: /* @__PURE__ */ x("div", {
+							children: /* @__PURE__ */ S("div", {
 								className: "overflow-x-auto",
-								children: [/* @__PURE__ */ x("table", {
-									className: "w-full text-sm",
-									children: [/* @__PURE__ */ b("thead", { children: /* @__PURE__ */ x("tr", {
-										className: "border-b bg-bg-sunken/50",
-										children: [
-											/* @__PURE__ */ b("th", {
-												className: "text-left p-3 font-medium",
-												children: "ID"
-											}),
-											/* @__PURE__ */ b("th", {
-												className: "text-left p-3 font-medium",
-												children: "Type"
-											}),
-											/* @__PURE__ */ b("th", {
-												className: "text-left p-3 font-medium",
-												children: "Asset"
-											}),
-											/* @__PURE__ */ b("th", {
-												className: "text-left p-3 font-medium",
-												children: "User"
-											}),
-											/* @__PURE__ */ b("th", {
-												className: "text-left p-3 font-medium",
-												children: "Date"
-											}),
-											/* @__PURE__ */ b("th", {
-												className: "text-left p-3 font-medium",
-												children: "Expected Return"
-											}),
-											/* @__PURE__ */ b("th", {
-												className: "text-left p-3 font-medium",
-												children: "Condition"
-											}),
-											/* @__PURE__ */ b("th", {
-												className: "text-left p-3 font-medium",
-												children: "Status"
-											})
-										]
-									}) }), /* @__PURE__ */ b("tbody", { children: t.map((e) => /* @__PURE__ */ x("tr", {
-										className: "border-b hover:bg-bg-sunken/50",
-										children: [
-											/* @__PURE__ */ b("td", {
-												className: "p-3 font-mono text-xs",
-												children: e.id
-											}),
-											/* @__PURE__ */ b("td", {
-												className: "p-3",
-												children: /* @__PURE__ */ x("div", {
-													className: "flex items-center gap-1.5",
-													children: [e.type === "check_out" ? /* @__PURE__ */ b(i, { className: "h-3.5 w-3.5 text-status-info-text" }) : /* @__PURE__ */ b(r, { className: "h-3.5 w-3.5 text-status-success-text" }), /* @__PURE__ */ b("span", {
-														className: "capitalize text-xs",
-														children: e.type.replace("_", " ")
-													})]
+								children: [
+									/* @__PURE__ */ S("table", {
+										className: "w-full text-sm",
+										children: [/* @__PURE__ */ x("thead", { children: /* @__PURE__ */ S("tr", {
+											className: "border-b bg-bg-sunken/50",
+											children: [
+												/* @__PURE__ */ x("th", {
+													className: "text-left p-3 font-medium",
+													children: "Asset"
+												}),
+												/* @__PURE__ */ x("th", {
+													className: "text-left p-3 font-medium",
+													children: "Assigned To"
+												}),
+												/* @__PURE__ */ x("th", {
+													className: "text-left p-3 font-medium",
+													children: "Checked Out"
+												}),
+												/* @__PURE__ */ x("th", {
+													className: "text-left p-3 font-medium",
+													children: "Due"
+												}),
+												/* @__PURE__ */ x("th", {
+													className: "text-left p-3 font-medium",
+													children: "Returned"
+												}),
+												/* @__PURE__ */ x("th", {
+													className: "text-left p-3 font-medium",
+													children: "Status"
+												}),
+												/* @__PURE__ */ x("th", {
+													className: "text-right p-3 font-medium",
+													children: "Action"
 												})
-											}),
-											/* @__PURE__ */ x("td", {
-												className: "p-3",
-												children: [/* @__PURE__ */ b("p", {
-													className: "font-medium",
-													children: e.assetName
-												}), /* @__PURE__ */ b("p", {
-													className: "text-xs text-text-secondary",
-													children: e.assetId
-												})]
-											}),
-											/* @__PURE__ */ b("td", {
-												className: "p-3",
-												children: /* @__PURE__ */ b("p", {
-													className: "text-sm",
-													children: e.userName
-												})
-											}),
-											/* @__PURE__ */ b("td", {
-												className: "p-3 text-xs",
-												children: new Date(e.date).toLocaleDateString()
-											}),
-											/* @__PURE__ */ b("td", {
-												className: "p-3 text-xs",
-												children: e.expectedReturn ? new Date(e.expectedReturn).toLocaleDateString() : "-"
-											}),
-											/* @__PURE__ */ b("td", {
-												className: "p-3 capitalize text-xs",
-												children: e.condition
-											}),
-											/* @__PURE__ */ b("td", {
-												className: "p-3",
-												children: /* @__PURE__ */ b(s, {
-													variant: S[e.status] || "outline",
-													children: e.status
+											]
+										}) }), /* @__PURE__ */ x("tbody", { children: n.map((e) => /* @__PURE__ */ S("tr", {
+											className: "border-b hover:bg-bg-sunken/50",
+											children: [
+												/* @__PURE__ */ S("td", {
+													className: "p-3",
+													children: [/* @__PURE__ */ x("p", {
+														className: "font-medium",
+														children: e.assetName
+													}), /* @__PURE__ */ x("p", {
+														className: "text-xs text-text-secondary",
+														children: e.assetId
+													})]
+												}),
+												/* @__PURE__ */ S("td", {
+													className: "p-3",
+													children: [/* @__PURE__ */ x("p", {
+														className: "text-sm",
+														children: e.assignedTo
+													}), /* @__PURE__ */ S("p", {
+														className: "text-xs text-text-secondary",
+														children: ["by ", e.assignedBy]
+													})]
+												}),
+												/* @__PURE__ */ x("td", {
+													className: "p-3 text-xs",
+													children: new Date(e.checkedOutAt).toLocaleDateString()
+												}),
+												/* @__PURE__ */ x("td", {
+													className: "p-3 text-xs",
+													children: e.dueAt ? new Date(e.dueAt).toLocaleDateString() : "—"
+												}),
+												/* @__PURE__ */ x("td", {
+													className: "p-3 text-xs",
+													children: e.checkedInAt ? new Date(e.checkedInAt).toLocaleDateString() : "—"
+												}),
+												/* @__PURE__ */ x("td", {
+													className: "p-3",
+													children: /* @__PURE__ */ x(l, {
+														variant: k[e.status],
+														children: A[e.status]
+													})
+												}),
+												/* @__PURE__ */ x("td", {
+													className: "p-3 text-right",
+													children: e.status === "RETURNED" ? null : /* @__PURE__ */ S(u, {
+														size: "sm",
+														variant: "outline",
+														disabled: J,
+														onClick: () => void q({ variables: { input: { assignmentId: e.id } } }),
+														children: [/* @__PURE__ */ x(a, { className: "mr-1.5 h-3.5 w-3.5" }), "Check In"]
+													})
 												})
-											})
-										]
-									}, e.id)) })]
-								}), t.length === 0 && /* @__PURE__ */ b(p, {
-									illustration: w ? "empty-search" : "empty-people",
-									title: w ? "No matching records" : "No check-in / out records",
-									description: w ? "No records match your search — try a different name." : "Check an asset out to someone and the activity will appear here."
-								})]
+											]
+										}, e.id)) })]
+									}),
+									n.length === 0 && !U && /* @__PURE__ */ x(h, {
+										illustration: j ? "empty-search" : "empty-people",
+										title: j ? "No matching records" : "No check-in / out records",
+										description: j ? "No records match your search — try a different name." : "Check an asset out to someone and the activity will appear here."
+									}),
+									U && n.length === 0 ? /* @__PURE__ */ x("div", {
+										className: "space-y-2 p-4",
+										children: Array.from({ length: 4 }).map((e, t) => /* @__PURE__ */ x("div", { className: "h-8 rounded-md bg-bg-sunken motion-safe:animate-vc-shimmer" }, t))
+									}) : null
+								]
 							})
 						}) })
 					}, e);
@@ -242,6 +356,6 @@ function C() {
 	});
 }
 //#endregion
-export { C as AssetsAssetCheckInOutPage };
+export { j as AssetsAssetCheckInOutPage };
 //# sourceMappingURL=AssetsAssetCheckInOutPage.js.map

package/dist/assethandler/pages/AssetsAssetCheckInOutPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AssetsAssetCheckInOutPage.js","names":[],"sources":["../../../src/assethandler/pages/AssetsAssetCheckInOutPage.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n Badge,\n Button,\n Card,\n CardContent,\n Input,\n Tabs,\n TabsContent,\n TabsList,\n TabsTrigger,\n GradientText,\n EmphasisPanel,\n PagePurpose,\n IllustratedEmptyState,\n} from '@burdenoff/fe-libs/ui';\nimport { ArrowDownToLine, ArrowUpFromLine, Clock, Search, AlertTriangle } from 'lucide-react';\nimport { useAssetHandlerStore } from '../store/assethandlerStore';\n\nconst statusColors: Record<string, 'default' \| 'secondary' \| 'destructive' \| 'outline'> = {\n active: 'default',\n returned: 'secondary',\n overdue: 'destructive',\n};\n\nexport function AssetsAssetCheckInOutPage() {\n const { checkInOutRecords } = useAssetHandlerStore();\n const [searchQuery, setSearchQuery] = useState('');\n\n const activeCheckouts = checkInOutRecords.filter((r) => r.status === 'active');\n const overdueCheckouts = checkInOutRecords.filter((r) => r.status === 'overdue');\n const returnedRecords = checkInOutRecords.filter((r) => r.status === 'returned');\n\n const filteredRecords = checkInOutRecords.filter(\n (r) =>\n searchQuery === '' \|\|\n r.assetName.toLowerCase().includes(searchQuery.toLowerCase()) \|\|\n r.userName.toLowerCase().includes(searchQuery.toLowerCase())\n );\n\n return (\n <div className=\"space-y-6 p-6\">\n <div className=\"flex items-center justify-between\">\n <div>\n <h1 className=\"text-2xl font-bold\">\n <GradientText>Asset Check-In / Check-Out</GradientText>\n </h1>\n <p className=\"text-sm text-text-secondary\">Manage asset assignments and returns</p>\n </div>\n <div className=\"flex gap-2\">\n <Button variant=\"outline\" size=\"sm\">\n <ArrowDownToLine className=\"mr-2 h-4 w-4\" />\n Check In\n </Button>\n <Button size=\"sm\">\n <ArrowUpFromLine className=\"mr-2 h-4 w-4\" />\n Check Out\n </Button>\n </div>\n </div>\n\n <PagePurpose>\n Know who has what, right now. Check assets out to people for a job or loan period and check\n them back in on return — with condition logged each way. Use it to chase overdue items and\n make sure nothing walks off without a trace.\n </PagePurpose>\n\n <div className=\"grid gap-4 md:grid-cols-4\">\n <EmphasisPanel>\n <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <ArrowUpFromLine className=\"h-4 w-4\" />\n Active Checkouts\n </div>\n <p className=\"text-2xl font-bold mt-1 tabular-nums\">{activeCheckouts.length}</p>\n </EmphasisPanel>\n <Card>\n <CardContent className=\"pt-4\">\n <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <AlertTriangle className=\"h-4 w-4 text-status-error-text\" />\n Overdue\n </div>\n <p className=\"text-2xl font-bold mt-1 text-status-error-text\">\n {overdueCheckouts.length}\n </p>\n </CardContent>\n </Card>\n <Card>\n <CardContent className=\"pt-4\">\n <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <ArrowDownToLine className=\"h-4 w-4\" />\n Returned\n </div>\n <p className=\"text-2xl font-bold mt-1\">{returnedRecords.length}</p>\n </CardContent>\n </Card>\n <Card>\n <CardContent className=\"pt-4\">\n <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <Clock className=\"h-4 w-4\" />\n Total Records\n </div>\n <p className=\"text-2xl font-bold mt-1\">{checkInOutRecords.length}</p>\n </CardContent>\n </Card>\n </div>\n\n <div className=\"relative max-w-md\">\n <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n <Input\n placeholder=\"Search by asset or user name...\"\n value={searchQuery}\n onChange={(e) => setSearchQuery(e.target.value)}\n className=\"pl-9\"\n />\n </div>\n\n <Tabs defaultValue=\"all\">\n <TabsList>\n <TabsTrigger value=\"all\">All ({filteredRecords.length})</TabsTrigger>\n <TabsTrigger value=\"active\">Active ({activeCheckouts.length})</TabsTrigger>\n <TabsTrigger value=\"overdue\">Overdue ({overdueCheckouts.length})</TabsTrigger>\n <TabsTrigger value=\"returned\">Returned ({returnedRecords.length})</TabsTrigger>\n </TabsList>\n {(['all', 'active', 'overdue', 'returned'] as const).map((tab) => {\n const records =\n tab === 'all' ? filteredRecords : filteredRecords.filter((r) => r.status === tab);\n return (\n <TabsContent key={tab} value={tab} className=\"mt-4\">\n <Card>\n <CardContent className=\"p-0\">\n <div className=\"overflow-x-auto\">\n <table className=\"w-full text-sm\">\n <thead>\n <tr className=\"border-b bg-bg-sunken/50\">\n <th className=\"text-left p-3 font-medium\">ID</th>\n <th className=\"text-left p-3 font-medium\">Type</th>\n <th className=\"text-left p-3 font-medium\">Asset</th>\n <th className=\"text-left p-3 font-medium\">User</th>\n <th className=\"text-left p-3 font-medium\">Date</th>\n <th className=\"text-left p-3 font-medium\">Expected Return</th>\n <th className=\"text-left p-3 font-medium\">Condition</th>\n <th className=\"text-left p-3 font-medium\">Status</th>\n </tr>\n </thead>\n <tbody>\n {records.map((rec) => (\n <tr key={rec.id} className=\"border-b hover:bg-bg-sunken/50\">\n <td className=\"p-3 font-mono text-xs\">{rec.id}</td>\n <td className=\"p-3\">\n <div className=\"flex items-center gap-1.5\">\n {rec.type === 'check_out' ? (\n <ArrowUpFromLine className=\"h-3.5 w-3.5 text-status-info-text\" />\n ) : (\n <ArrowDownToLine className=\"h-3.5 w-3.5 text-status-success-text\" />\n )}\n <span className=\"capitalize text-xs\">\n {rec.type.replace('_', ' ')}\n </span>\n </div>\n </td>\n <td className=\"p-3\">\n <p className=\"font-medium\">{rec.assetName}</p>\n <p className=\"text-xs text-text-secondary\">{rec.assetId}</p>\n </td>\n <td className=\"p-3\">\n <p className=\"text-sm\">{rec.userName}</p>\n </td>\n <td className=\"p-3 text-xs\">\n {new Date(rec.date).toLocaleDateString()}\n </td>\n <td className=\"p-3 text-xs\">\n {rec.expectedReturn\n ? new Date(rec.expectedReturn).toLocaleDateString()\n : '-'}\n </td>\n <td className=\"p-3 capitalize text-xs\">{rec.condition}</td>\n <td className=\"p-3\">\n <Badge variant={statusColors[rec.status] \|\| 'outline'}>\n {rec.status}\n </Badge>\n </td>\n </tr>\n ))}\n </tbody>\n </table>\n {records.length === 0 && (\n <IllustratedEmptyState\n illustration={searchQuery ? 'empty-search' : 'empty-people'}\n title={searchQuery ? 'No matching records' : 'No check-in / out records'}\n description={\n searchQuery\n ? 'No records match your search — try a different name.'\n : 'Check an asset out to someone and the activity will appear here.'\n }\n />\n )}\n </div>\n </CardContent>\n </Card>\n </TabsContent>\n );\n })}\n </Tabs>\n </div>\n );\n}\n"],"mappings":";;;;;;AAmBA,IAAM,IAAoF;CACxF,QAAQ;CACR,UAAU;CACV,SAAS;CACV;AAED,SAAgB,IAA4B;CAC1C,IAAM,EAAE,yBAAsB,GAAsB,EAC9C,CAAC,GAAa,KAAkB,EAAS,GAAG,EAE5C,IAAkB,EAAkB,QAAQ,MAAM,EAAE,WAAW,SAAS,EACxE,IAAmB,EAAkB,QAAQ,MAAM,EAAE,WAAW,UAAU,EAC1E,IAAkB,EAAkB,QAAQ,MAAM,EAAE,WAAW,WAAW,EAE1E,IAAkB,EAAkB,QACvC,MACC,MAAgB,MAChB,EAAE,UAAU,aAAa,CAAC,SAAS,EAAY,aAAa,CAAC,IAC7D,EAAE,SAAS,aAAa,CAAC,SAAS,EAAY,aAAa,CAAC,CAC/D;AAED,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf;GACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,MAAD;KAAI,WAAU;eACZ,kBAAC,GAAD,EAAA,UAAc,8BAAyC,CAAA;KACpD,CAAA,EACL,kBAAC,KAAD;KAAG,WAAU;eAA8B;KAAwC,CAAA,CAC/E,EAAA,CAAA,EACN,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD;MAAQ,SAAQ;MAAU,MAAK;gBAA/B,CACE,kBAAC,GAAD,EAAiB,WAAU,gBAAiB,CAAA,EAAA,WAErC;SACT,kBAAC,GAAD;MAAQ,MAAK;gBAAb,CACE,kBAAC,GAAD,EAAiB,WAAU,gBAAiB,CAAA,EAAA,YAErC;QACL;OACF;;GAEN,kBAAC,GAAD,EAAA,UAAa,uOAIC,CAAA;GAEd,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,GAAD,EAAiB,WAAU,WAAY,CAAA,EAAA,mBAEnC;SACN,kBAAC,KAAD;MAAG,WAAU;gBAAwC,EAAgB;MAAW,CAAA,CAClE,EAAA,CAAA;KAChB,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;MAAa,WAAU;gBAAvB,CACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,GAAD,EAAe,WAAU,kCAAmC,CAAA,EAAA,UAExD;UACN,kBAAC,KAAD;OAAG,WAAU;iBACV,EAAiB;OAChB,CAAA,CACQ;SACT,CAAA;KACP,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;MAAa,WAAU;gBAAvB,CACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,GAAD,EAAiB,WAAU,WAAY,CAAA,EAAA,WAEnC;UACN,kBAAC,KAAD;OAAG,WAAU;iBAA2B,EAAgB;OAAW,CAAA,CACvD;SACT,CAAA;KACP,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;MAAa,WAAU;gBAAvB,CACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA,EAAA,gBAEzB;UACN,kBAAC,KAAD;OAAG,WAAU;iBAA2B,EAAkB;OAAW,CAAA,CACzD;SACT,CAAA;KACH;;GAEN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,GAAD,EAAQ,WAAU,wEAAyE,CAAA,EAC3F,kBAAC,GAAD;KACE,aAAY;KACZ,OAAO;KACP,WAAW,MAAM,EAAe,EAAE,OAAO,MAAM;KAC/C,WAAU;KACV,CAAA,CACE;;GAEN,kBAAC,GAAD;IAAM,cAAa;cAAnB,CACE,kBAAC,GAAD,EAAA,UAAA;KACE,kBAAC,GAAD;MAAa,OAAM;gBAAnB;OAAyB;OAAM,EAAgB;OAAO;OAAe;;KACrE,kBAAC,GAAD;MAAa,OAAM;gBAAnB;OAA4B;OAAS,EAAgB;OAAO;OAAe;;KAC3E,kBAAC,GAAD;MAAa,OAAM;gBAAnB;OAA6B;OAAU,EAAiB;OAAO;OAAe;;KAC9E,kBAAC,GAAD;MAAa,OAAM;gBAAnB;OAA8B;OAAW,EAAgB;OAAO;OAAe;;KACtE,EAAA,CAAA,EACT;KAAC;KAAO;KAAU;KAAW;KAAW,CAAW,KAAK,MAAQ;KAChE,IAAM,IACJ,MAAQ,QAAQ,IAAkB,EAAgB,QAAQ,MAAM,EAAE,WAAW,EAAI;AACnF,YACE,kBAAC,GAAD;MAAuB,OAAO;MAAK,WAAU;gBAC3C,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;OAAa,WAAU;iBACrB,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,SAAD;SAAO,WAAU;mBAAjB,CACE,kBAAC,SAAD,EAAA,UACE,kBAAC,MAAD;UAAI,WAAU;oBAAd;WACE,kBAAC,MAAD;YAAI,WAAU;sBAA4B;YAAO,CAAA;WACjD,kBAAC,MAAD;YAAI,WAAU;sBAA4B;YAAS,CAAA;WACnD,kBAAC,MAAD;YAAI,WAAU;sBAA4B;YAAU,CAAA;WACpD,kBAAC,MAAD;YAAI,WAAU;sBAA4B;YAAS,CAAA;WACnD,kBAAC,MAAD;YAAI,WAAU;sBAA4B;YAAS,CAAA;WACnD,kBAAC,MAAD;YAAI,WAAU;sBAA4B;YAAoB,CAAA;WAC9D,kBAAC,MAAD;YAAI,WAAU;sBAA4B;YAAc,CAAA;WACxD,kBAAC,MAAD;YAAI,WAAU;sBAA4B;YAAW,CAAA;WAClD;aACC,CAAA,EACR,kBAAC,SAAD,EAAA,UACG,EAAQ,KAAK,MACZ,kBAAC,MAAD;UAAiB,WAAU;oBAA3B;WACE,kBAAC,MAAD;YAAI,WAAU;sBAAyB,EAAI;YAAQ,CAAA;WACnD,kBAAC,MAAD;YAAI,WAAU;sBACZ,kBAAC,OAAD;aAAK,WAAU;uBAAf,CACG,EAAI,SAAS,cACZ,kBAAC,GAAD,EAAiB,WAAU,qCAAsC,CAAA,GAEjE,kBAAC,GAAD,EAAiB,WAAU,wCAAyC,CAAA,EAEtE,kBAAC,QAAD;cAAM,WAAU;wBACb,EAAI,KAAK,QAAQ,KAAK,IAAI;cACtB,CAAA,CACH;;YACH,CAAA;WACL,kBAAC,MAAD;YAAI,WAAU;sBAAd,CACE,kBAAC,KAAD;aAAG,WAAU;uBAAe,EAAI;aAAc,CAAA,EAC9C,kBAAC,KAAD;aAAG,WAAU;uBAA+B,EAAI;aAAY,CAAA,CACzD;;WACL,kBAAC,MAAD;YAAI,WAAU;sBACZ,kBAAC,KAAD;aAAG,WAAU;uBAAW,EAAI;aAAa,CAAA;YACtC,CAAA;WACL,kBAAC,MAAD;YAAI,WAAU;sBACX,IAAI,KAAK,EAAI,KAAK,CAAC,oBAAoB;YACrC,CAAA;WACL,kBAAC,MAAD;YAAI,WAAU;sBACX,EAAI,iBACD,IAAI,KAAK,EAAI,eAAe,CAAC,oBAAoB,GACjD;YACD,CAAA;WACL,kBAAC,MAAD;YAAI,WAAU;sBAA0B,EAAI;YAAe,CAAA;WAC3D,kBAAC,MAAD;YAAI,WAAU;sBACZ,kBAAC,GAAD;aAAO,SAAS,EAAa,EAAI,WAAW;uBACzC,EAAI;aACC,CAAA;YACL,CAAA;WACF;YAnCI,EAAI,GAmCR,CACL,EACI,CAAA,CACF;YACP,EAAQ,WAAW,KAClB,kBAAC,GAAD;SACE,cAAc,IAAc,iBAAiB;SAC7C,OAAO,IAAc,wBAAwB;SAC7C,aACE,IACI,yDACA;SAEN,CAAA,CAEA;;OACM,CAAA,EACT,CAAA;MACK,EAxEI,EAwEJ;MAEhB,CACG;;GACH"}
1	+ {"version":3,"file":"AssetsAssetCheckInOutPage.js","names":[],"sources":["../../../src/assethandler/pages/AssetsAssetCheckInOutPage.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\nimport {\n Badge,\n Button,\n Card,\n CardContent,\n Input,\n Tabs,\n TabsContent,\n TabsList,\n TabsTrigger,\n GradientText,\n EmphasisPanel,\n PagePurpose,\n IllustratedEmptyState,\n} from '@burdenoff/fe-libs/ui';\nimport { ArrowDownToLine, ArrowUpFromLine, Clock, Search, AlertTriangle } from 'lucide-react';\nimport { gql } from '@apollo/client';\nimport { useMutation, useQuery } from '@apollo/client/react';\nimport { useAssetHandlerStore } from '../store/assethandlerStore';\nimport { notify } from '../utils/toast';\n\n// ─── Backend types (mirror wspace-assethandler-svc AssetAssignment) ───────────\ntype AssignmentStatus = 'CHECKED_OUT' \| 'OVERDUE' \| 'RETURNED';\n\ninterface AssetAssignment {\n id: string;\n assetId: string;\n assetName: string;\n assignedTo: string;\n assignedBy: string;\n checkedOutAt: string;\n dueAt: string \| null;\n checkedInAt: string \| null;\n status: AssignmentStatus;\n notes: string \| null;\n}\n\nconst ASSET_ASSIGNMENTS_QUERY = gql`\n query AssetHandlerAssetAssignments {\n assetAssignments {\n id\n assetId\n assetName\n assignedTo\n assignedBy\n checkedOutAt\n dueAt\n checkedInAt\n status\n notes\n }\n }\n`;\n\nconst CHECK_OUT_ASSET_MUTATION = gql`\n mutation AssetHandlerCheckOutAsset($input: CheckOutAssetInput!) {\n checkOutAsset(input: $input) {\n id\n status\n }\n }\n`;\n\nconst CHECK_IN_ASSET_MUTATION = gql`\n mutation AssetHandlerCheckInAsset($input: CheckInAssetInput!) {\n checkInAsset(input: $input) {\n id\n status\n }\n }\n`;\n\nconst statusColors: Record<AssignmentStatus, 'default' \| 'secondary' \| 'destructive' \| 'outline'> = {\n CHECKED_OUT: 'default',\n RETURNED: 'secondary',\n OVERDUE: 'destructive',\n};\n\nconst statusLabels: Record<AssignmentStatus, string> = {\n CHECKED_OUT: 'checked out',\n RETURNED: 'returned',\n OVERDUE: 'overdue',\n};\n\nexport function AssetsAssetCheckInOutPage() {\n const { assets } = useAssetHandlerStore();\n const [searchQuery, setSearchQuery] = useState('');\n const [showCheckout, setShowCheckout] = useState(false);\n const [assetId, setAssetId] = useState('');\n const [assignedTo, setAssignedTo] = useState('');\n const [dueAt, setDueAt] = useState('');\n const [notes, setNotes] = useState('');\n\n const { data, loading, refetch } = useQuery<{ assetAssignments: AssetAssignment[] }>(\n ASSET_ASSIGNMENTS_QUERY,\n { fetchPolicy: 'cache-and-network' }\n );\n\n const [checkOutAsset, { loading: checkingOut }] = useMutation(CHECK_OUT_ASSET_MUTATION, {\n onCompleted: () => {\n notify.success('Asset checked out', 'The assignment has been recorded.');\n setShowCheckout(false);\n setAssetId('');\n setAssignedTo('');\n setDueAt('');\n setNotes('');\n void refetch();\n },\n onError: (error) => notify.error('Check-out failed', error.message),\n });\n\n const [checkInAsset, { loading: checkingIn }] = useMutation(CHECK_IN_ASSET_MUTATION, {\n onCompleted: () => {\n notify.success('Asset checked in', 'The asset has been returned.');\n void refetch();\n },\n onError: (error) => notify.error('Check-in failed', error.message),\n });\n\n const assignments = useMemo(() => data?.assetAssignments ?? [], [data]);\n\n const activeCheckouts = assignments.filter((a) => a.status === 'CHECKED_OUT');\n const overdueCheckouts = assignments.filter((a) => a.status === 'OVERDUE');\n const returnedRecords = assignments.filter((a) => a.status === 'RETURNED');\n\n const filteredRecords = assignments.filter(\n (a) =>\n searchQuery === '' \|\|\n a.assetName.toLowerCase().includes(searchQuery.toLowerCase()) \|\|\n a.assignedTo.toLowerCase().includes(searchQuery.toLowerCase())\n );\n\n const submitCheckout = (event: React.FormEvent) => {\n event.preventDefault();\n if (!assetId \|\| !assignedTo.trim()) {\n notify.warning('Missing details', 'Choose an asset and who is receiving it.');\n return;\n }\n void checkOutAsset({\n variables: {\n input: {\n assetId,\n assignedTo: assignedTo.trim(),\n dueAt: dueAt ? new Date(dueAt).toISOString() : null,\n notes: notes.trim() \|\| null,\n },\n },\n });\n };\n\n return (\n <div className=\"space-y-6 p-6\">\n <div className=\"flex items-center justify-between\">\n <div>\n <h1 className=\"text-2xl font-bold\">\n <GradientText>Asset Check-In / Check-Out</GradientText>\n </h1>\n <p className=\"text-sm text-text-secondary\">Manage asset assignments and returns</p>\n </div>\n <div className=\"flex gap-2\">\n <Button size=\"sm\" onClick={() => setShowCheckout((v) => !v)}>\n <ArrowUpFromLine className=\"mr-2 h-4 w-4\" />\n Check Out\n </Button>\n </div>\n </div>\n\n <PagePurpose>\n Know who has what, right now. Check assets out to people for a job or loan period and check\n them back in on return. Use it to chase overdue items and make sure nothing walks off\n without a trace.\n </PagePurpose>\n\n {showCheckout && (\n <EmphasisPanel>\n <h2 className=\"text-sm font-semibold mb-3\">Check out an asset</h2>\n <form className=\"grid gap-3 md:grid-cols-2 lg:grid-cols-4\" onSubmit={submitCheckout}>\n <select\n className=\"rounded-md border px-3 py-2 bg-bg-base\"\n value={assetId}\n onChange={(event) => setAssetId(event.target.value)}\n aria-label=\"Asset to check out\"\n >\n <option value=\"\">Select an asset…</option>\n {assets.map((asset) => (\n <option key={asset.id} value={asset.id}>\n {asset.name} ({asset.assetTag})\n </option>\n ))}\n </select>\n <Input\n placeholder=\"Assign to (name or email)\"\n value={assignedTo}\n onChange={(event) => setAssignedTo(event.target.value)}\n />\n <Input\n type=\"date\"\n aria-label=\"Due date\"\n value={dueAt}\n onChange={(event) => setDueAt(event.target.value)}\n />\n <Input\n placeholder=\"Notes (optional)\"\n value={notes}\n onChange={(event) => setNotes(event.target.value)}\n />\n <div className=\"md:col-span-2 lg:col-span-4 flex gap-2\">\n <Button type=\"submit\" size=\"sm\" disabled={checkingOut}>\n {checkingOut ? 'Checking out…' : 'Confirm check-out'}\n </Button>\n <Button\n type=\"button\"\n variant=\"outline\"\n size=\"sm\"\n onClick={() => setShowCheckout(false)}\n >\n Cancel\n </Button>\n </div>\n </form>\n </EmphasisPanel>\n )}\n\n <div className=\"grid gap-4 md:grid-cols-4\">\n <EmphasisPanel>\n <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <ArrowUpFromLine className=\"h-4 w-4\" />\n Active Checkouts\n </div>\n <p className=\"text-2xl font-bold mt-1 tabular-nums\">{activeCheckouts.length}</p>\n </EmphasisPanel>\n <Card>\n <CardContent className=\"pt-4\">\n <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <AlertTriangle className=\"h-4 w-4 text-status-error-text\" />\n Overdue\n </div>\n <p className=\"text-2xl font-bold mt-1 text-status-error-text\">\n {overdueCheckouts.length}\n </p>\n </CardContent>\n </Card>\n <Card>\n <CardContent className=\"pt-4\">\n <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <ArrowDownToLine className=\"h-4 w-4\" />\n Returned\n </div>\n <p className=\"text-2xl font-bold mt-1\">{returnedRecords.length}</p>\n </CardContent>\n </Card>\n <Card>\n <CardContent className=\"pt-4\">\n <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <Clock className=\"h-4 w-4\" />\n Total Records\n </div>\n <p className=\"text-2xl font-bold mt-1\">{assignments.length}</p>\n </CardContent>\n </Card>\n </div>\n\n <div className=\"relative max-w-md\">\n <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n <Input\n placeholder=\"Search by asset or person…\"\n value={searchQuery}\n onChange={(e) => setSearchQuery(e.target.value)}\n className=\"pl-9\"\n />\n </div>\n\n <Tabs defaultValue=\"all\">\n <TabsList>\n <TabsTrigger value=\"all\">All ({filteredRecords.length})</TabsTrigger>\n <TabsTrigger value=\"active\">Active ({activeCheckouts.length})</TabsTrigger>\n <TabsTrigger value=\"overdue\">Overdue ({overdueCheckouts.length})</TabsTrigger>\n <TabsTrigger value=\"returned\">Returned ({returnedRecords.length})</TabsTrigger>\n </TabsList>\n {(\n [\n ['all', null],\n ['active', 'CHECKED_OUT'],\n ['overdue', 'OVERDUE'],\n ['returned', 'RETURNED'],\n ] as const\n ).map(([tab, status]) => {\n const records =\n status === null ? filteredRecords : filteredRecords.filter((r) => r.status === status);\n return (\n <TabsContent key={tab} value={tab} className=\"mt-4\">\n <Card>\n <CardContent className=\"p-0\">\n <div className=\"overflow-x-auto\">\n <table className=\"w-full text-sm\">\n <thead>\n <tr className=\"border-b bg-bg-sunken/50\">\n <th className=\"text-left p-3 font-medium\">Asset</th>\n <th className=\"text-left p-3 font-medium\">Assigned To</th>\n <th className=\"text-left p-3 font-medium\">Checked Out</th>\n <th className=\"text-left p-3 font-medium\">Due</th>\n <th className=\"text-left p-3 font-medium\">Returned</th>\n <th className=\"text-left p-3 font-medium\">Status</th>\n <th className=\"text-right p-3 font-medium\">Action</th>\n </tr>\n </thead>\n <tbody>\n {records.map((rec) => (\n <tr key={rec.id} className=\"border-b hover:bg-bg-sunken/50\">\n <td className=\"p-3\">\n <p className=\"font-medium\">{rec.assetName}</p>\n <p className=\"text-xs text-text-secondary\">{rec.assetId}</p>\n </td>\n <td className=\"p-3\">\n <p className=\"text-sm\">{rec.assignedTo}</p>\n <p className=\"text-xs text-text-secondary\">by {rec.assignedBy}</p>\n </td>\n <td className=\"p-3 text-xs\">\n {new Date(rec.checkedOutAt).toLocaleDateString()}\n </td>\n <td className=\"p-3 text-xs\">\n {rec.dueAt ? new Date(rec.dueAt).toLocaleDateString() : '—'}\n </td>\n <td className=\"p-3 text-xs\">\n {rec.checkedInAt\n ? new Date(rec.checkedInAt).toLocaleDateString()\n : '—'}\n </td>\n <td className=\"p-3\">\n <Badge variant={statusColors[rec.status]}>\n {statusLabels[rec.status]}\n </Badge>\n </td>\n <td className=\"p-3 text-right\">\n {rec.status !== 'RETURNED' ? (\n <Button\n size=\"sm\"\n variant=\"outline\"\n disabled={checkingIn}\n onClick={() =>\n void checkInAsset({\n variables: { input: { assignmentId: rec.id } },\n })\n }\n >\n <ArrowDownToLine className=\"mr-1.5 h-3.5 w-3.5\" />\n Check In\n </Button>\n ) : null}\n </td>\n </tr>\n ))}\n </tbody>\n </table>\n {records.length === 0 && !loading && (\n <IllustratedEmptyState\n illustration={searchQuery ? 'empty-search' : 'empty-people'}\n title={searchQuery ? 'No matching records' : 'No check-in / out records'}\n description={\n searchQuery\n ? 'No records match your search — try a different name.'\n : 'Check an asset out to someone and the activity will appear here.'\n }\n />\n )}\n {loading && records.length === 0 ? (\n <div className=\"space-y-2 p-4\">\n {Array.from({ length: 4 }).map((_, i) => (\n <div\n key={i}\n className=\"h-8 rounded-md bg-bg-sunken motion-safe:animate-vc-shimmer\"\n />\n ))}\n </div>\n ) : null}\n </div>\n </CardContent>\n </Card>\n </TabsContent>\n );\n })}\n </Tabs>\n </div>\n );\n}\n"],"mappings":"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"}