@overvis/hmi-workspace-ui 0.1.0 → 0.1.2

package/dist/page-6rIoTg2L.js

@@ -1,459 +0,0 @@
-import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
-import { r as t } from "./trpc-CvJUuUXp.js";
-import { f as n, h as r, m as i, n as a } from "./i18n-BgzakKoC.js";
-import { a as o, d as s, n as c, t as l } from "./mutation-form-validators-BNz5bsv1.js";
-import { t as u } from "./utils-CX-Pz5p6.js";
-import { G as d, V as f } from "./spinner-C-HPNxOc.js";
-import { t as p } from "./button-6SxPBYMz.js";
-import { a as m, i as h, l as g, o as _, r as v, t as y } from "./dialog-BIhQXcZC.js";
-import { n as b } from "./skeleton-6yk8Tdh5.js";
-import { n as x } from "./api-error-9rQmUN5L.js";
-import { t as S } from "./switch-BqD0RH_G.js";
-import { n as C, t as w } from "./toggle-group-9Bs0Mm3r.js";
-import { o as T } from "./mutations-THtGG6Ai.js";
-import { t as E } from "./page-header-RB2YFWlE.js";
-import { r as D, t as O } from "./query-gate-DVhNIkge.js";
-import { i as k, n as ee, t as A } from "./display-DmOo23mi.js";
-import { t as te } from "./breadcrumbs-0cjsV2cq.js";
-import { a as ne, i as re, n as ie, r as j, t as M } from "./presence-code-BfSXr50g.js";
-import { a as N, c as P, d as F, i as I, l as L, n as R, o as z, r as B, s as V, t as H, u as U } from "./catalog-list-DjZojYLJ.js";
-import { t as W } from "./wireguard-docs-AfU6NzTL.js";
-import { useState as G } from "react";
-import { Fragment as K, jsx as q, jsxs as J } from "react/jsx-runtime";
-import { BookOpenIcon as Y, CableIcon as ae, PencilIcon as oe, PlusIcon as se, Trash2Icon as ce } from "lucide-react";
-import { formatAppDateTime as le, resolveLocalized as ue } from "@overvis/hmi-shared";
-import { useNavigate as de } from "@tanstack/react-router";
-import { endpointCreateFormSchema as fe, endpointCreateFormToInput as pe, endpointDefaultPort as me } from "@overvis/hmi-shared/endpoint";
-//#region src/workspace/setup/endpoints/form-problem.ts
-function X({ problem: e }) {
-	switch (e) {
-		case "name_required": return n("error_field_required");
-		case "hostname_invalid": return n("error_endpoint_hostname_invalid");
-		case "pin_invalid": return n("error_endpoint_pin_invalid");
-		case "public_key_invalid": return n("error_endpoint_public_key_invalid");
-		case "port_invalid": return n("error_endpoint_port_invalid");
-	}
-}
-//#endregion
-//#region src/workspace/setup/endpoints/connection-indicator.tsx
-function he(e) {
-	if (e === void 0) return n("endpoint_status_state_unknown");
-	if (e == null) return n("endpoint_status_state_disconnected");
-	switch (e) {
-		case "connecting": return n("endpoint_status_state_connecting");
-		case "connected": return n("endpoint_status_state_connected");
-		case "disconnected": return n("endpoint_status_state_disconnected");
-		case "error": return n("endpoint_status_state_error");
-	}
-}
-function Z(e) {
-	return e === "connected" ? "bg-emerald-500" : e === "error" ? "bg-destructive" : e === "connecting" ? "bg-amber-500" : "bg-muted-foreground/40";
-}
-function ge({ endpointId: e }) {
-	r();
-	let t = k(e), n = t === void 0 ? void 0 : t?.state ?? null, i = he(n);
-	return /* @__PURE__ */ q("span", {
-		className: "inline-flex size-5 shrink-0 items-center justify-center",
-		title: i,
-		"aria-label": i,
-		role: "img",
-		children: /* @__PURE__ */ q("span", { className: u("size-2.5 rounded-full", Z(n)) })
-	});
-}
-//#endregion
-//#region src/workspace/setup/endpoints/enabled-switch.tsx
-function _e({ workspaceId: e, endpoint: t, compact: n = !1, className: r }) {
-	let o = i(), s = a(), { enable: c, disable: l } = T(e), u = (e) => ({
-		onSuccess: () => {
-			s.success(e);
-		},
-		onError: (e) => {
-			s.error(x(e));
-		}
-	});
-	return /* @__PURE__ */ J("div", {
-		className: r,
-		onClick: (e) => {
-			e.stopPropagation();
-		},
-		onKeyDown: (e) => {
-			e.stopPropagation();
-		},
-		children: [/* @__PURE__ */ J("div", {
-			className: "flex items-center gap-2",
-			children: [/* @__PURE__ */ q(S, {
-				checked: t.disabledSince == null,
-				disabled: l.isPending || c.isPending,
-				size: "sm",
-				"aria-label": o("endpoint_enabled_label"),
-				onCheckedChange: (e) => {
-					e ? c.mutate({
-						id: t.id,
-						baseRevision: t.revision
-					}, u(o("endpoint_enable_toast"))) : l.mutate({
-						id: t.id,
-						baseRevision: t.revision
-					}, u(o("endpoint_disable_toast")));
-				}
-			}), n ? null : /* @__PURE__ */ q("span", {
-				className: "text-sm text-muted-foreground",
-				children: o("endpoint_enabled_label")
-			})]
-		}), !n && t.disabledSince != null ? /* @__PURE__ */ q("p", {
-			className: "mt-1 text-xs text-muted-foreground",
-			children: o("endpoint_disabled_since", { since: le(t.disabledSince) })
-		}) : null]
-	});
-}
-function ve({ endpoint: e }) {
-	let t = i();
-	return e.disabledSince == null ? null : /* @__PURE__ */ q("span", {
-		className: "\n        inline-flex shrink-0 items-center rounded-md bg-muted px-1.5 py-0.5 text-xs font-medium\n        text-muted-foreground\n      ",
-		children: t("endpoint_disabled_badge")
-	});
-}
-//#endregion
-//#region src/workspace/setup/endpoints/page.tsx
-var ye = /* @__PURE__ */ e({
-	CreateEndpointForm: () => $,
-	SetupEndpointsPage: () => Q
-});
-function Q({ workspaceId: e }) {
-	let n = i(), o = a(), s = r(), c = de(), l = t.endpoint.list.useQuery({ workspaceId: e }), { open: u } = W(), [d, f] = G(null);
-	return /* @__PURE__ */ J(L, { children: [
-		/* @__PURE__ */ q(E, {
-			icon: /* @__PURE__ */ q(ae, {}),
-			breadcrumbs: /* @__PURE__ */ q(te, { workspaceId: e }),
-			title: n("setup_endpoints_title"),
-			description: n("setup_endpoints_description"),
-			actions: /* @__PURE__ */ J(p, {
-				type: "button",
-				size: "sm",
-				onClick: () => {
-					c({
-						to: "/workspace/$workspaceId/setup/endpoints/new",
-						params: { workspaceId: e }
-					});
-				},
-				children: [/* @__PURE__ */ q(se, { "data-icon": "inline-start" }), n("endpoint_create_action")]
-			})
-		}),
-		/* @__PURE__ */ q(R, { children: /* @__PURE__ */ q(D, {
-			query: l,
-			loading: /* @__PURE__ */ J("div", {
-				className: "space-y-2",
-				children: [/* @__PURE__ */ q(b, { className: "h-10 w-full" }), /* @__PURE__ */ q(b, { className: "h-10 w-4/5" })]
-			}),
-			error: (e) => /* @__PURE__ */ q(O, { message: x(e) }),
-			isEmpty: (e) => e.endpoints.length === 0,
-			empty: /* @__PURE__ */ q(B, { children: n("setup_endpoints_empty") }),
-			children: ({ endpoints: t }) => /* @__PURE__ */ q(N, { children: t.map((t) => /* @__PURE__ */ J(U, {
-				"data-context-endpoint-id": t.id,
-				children: [
-					/* @__PURE__ */ q(ge, { endpointId: t.id }),
-					/* @__PURE__ */ J(P, {
-						to: "/workspace/$workspaceId/setup/endpoints/$endpointId/status",
-						params: {
-							workspaceId: e,
-							endpointId: t.id
-						},
-						children: [/* @__PURE__ */ J("div", {
-							className: "flex min-w-0 items-center gap-2",
-							children: [/* @__PURE__ */ q(V, { children: ue(t.name, s) }), /* @__PURE__ */ q(ve, { endpoint: t })]
-						}), /* @__PURE__ */ q(z, { children: t.kind === "pin" ? A(t) : t.kind === "wireguard" ? ee(t.port) : `${n("endpoint_list_host")}: ${t.hostname ?? "—"}:${String(t.port)}` })]
-					}),
-					/* @__PURE__ */ J(H, { children: [/* @__PURE__ */ q(_e, {
-						workspaceId: e,
-						endpoint: t,
-						compact: !0
-					}), /* @__PURE__ */ J(I, { children: [
-						t.kind === "wireguard" ? /* @__PURE__ */ q(F, {
-							"aria-label": n("endpoint_docs_action"),
-							onClick: () => {
-								u(t.id);
-							},
-							children: /* @__PURE__ */ q(Y, {})
-						}) : null,
-						/* @__PURE__ */ q(F, {
-							"aria-label": n("endpoint_edit_action"),
-							onClick: () => {
-								c({
-									to: "/workspace/$workspaceId/setup/endpoints/$endpointId",
-									params: {
-										workspaceId: e,
-										endpointId: t.id
-									}
-								});
-							},
-							children: /* @__PURE__ */ q(oe, {})
-						}),
-						/* @__PURE__ */ q(F, {
-							tone: "destructive",
-							"aria-label": n("endpoint_delete_action"),
-							onClick: () => {
-								f(t);
-							},
-							children: /* @__PURE__ */ q(ce, {})
-						})
-					] })] })
-				]
-			}, t.id)) })
-		}) }),
-		/* @__PURE__ */ q(y, {
-			open: d != null,
-			onOpenChange: (e) => {
-				e || f(null);
-			},
-			children: /* @__PURE__ */ q(v, { children: d ? /* @__PURE__ */ q(be, {
-				workspaceId: e,
-				endpointId: d.id,
-				baseRevision: d.revision,
-				onCancel: () => {
-					f(null);
-				},
-				onDeleted: () => {
-					f(null), o.success(n("endpoint_delete_toast"));
-				}
-			}) : null })
-		})
-	] });
-}
-function $({ workspaceId: e, onCancel: t, onCreated: r }) {
-	let u = i(), v = a(), { open: y } = W(), b = T(e).create, x = ne(), [S, E] = G(null), D = o({
-		defaultValues: {
-			kind: "pin",
-			name: u("endpoint_default_name"),
-			hostname: "",
-			pinCode: "",
-			publicKey: "",
-			port: String(me),
-			authorizationCode: ""
-		},
-		validators: l({
-			schema: fe,
-			submit: async (t) => {
-				let i = pe(t, {
-					workspaceId: e,
-					defaultName: n("endpoint_default_name")
-				});
-				if (!i.ok) return c(i, X);
-				let a = i.input;
-				if (a.kind === "pin") if (S == null) {
-					let t = await x.begin({
-						workspaceId: e,
-						pinCode: a.pinCode
-					});
-					if (t === "closed") return null;
-					if (t != null) return E({
-						...t,
-						pinCode: a.pinCode
-					}), null;
-				} else {
-					let e = M(t.authorizationCode);
-					if (!e.ok) return { fields: { authorizationCode: () => n("endpoint_presence_code_invalid") } };
-					a = {
-						...a,
-						pinCode: S.pinCode,
-						challengeId: S.challengeId,
-						...e.code == null ? {} : { authorizationCode: e.code }
-					};
-				}
-				let o;
-				try {
-					o = await b.mutateAsync(a);
-				} catch (e) {
-					throw S != null && !re(e) && (x.cancel(S.challengeId), E(null), D.setFieldValue("authorizationCode", "")), e;
-				}
-				return S != null && x.settle(S.challengeId), v.success(u("endpoint_create_toast")), queueMicrotask(() => {
-					r({
-						id: o.id,
-						kind: o.kind
-					}), o.kind === "wireguard" && y(o.id);
-				}), null;
-			},
-			mapError: (e, t) => j(e, t, S?.codeDisplayed ?? !0)
-		}),
-		onSubmitInvalid: s
-	});
-	return /* @__PURE__ */ q(D.AppForm, { children: /* @__PURE__ */ J(D.FormRoot, {
-		layout: "dialog",
-		children: [
-			/* @__PURE__ */ J(_, { children: [/* @__PURE__ */ q(g, { children: u(S == null ? "endpoint_create_title" : "endpoint_presence_title") }), S == null ? /* @__PURE__ */ q(D.Subscribe, {
-				selector: (e) => e.values.kind,
-				children: (e) => /* @__PURE__ */ q(h, { children: u(e === "pin" ? "endpoint_create_description_pin" : e === "wireguard" ? "endpoint_create_description_wireguard" : "endpoint_create_description") })
-			}) : /* @__PURE__ */ q(h, { children: u("endpoint_presence_button") })] }),
-			/* @__PURE__ */ J(f, { children: [S == null ? null : /* @__PURE__ */ J(K, { children: [
-				/* @__PURE__ */ q(D.Subscribe, {
-					selector: (e) => e.isSubmitting,
-					children: (e) => /* @__PURE__ */ q(ie, {
-						challengeId: S.challengeId,
-						paused: e,
-						onDone: () => {
-							D.setFieldValue("authorizationCode", ""), D.handleSubmit();
-						}
-					})
-				}),
-				/* @__PURE__ */ q("p", {
-					className: "text-sm",
-					children: S.codeDisplayed ? u("endpoint_presence_or_code") : u("endpoint_presence_button_only")
-				}),
-				S.codeDisplayed ? /* @__PURE__ */ q(D.AppField, {
-					name: "authorizationCode",
-					children: (e) => /* @__PURE__ */ q(e.TextField, {
-						label: u("endpoint_presence_code_label"),
-						id: "endpoint-authorization-code",
-						autoComplete: "off",
-						spellCheck: !1,
-						inputMode: "numeric",
-						autoFocus: !0
-					})
-				}) : null
-			] }), S == null ? /* @__PURE__ */ q(D.Subscribe, {
-				selector: (e) => e.isSubmitting,
-				children: (e) => /* @__PURE__ */ J(d, {
-					disabled: e,
-					className: "contents",
-					children: [
-						/* @__PURE__ */ q(D.AppField, {
-							name: "kind",
-							children: (e) => /* @__PURE__ */ J("div", {
-								className: "space-y-2",
-								children: [/* @__PURE__ */ q("p", {
-									className: "text-sm font-medium",
-									children: u("endpoint_field_kind")
-								}), /* @__PURE__ */ J(w, {
-									variant: "outline",
-									size: "sm",
-									spacing: 0,
-									value: [e.state.value],
-									onValueChange: (t) => {
-										let n = t[0];
-										n !== "direct" && n !== "pin" && n !== "wireguard" || e.handleChange(n);
-									},
-									className: "w-full",
-									children: [
-										/* @__PURE__ */ q(C, {
-											value: "pin",
-											className: "flex-1",
-											children: u("endpoint_kind_pin")
-										}),
-										/* @__PURE__ */ q(C, {
-											value: "wireguard",
-											className: "flex-1",
-											children: u("endpoint_kind_wireguard")
-										}),
-										/* @__PURE__ */ q(C, {
-											value: "direct",
-											className: "flex-1",
-											children: u("endpoint_kind_direct")
-										})
-									]
-								})]
-							})
-						}),
-						/* @__PURE__ */ q(D.AppField, {
-							name: "name",
-							children: (e) => /* @__PURE__ */ q(e.TextField, {
-								label: u("endpoint_field_name"),
-								id: "endpoint-name",
-								autoFocus: !0
-							})
-						}),
-						/* @__PURE__ */ q(D.Subscribe, {
-							selector: (e) => e.values.kind,
-							children: (e) => e === "pin" ? /* @__PURE__ */ q(D.AppField, {
-								name: "pinCode",
-								children: (e) => /* @__PURE__ */ q(e.TextField, {
-									label: u("endpoint_field_pin_code"),
-									id: "endpoint-pin",
-									autoComplete: "off",
-									spellCheck: !1
-								})
-							}) : e === "wireguard" ? /* @__PURE__ */ J("div", {
-								className: "\n                            grid grid-cols-1 gap-4\n                            sm:grid-cols-[minmax(0,1fr)_6.5rem]\n                          ",
-								children: [/* @__PURE__ */ q(D.AppField, {
-									name: "publicKey",
-									children: (e) => /* @__PURE__ */ q(e.TextField, {
-										label: u("endpoint_field_public_key"),
-										id: "endpoint-public-key",
-										autoComplete: "off",
-										spellCheck: !1
-									})
-								}), /* @__PURE__ */ q(D.AppField, {
-									name: "port",
-									children: (e) => /* @__PURE__ */ q(e.TextField, {
-										label: u("endpoint_field_port"),
-										id: "endpoint-port",
-										type: "number",
-										inputMode: "numeric"
-									})
-								})]
-							}) : /* @__PURE__ */ J("div", {
-								className: "\n                            grid grid-cols-1 gap-4\n                            sm:grid-cols-[minmax(0,1fr)_6.5rem]\n                          ",
-								children: [/* @__PURE__ */ q(D.AppField, {
-									name: "hostname",
-									children: (e) => /* @__PURE__ */ q(e.TextField, {
-										label: u("endpoint_field_hostname"),
-										id: "endpoint-hostname",
-										autoComplete: "off",
-										spellCheck: !1
-									})
-								}), /* @__PURE__ */ q(D.AppField, {
-									name: "port",
-									children: (e) => /* @__PURE__ */ q(e.TextField, {
-										label: u("endpoint_field_port"),
-										id: "endpoint-port",
-										type: "number",
-										inputMode: "numeric"
-									})
-								})]
-							})
-						})
-					]
-				})
-			}) : null] }),
-			/* @__PURE__ */ J(m, { children: [/* @__PURE__ */ q(p, {
-				type: "button",
-				variant: "outline",
-				onClick: () => {
-					t();
-				},
-				children: u("action_cancel")
-			}), /* @__PURE__ */ q(D.SubmitButton, {
-				label: S == null ? u("endpoint_create_submit") : S.codeDisplayed ? u("endpoint_presence_submit") : u("endpoint_presence_waiting"),
-				pendingLabel: u("action_creating"),
-				disabled: S != null && !S.codeDisplayed
-			})] })
-		]
-	}) });
-}
-function be({ workspaceId: e, endpointId: t, baseRevision: n, onCancel: r, onDeleted: a }) {
-	let c = i(), u = T(e).remove, d = o({
-		defaultValues: {},
-		validators: l({ submit: async () => (await u.mutateAsync({
-			id: t,
-			baseRevision: n
-		}), null) }),
-		onSubmitInvalid: s,
-		onSubmit: () => {
-			a();
-		}
-	});
-	return /* @__PURE__ */ q(d.AppForm, { children: /* @__PURE__ */ J(d.FormRoot, {
-		layout: "dialog",
-		children: [/* @__PURE__ */ J(_, { children: [/* @__PURE__ */ q(g, { children: c("endpoint_delete_confirm_title") }), /* @__PURE__ */ q(h, { children: c("endpoint_delete_confirm_description") })] }), /* @__PURE__ */ J(m, { children: [/* @__PURE__ */ q(p, {
-			type: "button",
-			variant: "outline",
-			onClick: () => {
-				r();
-			},
-			children: c("action_cancel")
-		}), /* @__PURE__ */ q(d.SubmitButton, {
-			label: c("endpoint_delete_confirm_submit"),
-			pendingLabel: c("action_deleting"),
-			variant: "destructive"
-		})] })]
-	}) });
-}
-//#endregion
-export { X as i, Q as n, ye as r, $ as t };