@burdenoff/microfe-assethandler 2026.703.2 → 2026.703.4

package/dist/assethandler/pages/SecuritySecurityEventDetailPage.js

@@ -1,8 +1,9 @@
 import { useAssetHandlerStore as e } from "../store/assethandlerStore.js";
-import { ArrowLeft as t, CheckCircle as n } from "lucide-react";
-import { useNavigate as r, useParams as i } from "react-router-dom";
-import { Badge as a, Button as o, Card as s, CardContent as c, CardHeader as l, CardTitle as u, EmphasisPanel as d, GradientText as f, IllustratedEmptyState as p, PagePurpose as m, Separator as h } from "@burdenoff/fe-libs/ui";
-import { jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { useAssetHandlerNavigate as t } from "../hooks/useAssetHandlerNavigate.js";
+import { ArrowLeft as n, CheckCircle as r } from "lucide-react";
+import { useParams as i } from "react-router-dom";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Badge as s, Button as c, Card as l, CardContent as u, CardHeader as d, CardTitle as f, EmphasisPanel as p, GradientText as m, IllustratedEmptyState as h, PagePurpose as g, Separator as _ } from "@burdenoff/fe-libs/ui";
 //#region src/assethandler/pages/SecuritySecurityEventDetailPage.tsx
 var v = {
 	critical: "destructive",
@@ -12,101 +13,101 @@ var v = {
 	info: "outline"
 };
 function y() {
-	let y = r(), { eventId: b } = i(), { securityEvents: x } = e(), S = x.find((e) => e.id === b) ?? x[0];
-	return S ? /* @__PURE__ */ _("div", {
+	let y = t(), { eventId: b } = i(), { securityEvents: x } = e(), S = x.find((e) => e.id === b) ?? x[0];
+	return S ? /* @__PURE__ */ o("div", {
 		className: "space-y-6 p-6",
 		children: [
-			/* @__PURE__ */ _("div", {
+			/* @__PURE__ */ o("div", {
 				className: "flex items-center justify-between",
-				children: [/* @__PURE__ */ _("div", {
+				children: [/* @__PURE__ */ o("div", {
 					className: "flex items-center gap-4",
-					children: [/* @__PURE__ */ g(o, {
+					children: [/* @__PURE__ */ a(c, {
 						variant: "ghost",
 						size: "icon",
 						onClick: () => y("/security/security-hub"),
-						children: /* @__PURE__ */ g(t, { className: "h-4 w-4" })
-					}), /* @__PURE__ */ _("div", { children: [/* @__PURE__ */ _("div", {
+						children: /* @__PURE__ */ a(n, { className: "h-4 w-4" })
+					}), /* @__PURE__ */ o("div", { children: [/* @__PURE__ */ o("div", {
 						className: "flex items-center gap-3",
 						children: [
-							/* @__PURE__ */ g("h1", {
+							/* @__PURE__ */ a("h1", {
 								className: "text-2xl font-bold",
-								children: /* @__PURE__ */ g(f, { children: S.id })
+								children: /* @__PURE__ */ a(m, { children: S.id })
 							}),
-							/* @__PURE__ */ g(a, {
+							/* @__PURE__ */ a(s, {
 								variant: v[S.severity],
 								children: S.severity
 							}),
-							S.resolved ? /* @__PURE__ */ g(a, {
+							S.resolved ? /* @__PURE__ */ a(s, {
 								variant: "default",
 								children: "Resolved"
-							}) : /* @__PURE__ */ g(a, {
+							}) : /* @__PURE__ */ a(s, {
 								variant: "destructive",
 								children: "Open"
 							})
 						]
-					}), /* @__PURE__ */ g("p", {
+					}), /* @__PURE__ */ a("p", {
 						className: "text-sm text-text-secondary mt-1",
 						children: S.title
 					})] })]
-				}), !S.resolved && /* @__PURE__ */ _(o, {
+				}), !S.resolved && /* @__PURE__ */ o(c, {
 					size: "sm",
-					children: [/* @__PURE__ */ g(n, { className: "mr-2 h-4 w-4" }), "Mark Resolved"]
+					children: [/* @__PURE__ */ a(r, { className: "mr-2 h-4 w-4" }), "Mark Resolved"]
 				})]
 			}),
-			/* @__PURE__ */ g(m, { children: "The full forensic picture of a single security event — what happened, where it came from, who or what was involved, and how serious it is. Use this page to investigate, confirm the impact and mark it resolved once handled." }),
-			/* @__PURE__ */ _("div", {
+			/* @__PURE__ */ a(g, { children: "The full forensic picture of a single security event — what happened, where it came from, who or what was involved, and how serious it is. Use this page to investigate, confirm the impact and mark it resolved once handled." }),
+			/* @__PURE__ */ o("div", {
 				className: "grid gap-6 lg:grid-cols-3",
-				children: [/* @__PURE__ */ _(d, {
+				children: [/* @__PURE__ */ o(p, {
 					className: "lg:col-span-2",
-					children: [/* @__PURE__ */ g(l, {
+					children: [/* @__PURE__ */ a(d, {
 						className: "px-0 pt-0",
-						children: /* @__PURE__ */ g(u, { children: "Event Details" })
-					}), /* @__PURE__ */ _(c, {
+						children: /* @__PURE__ */ a(f, { children: "Event Details" })
+					}), /* @__PURE__ */ o(u, {
 						className: "space-y-4 px-0 pb-0",
 						children: [
-							/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("h4", {
+							/* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("h4", {
 								className: "text-sm font-medium text-text-secondary",
 								children: "Description"
-							}), /* @__PURE__ */ g("p", {
+							}), /* @__PURE__ */ a("p", {
 								className: "text-sm mt-1",
 								children: S.description
 							})] }),
-							/* @__PURE__ */ g(h, {}),
-							/* @__PURE__ */ _("div", {
+							/* @__PURE__ */ a(_, {}),
+							/* @__PURE__ */ o("div", {
 								className: "grid grid-cols-2 gap-4 text-sm",
 								children: [
-									/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("span", {
+									/* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("span", {
 										className: "text-text-secondary",
 										children: "Type"
-									}), /* @__PURE__ */ g("p", {
+									}), /* @__PURE__ */ a("p", {
 										className: "font-medium capitalize",
 										children: S.type.replace("_", " ")
 									})] }),
-									/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("span", {
+									/* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("span", {
 										className: "text-text-secondary",
 										children: "Source"
-									}), /* @__PURE__ */ g("p", {
+									}), /* @__PURE__ */ a("p", {
 										className: "font-medium",
 										children: S.source
 									})] }),
-									/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("span", {
+									/* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("span", {
 										className: "text-text-secondary",
 										children: "Timestamp"
-									}), /* @__PURE__ */ g("p", {
+									}), /* @__PURE__ */ a("p", {
 										className: "font-medium",
 										children: new Date(S.timestamp).toLocaleString()
 									})] }),
-									S.userId && /* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("span", {
+									S.userId && /* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("span", {
 										className: "text-text-secondary",
 										children: "User"
-									}), /* @__PURE__ */ g("p", {
+									}), /* @__PURE__ */ a("p", {
 										className: "font-medium",
 										children: S.userId
 									})] }),
-									S.ipAddress && /* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("span", {
+									S.ipAddress && /* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("span", {
 										className: "text-text-secondary",
 										children: "IP Address"
-									}), /* @__PURE__ */ g("p", {
+									}), /* @__PURE__ */ a("p", {
 										className: "font-mono text-xs",
 										children: S.ipAddress
 									})] })
@@ -114,28 +115,28 @@ function y() {
 							})
 						]
 					})]
-				}), /* @__PURE__ */ _(s, { children: [/* @__PURE__ */ g(l, { children: /* @__PURE__ */ g(u, {
+				}), /* @__PURE__ */ o(l, { children: [/* @__PURE__ */ a(d, { children: /* @__PURE__ */ a(f, {
 					className: "text-base",
 					children: "Severity Assessment"
-				}) }), /* @__PURE__ */ g(c, { children: /* @__PURE__ */ _("div", {
+				}) }), /* @__PURE__ */ a(u, { children: /* @__PURE__ */ o("div", {
 					className: `p-4 rounded-lg text-center ${S.severity === "critical" ? "bg-status-error-bg-subtle text-status-error-text" : S.severity === "high" || S.severity === "medium" ? "bg-status-warning-bg-subtle text-status-warning-text" : "bg-status-info-bg-subtle text-status-info-text"}`,
-					children: [/* @__PURE__ */ g("p", {
+					children: [/* @__PURE__ */ a("p", {
 						className: "text-2xl font-bold uppercase",
 						children: S.severity
-					}), /* @__PURE__ */ g("p", {
+					}), /* @__PURE__ */ a("p", {
 						className: "text-xs mt-1",
 						children: "Severity Level"
 					})]
 				}) })] })]
 			})
 		]
-	}) : /* @__PURE__ */ g("div", {
+	}) : /* @__PURE__ */ a("div", {
 		className: "p-6",
-		children: /* @__PURE__ */ g(p, {
+		children: /* @__PURE__ */ a(h, {
 			illustration: "empty-search",
 			title: "Security event not found",
 			description: "This event may have been resolved or removed. Return to the security hub to find it.",
-			action: /* @__PURE__ */ g(o, {
+			action: /* @__PURE__ */ a(c, {
 				size: "sm",
 				onClick: () => y("/security/security-hub"),
 				children: "Back to security"

package/dist/assethandler/pages/SecuritySecurityEventDetailPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"SecuritySecurityEventDetailPage.js","names":[],"sources":["../../../src/assethandler/pages/SecuritySecurityEventDetailPage.tsx"],"sourcesContent":["import {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  Separator,\n  GradientText,\n  EmphasisPanel,\n  PagePurpose,\n  IllustratedEmptyState,\n} from '@burdenoff/fe-libs/ui';\nimport { ArrowLeft, CheckCircle } from 'lucide-react';\nimport { useNavigate, useParams } from 'react-router-dom';\nimport { useAssetHandlerStore } from '../store/assethandlerStore';\n\nconst severityColors: Record<string, 'destructive' | 'default' | 'secondary' | 'outline'> = {\n  critical: 'destructive',\n  high: 'destructive',\n  medium: 'default',\n  low: 'secondary',\n  info: 'outline',\n};\n\nexport function SecuritySecurityEventDetailPage() {\n  const navigate = useNavigate();\n  const { eventId } = useParams<{ eventId: string }>();\n  const { securityEvents } = useAssetHandlerStore();\n  const event = securityEvents.find((item) => item.id === eventId) ?? securityEvents[0];\n\n  if (!event)\n    return (\n      <div className=\"p-6\">\n        <IllustratedEmptyState\n          illustration=\"empty-search\"\n          title=\"Security event not found\"\n          description=\"This event may have been resolved or removed. Return to the security hub to find it.\"\n          action={\n            <Button size=\"sm\" onClick={() => navigate('/security/security-hub')}>\n              Back to security\n            </Button>\n          }\n        />\n      </div>\n    );\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div className=\"flex items-center gap-4\">\n          <Button variant=\"ghost\" size=\"icon\" onClick={() => navigate('/security/security-hub')}>\n            <ArrowLeft className=\"h-4 w-4\" />\n          </Button>\n          <div>\n            <div className=\"flex items-center gap-3\">\n              <h1 className=\"text-2xl font-bold\">\n                <GradientText>{event.id}</GradientText>\n              </h1>\n              <Badge variant={severityColors[event.severity]}>{event.severity}</Badge>\n              {event.resolved ? (\n                <Badge variant=\"default\">Resolved</Badge>\n              ) : (\n                <Badge variant=\"destructive\">Open</Badge>\n              )}\n            </div>\n            <p className=\"text-sm text-text-secondary mt-1\">{event.title}</p>\n          </div>\n        </div>\n        {!event.resolved && (\n          <Button size=\"sm\">\n            <CheckCircle className=\"mr-2 h-4 w-4\" />\n            Mark Resolved\n          </Button>\n        )}\n      </div>\n\n      <PagePurpose>\n        The full forensic picture of a single security event — what happened, where it came from,\n        who or what was involved, and how serious it is. Use this page to investigate, confirm the\n        impact and mark it resolved once handled.\n      </PagePurpose>\n\n      <div className=\"grid gap-6 lg:grid-cols-3\">\n        <EmphasisPanel className=\"lg:col-span-2\">\n          <CardHeader className=\"px-0 pt-0\">\n            <CardTitle>Event Details</CardTitle>\n          </CardHeader>\n          <CardContent className=\"space-y-4 px-0 pb-0\">\n            <div>\n              <h4 className=\"text-sm font-medium text-text-secondary\">Description</h4>\n              <p className=\"text-sm mt-1\">{event.description}</p>\n            </div>\n            <Separator />\n            <div className=\"grid grid-cols-2 gap-4 text-sm\">\n              <div>\n                <span className=\"text-text-secondary\">Type</span>\n                <p className=\"font-medium capitalize\">{event.type.replace('_', ' ')}</p>\n              </div>\n              <div>\n                <span className=\"text-text-secondary\">Source</span>\n                <p className=\"font-medium\">{event.source}</p>\n              </div>\n              <div>\n                <span className=\"text-text-secondary\">Timestamp</span>\n                <p className=\"font-medium\">{new Date(event.timestamp).toLocaleString()}</p>\n              </div>\n              {event.userId && (\n                <div>\n                  <span className=\"text-text-secondary\">User</span>\n                  <p className=\"font-medium\">{event.userId}</p>\n                </div>\n              )}\n              {event.ipAddress && (\n                <div>\n                  <span className=\"text-text-secondary\">IP Address</span>\n                  <p className=\"font-mono text-xs\">{event.ipAddress}</p>\n                </div>\n              )}\n            </div>\n          </CardContent>\n        </EmphasisPanel>\n\n        <Card>\n          <CardHeader>\n            <CardTitle className=\"text-base\">Severity Assessment</CardTitle>\n          </CardHeader>\n          <CardContent>\n            <div\n              className={`p-4 rounded-lg text-center ${event.severity === 'critical' ? 'bg-status-error-bg-subtle text-status-error-text' : event.severity === 'high' ? 'bg-status-warning-bg-subtle text-status-warning-text' : event.severity === 'medium' ? 'bg-status-warning-bg-subtle text-status-warning-text' : 'bg-status-info-bg-subtle text-status-info-text'}`}\n            >\n              <p className=\"text-2xl font-bold uppercase\">{event.severity}</p>\n              <p className=\"text-xs mt-1\">Severity Level</p>\n            </div>\n          </CardContent>\n        </Card>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"SecuritySecurityEventDetailPage.js","names":[],"sources":["../../../src/assethandler/pages/SecuritySecurityEventDetailPage.tsx"],"sourcesContent":["import { useAssetHandlerNavigate } from '../hooks/useAssetHandlerNavigate';\nimport {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  Separator,\n  GradientText,\n  EmphasisPanel,\n  PagePurpose,\n  IllustratedEmptyState,\n} from '@burdenoff/fe-libs/ui';\nimport { ArrowLeft, CheckCircle } from 'lucide-react';\nimport { useParams } from 'react-router-dom';\nimport { useAssetHandlerStore } from '../store/assethandlerStore';\n\nconst severityColors: Record<string, 'destructive' | 'default' | 'secondary' | 'outline'> = {\n  critical: 'destructive',\n  high: 'destructive',\n  medium: 'default',\n  low: 'secondary',\n  info: 'outline',\n};\n\nexport function SecuritySecurityEventDetailPage() {\n  const navigate = useAssetHandlerNavigate();\n  const { eventId } = useParams<{ eventId: string }>();\n  const { securityEvents } = useAssetHandlerStore();\n  const event = securityEvents.find((item) => item.id === eventId) ?? securityEvents[0];\n\n  if (!event)\n    return (\n      <div className=\"p-6\">\n        <IllustratedEmptyState\n          illustration=\"empty-search\"\n          title=\"Security event not found\"\n          description=\"This event may have been resolved or removed. Return to the security hub to find it.\"\n          action={\n            <Button size=\"sm\" onClick={() => navigate('/security/security-hub')}>\n              Back to security\n            </Button>\n          }\n        />\n      </div>\n    );\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div className=\"flex items-center gap-4\">\n          <Button variant=\"ghost\" size=\"icon\" onClick={() => navigate('/security/security-hub')}>\n            <ArrowLeft className=\"h-4 w-4\" />\n          </Button>\n          <div>\n            <div className=\"flex items-center gap-3\">\n              <h1 className=\"text-2xl font-bold\">\n                <GradientText>{event.id}</GradientText>\n              </h1>\n              <Badge variant={severityColors[event.severity]}>{event.severity}</Badge>\n              {event.resolved ? (\n                <Badge variant=\"default\">Resolved</Badge>\n              ) : (\n                <Badge variant=\"destructive\">Open</Badge>\n              )}\n            </div>\n            <p className=\"text-sm text-text-secondary mt-1\">{event.title}</p>\n          </div>\n        </div>\n        {!event.resolved && (\n          <Button size=\"sm\">\n            <CheckCircle className=\"mr-2 h-4 w-4\" />\n            Mark Resolved\n          </Button>\n        )}\n      </div>\n\n      <PagePurpose>\n        The full forensic picture of a single security event — what happened, where it came from,\n        who or what was involved, and how serious it is. Use this page to investigate, confirm the\n        impact and mark it resolved once handled.\n      </PagePurpose>\n\n      <div className=\"grid gap-6 lg:grid-cols-3\">\n        <EmphasisPanel className=\"lg:col-span-2\">\n          <CardHeader className=\"px-0 pt-0\">\n            <CardTitle>Event Details</CardTitle>\n          </CardHeader>\n          <CardContent className=\"space-y-4 px-0 pb-0\">\n            <div>\n              <h4 className=\"text-sm font-medium text-text-secondary\">Description</h4>\n              <p className=\"text-sm mt-1\">{event.description}</p>\n            </div>\n            <Separator />\n            <div className=\"grid grid-cols-2 gap-4 text-sm\">\n              <div>\n                <span className=\"text-text-secondary\">Type</span>\n                <p className=\"font-medium capitalize\">{event.type.replace('_', ' ')}</p>\n              </div>\n              <div>\n                <span className=\"text-text-secondary\">Source</span>\n                <p className=\"font-medium\">{event.source}</p>\n              </div>\n              <div>\n                <span className=\"text-text-secondary\">Timestamp</span>\n                <p className=\"font-medium\">{new Date(event.timestamp).toLocaleString()}</p>\n              </div>\n              {event.userId && (\n                <div>\n                  <span className=\"text-text-secondary\">User</span>\n                  <p className=\"font-medium\">{event.userId}</p>\n                </div>\n              )}\n              {event.ipAddress && (\n                <div>\n                  <span className=\"text-text-secondary\">IP Address</span>\n                  <p className=\"font-mono text-xs\">{event.ipAddress}</p>\n                </div>\n              )}\n            </div>\n          </CardContent>\n        </EmphasisPanel>\n\n        <Card>\n          <CardHeader>\n            <CardTitle className=\"text-base\">Severity Assessment</CardTitle>\n          </CardHeader>\n          <CardContent>\n            <div\n              className={`p-4 rounded-lg text-center ${event.severity === 'critical' ? 'bg-status-error-bg-subtle text-status-error-text' : event.severity === 'high' ? 'bg-status-warning-bg-subtle text-status-warning-text' : event.severity === 'medium' ? 'bg-status-warning-bg-subtle text-status-warning-text' : 'bg-status-info-bg-subtle text-status-info-text'}`}\n            >\n              <p className=\"text-2xl font-bold uppercase\">{event.severity}</p>\n              <p className=\"text-xs mt-1\">Severity Level</p>\n            </div>\n          </CardContent>\n        </Card>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}