@burdenoff/microfe-movethewheels 2026.1031.6 → 2026.1101.1

package/dist/pages/IntegrationsPage.js

@@ -0,0 +1,616 @@
+import { Activity as e } from "../node_modules/lucide-react/dist/esm/icons/activity.js";
+import { Check as t } from "../node_modules/lucide-react/dist/esm/icons/check.js";
+import { ChevronDown as n } from "../node_modules/lucide-react/dist/esm/icons/chevron-down.js";
+import { ChevronUp as r } from "../node_modules/lucide-react/dist/esm/icons/chevron-up.js";
+import { Copy as i } from "../node_modules/lucide-react/dist/esm/icons/copy.js";
+import { KeyRound as a } from "../node_modules/lucide-react/dist/esm/icons/key-round.js";
+import { Pause as o } from "../node_modules/lucide-react/dist/esm/icons/pause.js";
+import { Play as s } from "../node_modules/lucide-react/dist/esm/icons/play.js";
+import { Plug as c } from "../node_modules/lucide-react/dist/esm/icons/plug.js";
+import { Plus as l } from "../node_modules/lucide-react/dist/esm/icons/plus.js";
+import { RefreshCw as u } from "../node_modules/lucide-react/dist/esm/icons/refresh-cw.js";
+import { ShieldCheck as d } from "../node_modules/lucide-react/dist/esm/icons/shield-check.js";
+import { Trash2 as f } from "../node_modules/lucide-react/dist/esm/icons/trash-2.js";
+import { useMoveTheWheels as p } from "../providers/MoveTheWheelsProvider.js";
+import { formatDateTime as m } from "../utils/formatters.js";
+import { Badge as h, Button as g, Card as _, CardContent as v, Input as y, Label as b, Select as ee, SelectContent as te, SelectItem as x, SelectTrigger as ne, SelectValue as re, Skeleton as S } from "../components/ui.js";
+import { PageLayout as ie } from "../components/PageLayout.js";
+import { MetricCard as C, MetricGrid as ae } from "../components/MetricCard.js";
+import { FormError as w } from "../components/FormError.js";
+import { Notice as oe, useNotice as se } from "../components/Notice.js";
+import { INTEGRATION_STATUSES as ce, ROADMAP_PROVIDERS as T, SIGNATURE_HEADER as le, TRACKING_EVENT_TYPES as ue, curlExample as E, eventStatusTone as D, examplePayload as O, generateSigningSecret as k, humanize as A, integrationNameError as j, integrationStatusTone as M, signingSecretError as N, statusExplanation as P, webhookUrl as de } from "../utils/carrierIntegrations.js";
+import { useCarrierIntegrationActions as F, useCarrierIntegrationCounts as fe, useCarrierIntegrationEvents as I, useCarrierIntegrations as pe } from "../hooks/useCarrierIntegrations.js";
+import { useEffect as me, useRef as he, useState as L } from "react";
+import { jsx as R, jsxs as z } from "react/jsx-runtime";
+import { CTAOverflowMenu as ge, PagePurpose as _e, ResponsiveDialog as B, ResponsiveDialogContent as V, ResponsiveDialogDescription as H, ResponsiveDialogFooter as U, ResponsiveDialogHeader as W, ResponsiveDialogTitle as G } from "@burdenoff/fe-libs/ui";
+//#region src/movethewheels/pages/IntegrationsPage.tsx
+var K = 20, q = "ALL";
+function J(e, t) {
+	return e instanceof Error && e.message ? e.message : t;
+}
+function Y({ label: e, value: n, multiline: r }) {
+	let [a, o] = L(!1), s = async () => {
+		try {
+			await navigator.clipboard.writeText(n), o(!0), window.setTimeout(() => o(!1), 2e3);
+		} catch {
+			o(!1);
+		}
+	};
+	return /* @__PURE__ */ z("div", {
+		className: "space-y-1",
+		children: [/* @__PURE__ */ z("div", {
+			className: "flex items-center justify-between gap-2",
+			children: [/* @__PURE__ */ R("span", {
+				className: "text-xs font-medium text-text-secondary",
+				children: e
+			}), /* @__PURE__ */ z(g, {
+				type: "button",
+				size: "sm",
+				variant: "ghost",
+				onClick: () => void s(),
+				"aria-label": `Copy ${e.toLowerCase()}`,
+				children: [R(a ? t : i, {
+					size: 14,
+					className: "mr-1"
+				}), a ? "Copied" : "Copy"]
+			})]
+		}), r ? /* @__PURE__ */ R("pre", {
+			className: "max-h-64 overflow-auto whitespace-pre-wrap break-all rounded-lg bg-bg-sunken px-3 py-2 font-mono text-xs text-text-primary",
+			children: n
+		}) : /* @__PURE__ */ R("code", {
+			className: "block break-all rounded-lg bg-bg-sunken px-3 py-2 font-mono text-xs text-text-primary",
+			children: n
+		})]
+	});
+}
+function ve({ secret: e, integrationName: t, onClose: n }) {
+	return /* @__PURE__ */ R(B, {
+		open: e !== null,
+		onOpenChange: (e) => !e && n(),
+		children: /* @__PURE__ */ z(V, { children: [
+			/* @__PURE__ */ z(W, { children: [/* @__PURE__ */ z(G, { children: ["Signing secret for ", t] }), /* @__PURE__ */ R(H, { children: "Copy it into the sending system now. MoveTheWheels stores it to verify deliveries but will not show it again; rotate it if it is lost." })] }),
+			e ? /* @__PURE__ */ R(Y, {
+				label: "Signing secret",
+				value: e
+			}, e) : null,
+			/* @__PURE__ */ R(U, { children: /* @__PURE__ */ R(g, {
+				onClick: n,
+				children: "I have saved it"
+			}) })
+		] })
+	});
+}
+function ye({ open: e, onOpenChange: t, onCreated: n }) {
+	let r = F(), [i, a] = L(""), [o, s] = L(() => k()), [c, l] = L(null), [d, f] = L(!1), p = () => {
+		a(""), s(k()), l(null);
+	}, m = async (e) => {
+		e.preventDefault();
+		let a = j(i) ?? N(o);
+		if (a) {
+			l(a);
+			return;
+		}
+		f(!0), l(null);
+		try {
+			n(await r.create({
+				provider: "GENERIC_WEBHOOK",
+				name: i,
+				apiSecret: o
+			}), o), p(), t(!1);
+		} catch (e) {
+			l(J(e, "Could not create the integration."));
+		} finally {
+			f(!1);
+		}
+	};
+	return /* @__PURE__ */ R(B, {
+		open: e,
+		onOpenChange: (e) => {
+			e || p(), t(e);
+		},
+		children: /* @__PURE__ */ R(V, { children: /* @__PURE__ */ z("form", {
+			onSubmit: (e) => void m(e),
+			className: "space-y-4",
+			children: [
+				/* @__PURE__ */ z(W, { children: [/* @__PURE__ */ R(G, { children: "Connect a tracking feed" }), /* @__PURE__ */ R(H, { children: "A signed webhook for a carrier, ELD or GPS provider. Updates it sends become tracking events on the matching shipments." })] }),
+				/* @__PURE__ */ z("div", {
+					className: "space-y-1.5",
+					children: [/* @__PURE__ */ R(b, {
+						htmlFor: "integration-name",
+						children: "Name"
+					}), /* @__PURE__ */ R(y, {
+						id: "integration-name",
+						value: i,
+						maxLength: 120,
+						placeholder: "e.g. Fleet GPS feed",
+						onChange: (e) => a(e.target.value),
+						autoFocus: !0
+					})]
+				}),
+				/* @__PURE__ */ z("div", {
+					className: "space-y-1.5",
+					children: [/* @__PURE__ */ R(b, { children: "Type" }), /* @__PURE__ */ R("p", {
+						className: "rounded-lg border border-border-default px-3 py-2 text-sm",
+						children: "Signed webhook (any carrier, ELD or GPS system that can send HTTPS POSTs)"
+					})]
+				}),
+				/* @__PURE__ */ z("div", {
+					className: "space-y-1.5",
+					children: [
+						/* @__PURE__ */ z("div", {
+							className: "flex items-center justify-between",
+							children: [/* @__PURE__ */ R(b, { children: "Signing secret" }), /* @__PURE__ */ z(g, {
+								type: "button",
+								size: "sm",
+								variant: "ghost",
+								onClick: () => s(k()),
+								children: [/* @__PURE__ */ R(u, {
+									size: 14,
+									className: "mr-1"
+								}), "Generate another"]
+							})]
+						}),
+						/* @__PURE__ */ R("code", {
+							className: "block break-all rounded-lg bg-bg-sunken px-3 py-2 font-mono text-xs",
+							children: o
+						}),
+						/* @__PURE__ */ R("p", {
+							className: "text-xs text-text-secondary",
+							children: "Generated in your browser. You can copy it on the next step."
+						})
+					]
+				}),
+				/* @__PURE__ */ R(w, { message: c }),
+				/* @__PURE__ */ z(U, { children: [/* @__PURE__ */ R(g, {
+					type: "button",
+					variant: "outline",
+					onClick: () => t(!1),
+					children: "Cancel"
+				}), /* @__PURE__ */ R(g, {
+					type: "submit",
+					disabled: d,
+					children: d ? "Connecting…" : "Connect"
+				})] })
+			]
+		}) })
+	});
+}
+function X({ integrationId: e, refreshKey: t }) {
+	let { events: n, isLoading: r, error: i } = I(e, t);
+	return /* @__PURE__ */ z("div", {
+		className: "space-y-2",
+		children: [
+			/* @__PURE__ */ R("p", {
+				className: "text-sm font-medium",
+				children: "Recent deliveries"
+			}),
+			/* @__PURE__ */ R(w, { message: i?.message }),
+			r && n.length === 0 ? /* @__PURE__ */ R(S, { className: "h-12 w-full" }) : n.length === 0 ? /* @__PURE__ */ R("p", {
+				className: "text-sm text-text-secondary",
+				children: "No deliveries yet. Send a signed test update with the example below."
+			}) : /* @__PURE__ */ R("ul", {
+				className: "space-y-2",
+				children: n.map((e) => /* @__PURE__ */ z("li", {
+					className: "flex flex-wrap items-start justify-between gap-3 rounded-lg bg-bg-sunken px-3 py-2",
+					children: [/* @__PURE__ */ z("div", {
+						className: "min-w-0",
+						children: [
+							/* @__PURE__ */ z("p", {
+								className: "text-sm font-medium",
+								children: [e.eventType ? A(e.eventType) : "Delivery", e.externalEventId ? /* @__PURE__ */ R("span", {
+									className: "ml-2 font-mono text-xs text-text-tertiary",
+									children: e.externalEventId
+								}) : null]
+							}),
+							/* @__PURE__ */ R("p", {
+								className: "text-xs text-text-secondary",
+								children: m(e.receivedAt)
+							}),
+							e.errorMessage ? /* @__PURE__ */ R("p", {
+								className: "mt-1 break-words text-xs text-status-error-text",
+								children: e.errorMessage
+							}) : null
+						]
+					}), /* @__PURE__ */ R(h, {
+						variant: D(e.status),
+						children: A(e.status)
+					})]
+				}, e.id))
+			})
+		]
+	});
+}
+function be({ url: e }) {
+	return /* @__PURE__ */ z("div", {
+		className: "space-y-3",
+		children: [
+			/* @__PURE__ */ R("p", {
+				className: "text-sm font-medium",
+				children: "How to send updates"
+			}),
+			/* @__PURE__ */ R(Y, {
+				label: "Webhook URL",
+				value: e
+			}),
+			/* @__PURE__ */ z("ul", {
+				className: "list-disc space-y-1 pl-5 text-xs text-text-secondary",
+				children: [
+					/* @__PURE__ */ z("li", { children: [
+						"POST JSON: one update object, or an array of up to ",
+						5,
+						"."
+					] }),
+					/* @__PURE__ */ z("li", { children: [
+						"Sign the exact raw body with HMAC-SHA256 using the signing secret and send the hex digest in the ",
+						/* @__PURE__ */ R("code", {
+							className: "font-mono",
+							children: le
+						}),
+						" header (a",
+						" ",
+						/* @__PURE__ */ R("code", {
+							className: "font-mono",
+							children: "sha256="
+						}),
+						" prefix is accepted)."
+					] }),
+					/* @__PURE__ */ z("li", { children: [
+						"Identify the shipment with ",
+						/* @__PURE__ */ R("code", {
+							className: "font-mono",
+							children: "trackingNumber"
+						}),
+						" or its",
+						" ",
+						/* @__PURE__ */ R("code", {
+							className: "font-mono",
+							children: "shipmentId"
+						}),
+						". Event types:",
+						" ",
+						ue.join(", "),
+						"."
+					] }),
+					/* @__PURE__ */ z("li", { children: [
+						"Send a stable ",
+						/* @__PURE__ */ R("code", {
+							className: "font-mono",
+							children: "externalEventId"
+						}),
+						" so retries are recorded once instead of twice."
+					] })
+				]
+			}),
+			/* @__PURE__ */ R(Y, {
+				label: "Example body",
+				value: O(),
+				multiline: !0
+			}),
+			/* @__PURE__ */ R(Y, {
+				label: "Example request",
+				value: E(e),
+				multiline: !0
+			})
+		]
+	});
+}
+function xe({ integration: e, url: t, expanded: i, refreshKey: c, busy: l, onToggle: u, onSetStatus: d, onRotate: p, onDelete: y }) {
+	let b = e.status === "ACTIVE";
+	return /* @__PURE__ */ R(_, { children: /* @__PURE__ */ z(v, {
+		className: "p-5",
+		children: [/* @__PURE__ */ z("div", {
+			className: "flex flex-wrap items-start justify-between gap-3",
+			children: [/* @__PURE__ */ z("div", {
+				className: "min-w-0 space-y-1",
+				children: [
+					/* @__PURE__ */ z("div", {
+						className: "flex flex-wrap items-center gap-2",
+						children: [/* @__PURE__ */ R("p", {
+							className: "text-base font-semibold",
+							children: e.name
+						}), /* @__PURE__ */ R(h, {
+							variant: M(e.status),
+							children: A(e.status)
+						})]
+					}),
+					/* @__PURE__ */ z("p", {
+						className: "text-xs text-text-secondary",
+						children: ["Signed webhook · ", P(e.status)]
+					}),
+					/* @__PURE__ */ z("p", {
+						className: "text-xs text-text-secondary",
+						children: [
+							"Last accepted update:",
+							" ",
+							e.lastSyncAt ? m(e.lastSyncAt) : "none yet",
+							e.lastErrorAt ? ` · Last error ${m(e.lastErrorAt)}` : ""
+						]
+					}),
+					e.lastErrorMessage ? /* @__PURE__ */ R("p", {
+						className: "break-words text-xs text-status-error-text",
+						children: e.lastErrorMessage
+					}) : null
+				]
+			}), /* @__PURE__ */ z("div", {
+				className: "flex flex-wrap items-center gap-2",
+				children: [
+					/* @__PURE__ */ z(g, {
+						size: "sm",
+						variant: "outline",
+						disabled: l,
+						onClick: () => d(b ? "PAUSED" : "ACTIVE"),
+						children: [R(b ? o : s, {
+							size: 14,
+							className: "mr-1"
+						}), b ? "Pause" : "Resume"]
+					}),
+					/* @__PURE__ */ z(g, {
+						size: "sm",
+						variant: "outline",
+						disabled: l,
+						onClick: p,
+						children: [/* @__PURE__ */ R(a, {
+							size: 14,
+							className: "mr-1"
+						}), "Rotate secret"]
+					}),
+					/* @__PURE__ */ R(g, {
+						size: "sm",
+						variant: "ghost",
+						disabled: l,
+						onClick: y,
+						"aria-label": `Delete ${e.name}`,
+						children: /* @__PURE__ */ R(f, { size: 14 })
+					}),
+					/* @__PURE__ */ R(g, {
+						size: "sm",
+						variant: "ghost",
+						onClick: u,
+						"aria-expanded": i,
+						"aria-label": i ? "Hide details" : "Show details",
+						children: R(i ? r : n, { size: 16 })
+					})
+				]
+			})]
+		}), i ? /* @__PURE__ */ z("div", {
+			className: "mt-4 grid gap-6 border-t border-border-subtle pt-4 lg:grid-cols-2",
+			children: [/* @__PURE__ */ R(be, { url: t }), /* @__PURE__ */ R(X, {
+				integrationId: e.id,
+				refreshKey: c
+			})]
+		}) : null]
+	}) });
+}
+function Se() {
+	let { tenantId: e, workspaceId: t } = p();
+	return /* @__PURE__ */ R(Ce, {}, `${e ?? ""}:${t ?? ""}`);
+}
+function Ce() {
+	let { apiGatewayUrl: t } = p(), n = F(), { message: r, notify: i } = se(), [a, o] = L(null), [s, f] = L(q), [y, b] = L(0), [le, ue] = L(0), [E, D] = L(null), [O, j] = L(!1), [M, N] = L([]), P = M[0] ?? null, I = (e, t) => N((n) => [...n, {
+		name: e,
+		secret: t
+	}]), B = he(/* @__PURE__ */ new Set()), [V, H] = L(() => /* @__PURE__ */ new Set()), U = async (e, t) => {
+		if (!B.current.has(e)) {
+			B.current.add(e), H(new Set(B.current));
+			try {
+				await t();
+			} finally {
+				B.current.delete(e), H(new Set(B.current));
+			}
+		}
+	}, { integrations: W, total: G, isLoading: Y, error: X, refetch: be } = pe({
+		status: s === q ? void 0 : s,
+		limit: K,
+		offset: y * K
+	}), { all: Se, active: Ce, refetch: we } = fe(), Z = Math.max(1, Math.ceil(G / K));
+	me(() => {
+		!Y && y > 0 && y >= Z && b(Z - 1);
+	}, [
+		Y,
+		y,
+		Z
+	]);
+	let Q = W.map((e) => e.lastSyncAt).filter((e) => !!e).sort(), Te = Q.length > 0 ? Q[Q.length - 1] : void 0, Ee = (e) => de(t, e.workspaceId, e.id, window.location.origin), De = () => {
+		ue((e) => e + 1), be(), we();
+	}, $ = (e) => {
+		o(null), i(e), De();
+	}, Oe = async (e, t) => {
+		try {
+			await n.update(e.id, { status: t }), $(t === "ACTIVE" ? `Resumed ${e.name}.` : `Paused ${e.name}.`);
+		} catch (e) {
+			o(J(e, "Could not change the integration status."));
+		}
+	}, ke = async (e) => {
+		if (!window.confirm(`Rotate the signing secret for ${e.name}? Deliveries signed with the old secret are refused as soon as it changes.`)) return;
+		let t = k();
+		try {
+			await n.update(e.id, { apiSecret: t }), I(e.name, t), $(`Rotated the signing secret for ${e.name}.`);
+		} catch (e) {
+			o(J(e, "Could not rotate the signing secret."));
+		}
+	}, Ae = async (e) => {
+		if (window.confirm(`Delete ${e.name}? Its webhook URL stops working; tracking events it already created stay on their shipments.`)) try {
+			await n.remove(e.id), E === e.id && D(null), $(`Deleted ${e.name}.`);
+		} catch (e) {
+			o(J(e, "Could not delete the integration."));
+		}
+	};
+	return /* @__PURE__ */ z(ie, {
+		title: "Integrations",
+		subtitle: "Carrier, ELD and GPS tracking feeds",
+		icon: /* @__PURE__ */ R(c, { size: 24 }),
+		headerActions: /* @__PURE__ */ R(ge, {
+			primary: {
+				label: "Connect feed",
+				icon: /* @__PURE__ */ R(l, { size: 16 }),
+				onSelect: () => j(!0)
+			},
+			actions: [{
+				label: "Refresh",
+				icon: /* @__PURE__ */ R(u, { size: 16 }),
+				onSelect: De
+			}]
+		}),
+		children: [
+			/* @__PURE__ */ R(_e, {
+				icon: /* @__PURE__ */ R(c, { size: 18 }),
+				children: "Connect the systems that already know where your freight is. Each feed gets its own signed webhook; every update it sends becomes a tracking event on the matching shipment, so status and ETA stay current without manual entry."
+			}),
+			/* @__PURE__ */ R(oe, { message: r }),
+			/* @__PURE__ */ R(w, { message: a }),
+			/* @__PURE__ */ z(ae, {
+				columns: 3,
+				children: [
+					/* @__PURE__ */ R(C, {
+						label: "Feeds",
+						value: Se,
+						icon: /* @__PURE__ */ R(c, { size: 20 }),
+						accent: "brand"
+					}),
+					/* @__PURE__ */ R(C, {
+						label: "Active",
+						value: Ce,
+						icon: /* @__PURE__ */ R(d, { size: 20 }),
+						accent: "success"
+					}),
+					/* @__PURE__ */ R(C, {
+						label: "Last accepted update (shown)",
+						value: Te ? m(Te) : "—",
+						icon: /* @__PURE__ */ R(e, { size: 20 }),
+						accent: "blue"
+					})
+				]
+			}),
+			/* @__PURE__ */ R("div", {
+				className: "flex flex-col gap-3 sm:flex-row sm:items-center",
+				children: /* @__PURE__ */ z(ee, {
+					value: s,
+					onValueChange: (e) => {
+						f(e), b(0);
+					},
+					children: [/* @__PURE__ */ R(ne, {
+						"aria-label": "Status",
+						className: "sm:w-56",
+						children: /* @__PURE__ */ R(re, {})
+					}), /* @__PURE__ */ z(te, { children: [/* @__PURE__ */ R(x, {
+						value: q,
+						children: "All statuses"
+					}), ce.map((e) => /* @__PURE__ */ R(x, {
+						value: e,
+						children: A(e)
+					}, e))] })]
+				})
+			}),
+			/* @__PURE__ */ R(w, { message: X?.message }),
+			Y && W.length === 0 ? /* @__PURE__ */ z("div", {
+				className: "grid gap-4",
+				children: [/* @__PURE__ */ R(S, { className: "h-28 w-full" }), /* @__PURE__ */ R(S, { className: "h-28 w-full" })]
+			}) : W.length === 0 && !X ? /* @__PURE__ */ R(_, { children: /* @__PURE__ */ z(v, {
+				className: "flex flex-col items-center gap-3 p-10 text-center",
+				children: [
+					/* @__PURE__ */ R(c, {
+						size: 32,
+						className: "text-text-tertiary"
+					}),
+					/* @__PURE__ */ R("p", {
+						className: "font-medium",
+						children: s === q ? "No tracking feeds connected" : "No feeds with this status"
+					}),
+					/* @__PURE__ */ R("p", {
+						className: "max-w-md text-sm text-text-secondary",
+						children: s === q ? "Connect a carrier portal, ELD or GPS tracker so shipment updates arrive on their own." : "Choose another status to see the rest of your feeds."
+					}),
+					s === q ? /* @__PURE__ */ z(g, {
+						onClick: () => j(!0),
+						children: [/* @__PURE__ */ R(l, {
+							size: 16,
+							className: "mr-1.5"
+						}), "Connect feed"]
+					}) : null
+				]
+			}) }) : /* @__PURE__ */ R("div", {
+				className: "grid gap-4",
+				children: W.map((e) => /* @__PURE__ */ R(xe, {
+					integration: e,
+					url: Ee(e),
+					expanded: E === e.id,
+					refreshKey: le,
+					busy: V.has(e.id),
+					onToggle: () => D((t) => t === e.id ? null : e.id),
+					onSetStatus: (t) => void U(e.id, () => Oe(e, t)),
+					onRotate: () => void U(e.id, () => ke(e)),
+					onDelete: () => void U(e.id, () => Ae(e))
+				}, e.id))
+			}),
+			G > K ? /* @__PURE__ */ z("div", {
+				className: "flex items-center justify-between text-sm",
+				children: [/* @__PURE__ */ z("span", {
+					className: "text-text-secondary",
+					children: [
+						"Page ",
+						y + 1,
+						" of ",
+						Z,
+						" · ",
+						G,
+						" feeds"
+					]
+				}), /* @__PURE__ */ z("div", {
+					className: "flex gap-2",
+					children: [/* @__PURE__ */ R(g, {
+						variant: "outline",
+						size: "sm",
+						disabled: y === 0,
+						onClick: () => b((e) => e - 1),
+						children: "Previous"
+					}), /* @__PURE__ */ R(g, {
+						variant: "outline",
+						size: "sm",
+						disabled: y + 1 >= Z,
+						onClick: () => b((e) => e + 1),
+						children: "Next"
+					})]
+				})]
+			}) : null,
+			/* @__PURE__ */ R(_, { children: /* @__PURE__ */ z(v, {
+				className: "space-y-2 p-5",
+				children: [
+					/* @__PURE__ */ R("p", {
+						className: "text-sm font-medium",
+						children: "Carrier networks"
+					}),
+					/* @__PURE__ */ z("p", {
+						className: "text-sm text-text-secondary",
+						children: [
+							"Direct connections to ",
+							T.map((e) => e.label).join(", "),
+							" ",
+							"are not available yet. Until they are, any carrier or telematics system that can send HTTPS webhooks connects through a signed feed above."
+						]
+					}),
+					/* @__PURE__ */ R("div", {
+						className: "flex flex-wrap gap-2",
+						children: T.map((e) => /* @__PURE__ */ z(h, {
+							variant: "outline",
+							children: [e.label, " · not available yet"]
+						}, e.id))
+					})
+				]
+			}) }),
+			/* @__PURE__ */ R(ye, {
+				open: O,
+				onOpenChange: j,
+				onCreated: (e, t) => {
+					D(e.id), I(e.name, t), $(`Connected ${e.name}.`);
+				}
+			}),
+			/* @__PURE__ */ R(ve, {
+				secret: P?.secret ?? null,
+				integrationName: P?.name ?? "",
+				onClose: () => N((e) => e.slice(1))
+			})
+		]
+	});
+}
+//#endregion
+export { Se as default };