@camera.ui/server 2.1.12 → 2.1.13

package/dist/interface/ha/Instances-DJjZ3btI.js

@@ -0,0 +1,680 @@
+import { c as e, m as t } from "./ripple-BilzxWfY.js";
+import { Dt as n, G as r, H as i, I as a, Jt as o, Wt as s, _t as c, d as l, f as u, gt as d, kt as f, l as p, lt as m, ot as h, p as g, qt as _, r as v, rt as y, u as b, x, xt as S, y as C, yt as w } from "./runtime-core.esm-bundler-D8slQ3BU.js";
+import { t as T } from "./tag-CXgC9OZ6.js";
+import { Ar as E, B as ee, Dn as te, Er as D, L as O, R as ne, Tr as re, W as ie, b as ae, ci as oe, fr as k, gi as se, gt as ce, ia as le, ri as A, ti as ue, wr as de, y as fe, z as pe } from "./api-CWJkvtnM.js";
+import { I as me } from "./protocol-BB4jdtUC-K1r3LFCq.js";
+import { i as j } from "./intercomService-jB2mTgsn.js";
+import { n as he } from "./vue-i18n-Dcb07o5U.js";
+import { t as M } from "./button-BlYuI0Q7.js";
+import { n as ge, t as _e } from "./inputicon-6-vaPLbw.js";
+import { t as N } from "./inputtext-DGIESrd0.js";
+import { t as ve } from "./close-Eq3txTBS.js";
+import { t as ye } from "./search-CoOsbgeb.js";
+import { t as be } from "./back-filled-Cxzg5vQg.js";
+import { t as xe } from "./plus-d_caPq5l.js";
+import { t as Se } from "./pencil-outline-BqfTDXIh.js";
+import { t as Ce } from "./trash-fill-BPsrwR8X.js";
+//#region ~icons/mdi/harddisk
+var P = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function F(e, t) {
+	return i(), g("svg", P, [...t[0] ||= [b("path", {
+		fill: "currentColor",
+		d: "M6 2h12a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2m6 2a6 6 0 0 0-6 6c0 3.31 2.69 6 6.1 6l-.88-2.23a1.01 1.01 0 0 1 .37-1.37l.86-.5a1.01 1.01 0 0 1 1.37.37l1.92 2.42A5.98 5.98 0 0 0 18 10a6 6 0 0 0-6-6m0 5a1 1 0 0 1 1 1a1 1 0 0 1-1 1a1 1 0 0 1-1-1a1 1 0 0 1 1-1m-5 9a1 1 0 0 0-1 1a1 1 0 0 0 1 1a1 1 0 0 0 1-1a1 1 0 0 0-1-1m5.09-4.73l2.49 6.31l2.59-1.5l-4.22-5.31z"
+	}, null, -1)]]);
+}
+var I = c({
+	name: "mdi-harddisk",
+	render: F
+}), L = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function R(e, t) {
+	return i(), g("svg", L, [...t[0] ||= [b("path", {
+		fill: "currentColor",
+		d: "M12 2A10 10 0 0 0 2 12a10 10 0 0 0 10 10a10 10 0 0 0 10-10A10 10 0 0 0 12 2m0 2a8 8 0 0 1 8 8a8 8 0 0 1-8 8a8 8 0 0 1-8-8a8 8 0 0 1 8-8m0 5a3 3 0 0 0-3 3a3 3 0 0 0 3 3a3 3 0 0 0 3-3a3 3 0 0 0-3-3"
+	}, null, -1)]]);
+}
+var we = c({
+	name: "mdi-record-circle-outline",
+	render: R
+}), Te = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function Ee(e, t) {
+	return i(), g("svg", Te, [...t[0] ||= [b("path", {
+		fill: "currentColor",
+		d: "M9.15316 5.40838C10.4198 3.13613 11.0531 2 12 2C12.9469 2 13.5802 3.13612 14.8468 5.40837L15.1745 5.99623C15.5345 6.64193 15.7144 6.96479 15.9951 7.17781C16.2757 7.39083 16.6251 7.4699 17.3241 7.62805L17.9605 7.77203C20.4201 8.32856 21.65 8.60682 21.9426 9.54773C22.2352 10.4886 21.3968 11.4691 19.7199 13.4299L19.2861 13.9372C18.8096 14.4944 18.5713 14.773 18.4641 15.1177C18.357 15.4624 18.393 15.8341 18.465 16.5776L18.5306 17.2544C18.7841 19.8706 18.9109 21.1787 18.1449 21.7602C17.3788 22.3417 16.2273 21.8115 13.9243 20.7512L13.3285 20.4768C12.6741 20.1755 12.3469 20.0248 12 20.0248C11.6531 20.0248 11.3259 20.1755 10.6715 20.4768L10.0757 20.7512C7.77268 21.8115 6.62118 22.3417 5.85515 21.7602C5.08912 21.1787 5.21588 19.8706 5.4694 17.2544L5.53498 16.5776C5.60703 15.8341 5.64305 15.4624 5.53586 15.1177C5.42868 14.773 5.19043 14.4944 4.71392 13.9372L4.2801 13.4299C2.60325 11.4691 1.76482 10.4886 2.05742 9.54773C2.35002 8.60682 3.57986 8.32856 6.03954 7.77203L6.67589 7.62805C7.37485 7.4699 7.72433 7.39083 8.00494 7.17781C8.28555 6.96479 8.46553 6.64194 8.82547 5.99623L9.15316 5.40838Z"
+	}, null, -1)]]);
+}
+var De = c({
+	name: "solar-star-bold",
+	render: Ee
+}), z = { class: "flex flex-col gap-2" }, B = { class: "flex items-center justify-between gap-2" }, V = { class: "flex items-center gap-1.5 min-w-0" }, H = { class: "text-xl font-semibold truncate" }, U = { class: "flex items-center gap-1 shrink-0" }, Oe = { class: "relative w-5 h-5" }, W = { class: "flex items-center gap-2" }, G = { class: "text-sm text-muted-color truncate" }, ke = {
+	key: 0,
+	class: "text-xs text-muted-color ml-auto shrink-0"
+}, K = {
+	key: 0,
+	class: "flex flex-col gap-2 mt-2"
+}, Ae = { class: "cui-progress-track w-full h-2 rounded-full overflow-hidden" }, q = { class: "flex items-center justify-between text-sm text-muted-color" }, J = {
+	key: 1,
+	class: "mt-1"
+}, Y = { class: "text-sm text-orange-500" }, X = {
+	key: 2,
+	class: "mt-1"
+}, Z = { class: "text-sm text-orange-500" }, je = {
+	key: 3,
+	class: "mt-1"
+}, Q = { class: "text-sm text-muted-color" }, Me = { class: "flex items-center text-muted-color" }, Ne = {
+	key: 0,
+	class: "flex items-center gap-4"
+}, Pe = { class: "flex items-center gap-1.5" }, Fe = { class: "text-sm text-color font-medium" }, Ie = { class: "flex items-center gap-1.5" }, Le = { class: "text-sm text-color font-medium" }, Re = {
+	key: 1,
+	class: "flex items-center gap-1.5 ml-auto"
+}, ze = { class: "text-sm text-color font-medium" }, Be = /* @__PURE__ */ x({
+	__name: "CuiInstanceCard",
+	props: {
+		instance: {},
+		menuOpen: { type: Boolean },
+		selectionMode: { type: Boolean },
+		selected: { type: Boolean }
+	},
+	emits: ["toggle-favorite", "open-menu"],
+	setup(e, { emit: r }) {
+		let a = e, c = r, { instance: d } = n(a), h = p(() => d.value.lastUpdatedAt ? S(d.value.lastUpdatedAt) : "");
+		function v(e) {
+			return e >= 1024 ? `${(e / 1024).toFixed(1)} GB` : `${e} MB`;
+		}
+		function y(e) {
+			return e >= 1e6 ? `${(e / 1e6).toFixed(1)} TB` : e >= 1e3 ? `${(e / 1e3).toFixed(0)} GB` : `${e} MB`;
+		}
+		function x(e) {
+			return e >= 90 ? "bg-red-500" : e >= 70 ? "bg-orange-400" : e >= 50 ? "bg-yellow-400" : "bg-green-500";
+		}
+		function S(e) {
+			let t = Date.now() - (typeof e == "number" ? e : new Date(e).getTime()), n = Math.floor(t / 6e4);
+			if (n < 1) return "< 1m";
+			if (n < 60) return `${n}m`;
+			let r = Math.floor(n / 60);
+			return r < 24 ? `${r}h` : `${Math.floor(r / 24)}d`;
+		}
+		return (n, r) => {
+			let a = k, p = De, S = M, w = T, E = A, ee = we, te = I, D = j;
+			return i(), l(D, { class: s(["cui-card transition-shadow h-[176px] relative", {
+				"ring-1 ring-primary": f(d).active,
+				"cursor-pointer hover:shadow-md": e.selectionMode || f(d).status !== "offline",
+				"opacity-60": f(d).status === "offline"
+			}]) }, {
+				content: m(() => [b("div", z, [
+					b("div", B, [b("div", V, [e.selectionMode ? (i(), g("div", {
+						key: 0,
+						class: s(["w-6 h-6 rounded-full border-2 flex items-center justify-center transition-colors shrink-0", e.selected ? "bg-primary border-primary" : "border-color"])
+					}, [e.selected ? (i(), l(a, {
+						key: 0,
+						class: "w-4 h-4 text-white"
+					})) : u("", !0)], 2)) : (i(), l(S, {
+						key: 1,
+						severity: "secondary",
+						text: "",
+						rounded: "",
+						class: "cui-icon-sm shrink-0 !ml-[calc(-0.25rem*2)]",
+						onClick: r[0] ||= t((e) => c("toggle-favorite"), ["stop"])
+					}, {
+						icon: m(() => [f(d).favorite ? (i(), l(p, {
+							key: 0,
+							class: "w-4 h-4 text-yellow-500"
+						})) : (i(), l(p, {
+							key: 1,
+							class: "w-4 h-4"
+						}))]),
+						_: 1
+					})), b("h3", H, o(f(d).name), 1)]), b("div", U, [
+						f(d).pending2fa ? (i(), l(w, {
+							key: 0,
+							severity: "warn",
+							value: "2FA",
+							class: "text-xs"
+						})) : u("", !0),
+						f(d).status === "offline" ? (i(), l(w, {
+							key: 1,
+							severity: "danger",
+							value: n.$t("views.instances.offline"),
+							class: "text-xs"
+						}, null, 8, ["value"])) : u("", !0),
+						f(d).active ? (i(), l(w, {
+							key: 2,
+							severity: "success",
+							value: n.$t("views.instances.active")
+						}, null, 8, ["value"])) : u("", !0),
+						e.selectionMode ? u("", !0) : (i(), l(S, {
+							key: 3,
+							severity: "secondary",
+							text: "",
+							rounded: "",
+							class: "cui-icon-sm",
+							onClick: r[1] ||= t((e) => c("open-menu", e), ["stop"])
+						}, {
+							icon: m(() => [b("div", Oe, [
+								b("div", { class: s(["absolute top-0.5 left-1/2 -translate-x-1/2 w-1 h-1 rounded-full transform transition-all duration-100 origin-center bg-current", { "w-3.5 h-[2px] rotate-45 top-1/2 -translate-y-1/2 rounded-none": e.menuOpen }]) }, null, 2),
+								b("div", { class: s(["absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-1 h-1 rounded-full transition-all duration-100 bg-current", { "opacity-0 scale-0": e.menuOpen }]) }, null, 2),
+								b("div", { class: s(["absolute bottom-0.5 left-1/2 -translate-x-1/2 w-1 h-1 rounded-full transform transition-all duration-100 origin-center bg-current", { "w-3.5 h-[2px] -rotate-45 bottom-1/2 translate-y-1/2 rounded-none": e.menuOpen }]) }, null, 2)
+							])]),
+							_: 1
+						}))
+					])]),
+					b("div", W, [
+						b("div", { class: s(["w-2 h-2 rounded-full shrink-0", {
+							"bg-green-500": f(d).status === "online",
+							"bg-red-500": f(d).status === "offline",
+							"bg-gray-400": f(d).status === "unknown"
+						}]) }, null, 2),
+						b("span", G, o(f(d).version ? `v${f(d).version}` : f(d).url || ""), 1),
+						f(h) ? (i(), g("span", ke, o(f(h)), 1)) : u("", !0)
+					]),
+					f(d).resources ? (i(), g("div", K, [b("div", Ae, [b("div", {
+						class: s(["h-full rounded-full transition-all duration-300", x(f(d).resources.cpuUsage)]),
+						style: _({ width: `${f(d).resources.cpuUsage}%` })
+					}, null, 6)]), b("div", q, [b("span", null, "CPU " + o(f(d).resources.cpuUsage) + "%", 1), b("span", null, o(v(f(d).resources.memUsed)) + " / " + o(v(f(d).resources.memTotal)), 1)])])) : f(d).hasCredentials ? f(d).pending2fa ? (i(), g("div", X, [b("span", Z, o(n.$t("views.instances.two_factor_pending_hint")), 1)])) : (i(), g("div", je, [b("span", Q, o(f(d).status === "offline" ? n.$t("views.instances.server_offline") : n.$t("views.instances.no_data")), 1)])) : (i(), g("div", J, [b("span", Y, o(n.$t("views.instances.credentials_required")), 1)]))
+				])]),
+				footer: m(() => [b("div", Me, [f(d).cameras ? (i(), g("div", Ne, [b("div", Pe, [C(E, { class: "w-4 h-4" }), b("span", Fe, o(f(d).cameras.online) + "/" + o(f(d).cameras.total), 1)]), b("div", Ie, [C(ee, { class: "w-4 h-4 text-red-500" }), b("span", Le, o(f(d).cameras.recording), 1)])])) : u("", !0), f(d).resources ? (i(), g("div", Re, [C(te, { class: "w-4 h-4" }), b("span", ze, o(y(f(d).resources.diskUsed)) + " / " + o(y(f(d).resources.diskTotal)), 1)])) : u("", !0)])]),
+				_: 1
+			}, 8, ["class"]);
+		};
+	}
+}), Ve = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function He(e, t) {
+	return i(), g("svg", Ve, [...t[0] ||= [b("path", {
+		fill: "currentColor",
+		d: "M2 7v2h4v2H4a2 2 0 0 0-2 2v4h6v-2H4v-2h2a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zm7 0v10h2v-4h3v-2h-3V9h4V7zm9 0a2 2 0 0 0-2 2v8h2v-3h2v3h2V9a2 2 0 0 0-2-2zm0 2h2v3h-2z"
+	}, null, -1)]]);
+}
+var Ue = c({
+	name: "mdi-two-factor-authentication",
+	render: He
+}), We = { class: "flex flex-col gap-6 w-full" }, Ge = { class: "flex flex-col field-gap" }, Ke = {
+	for: "instanceName",
+	class: "cui-label"
+}, qe = { class: "flex flex-col field-gap" }, Je = {
+	for: "instanceUrl",
+	class: "cui-label"
+}, Ye = { class: "flex flex-col field-gap" }, Xe = {
+	for: "credUsername",
+	class: "cui-label"
+}, Ze = { class: "flex flex-col field-gap" }, Qe = {
+	for: "credPassword",
+	class: "cui-label"
+}, $e = /* @__PURE__ */ x({
+	__name: "EditInstanceDialog",
+	props: {
+		currentName: {},
+		currentUrl: {},
+		hasCredentials: { type: Boolean }
+	},
+	setup(e, { expose: t }) {
+		let n = e, { t: r } = he(), a = se(), s = S(n.currentName), c = S(n.currentUrl ?? ""), u = S(""), m = S(""), h = p(() => !n.currentName), _ = p(() => !!n.hasCredentials);
+		return t({ onConfirm: async () => {
+			let e = s.value.trim();
+			if (!e) return null;
+			if (h.value) {
+				let t = c.value.trim();
+				if (!t) return null;
+				let n = u.value.trim();
+				return !n || !m.value ? (a.add({
+					severity: "warn",
+					detail: r("views.settings.instances.credentials_required"),
+					life: 3e3
+				}), null) : {
+					name: e,
+					url: t,
+					credentials: {
+						username: n,
+						password: m.value
+					}
+				};
+			}
+			return {
+				name: e,
+				credentials: u.value.trim() && m.value ? {
+					username: u.value.trim(),
+					password: m.value
+				} : void 0
+			};
+		} }), (t, n) => {
+			let r = N;
+			return i(), g("div", We, [
+				b("div", Ge, [b("label", Ke, o(t.$t("views.settings.instances.name")), 1), C(r, {
+					id: "instanceName",
+					modelValue: f(s),
+					"onUpdate:modelValue": n[0] ||= (e) => d(s) ? s.value = e : null,
+					placeholder: t.$t("views.settings.instances.name"),
+					class: "w-full",
+					autofocus: ""
+				}, null, 8, ["modelValue", "placeholder"])]),
+				b("div", qe, [b("label", Je, o(t.$t("views.settings.instances.url")), 1), f(h) ? (i(), l(r, {
+					key: 0,
+					id: "instanceUrl",
+					modelValue: f(c),
+					"onUpdate:modelValue": n[1] ||= (e) => d(c) ? c.value = e : null,
+					placeholder: t.$t("views.settings.instances.url_placeholder"),
+					class: "w-full"
+				}, null, 8, ["modelValue", "placeholder"])) : (i(), l(r, {
+					key: 1,
+					id: "instanceUrl",
+					"model-value": e.currentUrl,
+					class: "w-full",
+					readonly: ""
+				}, null, 8, ["model-value"]))]),
+				b("div", Ye, [b("label", Xe, o(t.$t("views.settings.instances.credentials_username")), 1), C(r, {
+					id: "credUsername",
+					modelValue: f(u),
+					"onUpdate:modelValue": n[2] ||= (e) => d(u) ? u.value = e : null,
+					placeholder: f(_) ? t.$t("views.settings.instances.credentials_unchanged") : t.$t("views.settings.instances.credentials_username"),
+					class: "w-full",
+					autocomplete: "off"
+				}, null, 8, ["modelValue", "placeholder"])]),
+				b("div", Ze, [b("label", Qe, o(t.$t("views.settings.instances.credentials_password")), 1), C(r, {
+					id: "credPassword",
+					modelValue: f(m),
+					"onUpdate:modelValue": n[3] ||= (e) => d(m) ? m.value = e : null,
+					type: "password",
+					placeholder: f(_) ? t.$t("views.settings.instances.credentials_unchanged") : t.$t("views.settings.instances.credentials_password"),
+					class: "w-full",
+					autocomplete: "new-password"
+				}, null, 8, ["modelValue", "placeholder"])])
+			]);
+		};
+	}
+}), et = { class: "flex flex-col" }, tt = {
+	key: 0,
+	class: "page-title"
+}, nt = { class: "flex gap-2 mb-4" }, rt = {
+	key: "empty",
+	class: "flex flex-1 min-h-0 flex-col items-center justify-center w-full gap-4"
+}, it = { class: "text-muted text-sm" }, at = 176, $ = 280, ot = 15e3, st = /* @__PURE__ */ x({
+	__name: "Instances",
+	setup(t) {
+		let n = new ae(), { t: s } = he(), { smBreakpoint: c } = D(), { width: x, height: T } = E(), k = ce(), A = se(), j = fe(), P = p(() => j.serverInstances.filter((e) => !!e.credentials)), { data: F, isPending: I } = n.listQuery(), { mutateAsync: L } = n.createMutation(), { mutateAsync: R } = n.updateMutation(), { mutateAsync: we } = n.deleteMutation(), { mutateAsync: Te } = n.bulkDeleteMutation(), { mutateAsync: Ee } = n.toggleFavoriteMutation(), De = n.statusQueries(P), z, B = y("menuRef"), V = S(!1), H = S(""), U = w({}), Oe = p(() => (c.value ? 1 : Math.max(1, Math.floor(x.value / $))) * Math.max(1, Math.ceil(T.value / 184))), W = p(() => {
+			let e = 0;
+			return j.serverInstances.map((t) => {
+				let n = !!t.credentials;
+				if (!n) return {
+					id: t.id,
+					name: t.name,
+					url: t.url,
+					status: "unknown",
+					active: t.id === j.activeId,
+					favorite: j.isFavorite(t.id),
+					hasCredentials: n
+				};
+				let r = De.value[e++], i = r?.data, a = U[t.id], o = "unknown";
+				return a === "online" ? o = "online" : a === "offline" && (o = "offline"), {
+					id: t.id,
+					name: t.name,
+					url: t.url,
+					status: o,
+					active: t.id === j.activeId,
+					favorite: j.isFavorite(t.id),
+					hasCredentials: n,
+					pending2fa: !!t.pending2fa,
+					version: i?.version,
+					lastUpdatedAt: r?.dataUpdatedAt,
+					cameras: i?.cameras,
+					resources: i ? {
+						cpuUsage: i.cpuUsage,
+						memUsed: i.memUsed,
+						memTotal: i.memTotal,
+						diskUsed: i.diskUsed,
+						diskTotal: i.diskTotal
+					} : void 0
+				};
+			});
+		}), G = p(() => {
+			let e = H.value.toLowerCase().trim();
+			return e ? W.value.filter((t) => t.name.toLowerCase().includes(e) || t.url?.toLowerCase().includes(e)) : W.value;
+		}), ke = p(() => [
+			{
+				label: s("views.instances.two_factor_enter_code"),
+				icon: Ue,
+				hide: !B.value?.data?.pending2fa,
+				onClick: (e) => {
+					j.complete2FALogin(e.id, e.name);
+				}
+			},
+			{
+				label: s("views.settings.edit"),
+				icon: Se,
+				onClick: (e) => {
+					let t = Ae(e);
+					t && Le(t);
+				}
+			},
+			{
+				label: s("views.settings.remove"),
+				icon: Ce,
+				iconProps: { class: "text-red-500" },
+				labelProps: { class: "text-red-500" },
+				buttonProps: { severity: "danger" },
+				onClick: (e) => {
+					Re(e.id);
+				}
+			}
+		]);
+		function K() {
+			z?.abort(), z = new AbortController();
+			let { signal: e } = z;
+			for (let t of P.value) U[t.id] === void 0 && (U[t.id] = "checking"), j.probeInstance(t.id, e).then((n) => {
+				e.aborted || (U[t.id] = n ? "online" : "offline");
+			}).catch(() => {
+				e.aborted || (U[t.id] = "offline");
+			});
+		}
+		function Ae(e) {
+			let t = j.serverInstances.find((t) => t.id === e.id);
+			if (!t) return;
+			let n = j.instanceTokens[t.id];
+			return {
+				id: t.id,
+				name: t.name,
+				url: t.url,
+				hasCredentials: !!t.credentials,
+				favorite: t.favorite ?? !0,
+				userData: n?.userData ?? null,
+				lastConnectedAt: n?.lastConnectedAt ?? null,
+				isHome: !1
+			};
+		}
+		let { selectionMode: q, selectedIds: J, selectedItems: Y, allSelected: X, bulkBusy: Z, enterSelectionMode: je, exitSelectionMode: Q, toggleSelectAll: Me, toggleSelection: Ne } = O(G, (e) => e.id);
+		function Pe() {
+			if (!Y.value.length || Z.value) return;
+			let e = Y.value.map((e) => e.id);
+			k.openTextDialog({
+				data: {
+					title: s("components.dialog.title.confirm"),
+					contentText: s("views.instances.remove_selected_confirm", { count: e.length }),
+					confirmText: s("views.settings.instances.remove"),
+					loading: V
+				},
+				onConfirm: async () => {
+					Z.value = !0, V.value = !0;
+					try {
+						await Te({ ids: e }), Q();
+					} catch (e) {
+						A.add({
+							severity: "error",
+							detail: e,
+							life: 3e3
+						});
+					} finally {
+						Z.value = !1, V.value = !1;
+					}
+				}
+			});
+		}
+		function Fe(e) {
+			if (q.value) {
+				Ne(e.id);
+				return;
+			}
+			if (!(e.active || e.status === "offline")) {
+				if (e.pending2fa) {
+					j.complete2FALogin(e.id, e.name);
+					return;
+				}
+				e.id === "__home__" ? j.switchInstance(null) : j.switchInstance(e.id);
+			}
+		}
+		function Ie() {
+			k.openComponentDialog($e, {
+				data: {
+					title: s("views.instances.add"),
+					confirmText: s("components.form.button.add"),
+					contentProps: {
+						currentName: "",
+						hasCredentials: !1
+					}
+				},
+				onConfirm: async (e) => {
+					if (e) try {
+						let t = await L({
+							name: e.name,
+							url: e.url,
+							credentials: e.credentials
+						});
+						t.requires2fa && await j.complete2FALogin(t.id, t.name);
+					} catch (e) {
+						A.add({
+							severity: "error",
+							detail: e,
+							life: 3e3
+						});
+					}
+				}
+			});
+		}
+		function Le(e) {
+			k.openComponentDialog($e, {
+				data: {
+					title: s("views.settings.instances.edit"),
+					confirmText: s("components.form.button.save"),
+					contentProps: {
+						currentName: e.name,
+						currentUrl: e.url,
+						hasCredentials: e.hasCredentials
+					}
+				},
+				onConfirm: async (t) => {
+					if (t) try {
+						let n = await R({
+							id: e.id,
+							data: {
+								name: t.name === e.name ? void 0 : t.name,
+								credentials: t.credentials ?? void 0
+							}
+						});
+						n.requires2fa && await j.complete2FALogin(n.id, n.name);
+					} catch (e) {
+						A.add({
+							severity: "error",
+							detail: e,
+							life: 3e3
+						});
+					}
+				}
+			});
+		}
+		function Re(e) {
+			k.openTextDialog({
+				data: {
+					title: s("components.dialog.title.confirm"),
+					contentText: s("views.settings.instances.confirm_remove"),
+					confirmText: s("views.settings.instances.remove"),
+					loading: V
+				},
+				onConfirm: async () => {
+					V.value = !0;
+					try {
+						await we(e);
+					} catch (e) {
+						A.add({
+							severity: "error",
+							detail: e,
+							life: 3e3
+						});
+					}
+					V.value = !1;
+				}
+			});
+		}
+		return h(F, (e) => {
+			e && (oe(j.serverInstances, e.instances) || (j.serverInstances = e.instances), j.serverHomeId !== e.homeId && (j.serverHomeId = e.homeId));
+		}, { immediate: !0 }), h(P, K, {
+			immediate: !0,
+			deep: !0
+		}), me(K, ot), a(() => {
+			z?.abort();
+		}), (t, n) => {
+			let a = be, p = M, h = ie, y = ye, x = _e, S = N, w = ge, T = le, E = Be, D = ue, O = de, ae = re;
+			return i(), g("div", et, [
+				f(c) ? u("", !0) : (i(), g("h1", tt, o(t.$t("views.instances.title")), 1)),
+				C(h, { position: "left" }, {
+					default: m(() => [C(p, {
+						severity: "secondary",
+						text: "",
+						class: "cui-button p-2 text-color non-draggable-region",
+						onClick: n[0] ||= (e) => t.$router.push("/menu")
+					}, {
+						icon: m(() => [C(a, { class: "w-6 h-6" })]),
+						_: 1
+					})]),
+					_: 1
+				}),
+				b("div", nt, [C(w, { class: "flex-1" }, {
+					default: m(() => [C(x, null, {
+						default: m(() => [C(y, { class: "w-4 h-4" })]),
+						_: 1
+					}), C(S, {
+						modelValue: f(H),
+						"onUpdate:modelValue": n[1] ||= (e) => d(H) ? H.value = e : null,
+						placeholder: f(s)("views.instances.search"),
+						class: "w-full"
+					}, null, 8, ["modelValue", "placeholder"])]),
+					_: 1
+				})]),
+				C(e, {
+					name: "fade-2",
+					mode: "out-in"
+				}, {
+					default: m(() => [f(I) ? (i(), g("div", {
+						key: "loading",
+						class: "grid w-full gap-2 p-px",
+						style: _({ gridTemplateColumns: `repeat(auto-fill, minmax(${f(c) ? "100%" : `${$}px`}, 1fr))` })
+					}, [(i(!0), g(v, null, r(f(Oe), (e) => (i(), l(T, {
+						key: e,
+						height: `${at}px`,
+						class: "cui-card"
+					}, null, 8, ["height"]))), 128))], 4)) : f(G).length ? (i(), g("div", {
+						key: "content",
+						class: "grid w-full gap-2 p-px",
+						style: _({ gridTemplateColumns: `repeat(auto-fill, minmax(${f(c) ? "100%" : `${$}px`}, 1fr))` })
+					}, [(i(!0), g(v, null, r(f(G), (e) => (i(), l(E, {
+						key: e.id,
+						instance: e,
+						"menu-open": f(B)?.isOpen && f(B)?.data?.id === e.id,
+						"selection-mode": f(q),
+						selected: f(J).has(e.id),
+						onClick: (t) => Fe(e),
+						onToggleFavorite: (t) => f(Ee)(e.id),
+						onOpenMenu: (t) => f(B)?.toggleMenu(t, void 0, e)
+					}, null, 8, [
+						"instance",
+						"menu-open",
+						"selection-mode",
+						"selected",
+						"onClick",
+						"onToggleFavorite",
+						"onOpenMenu"
+					]))), 128))], 4)) : (i(), g("div", rt, [C(D, { class: "w-12 h-12 text-muted" }), b("span", it, o(t.$t("views.instances.no_instances")), 1)]))]),
+					_: 1
+				}),
+				C(ae, { "force-visible": f(q) }, {
+					default: m(() => [f(q) ? (i(), g(v, { key: 1 }, [
+						C(O, {
+							grouped: "",
+							"tooltip-props": { value: f(s)("components.form.tooltip.cancel_selection") },
+							"button-props": { severity: "secondary" },
+							icon: f(ve),
+							"icon-props": {
+								width: "100%",
+								height: "100%"
+							},
+							onClick: f(Q)
+						}, null, 8, [
+							"tooltip-props",
+							"icon",
+							"onClick"
+						]),
+						C(O, {
+							grouped: "",
+							"tooltip-props": { value: f(X) ? f(s)("views.instances.deselect_all") : f(s)("views.instances.select_all") },
+							"button-props": { severity: f(X) ? "primary" : "secondary" },
+							icon: f(ee),
+							"icon-props": {
+								width: "100%",
+								height: "100%"
+							},
+							onClick: f(Me)
+						}, null, 8, [
+							"tooltip-props",
+							"button-props",
+							"icon",
+							"onClick"
+						]),
+						C(O, {
+							grouped: "",
+							"tooltip-props": { value: f(s)("views.instances.remove_selected") },
+							"button-props": {
+								severity: "danger",
+								disabled: !f(J).size || f(Z)
+							},
+							icon: f(pe),
+							"icon-props": {
+								width: "100%",
+								height: "100%"
+							},
+							onClick: Pe
+						}, null, 8, [
+							"tooltip-props",
+							"button-props",
+							"icon"
+						])
+					], 64)) : (i(), g(v, { key: 0 }, [f(W).length ? (i(), l(O, {
+						key: 0,
+						grouped: "",
+						"tooltip-props": { value: f(s)("views.instances.select") },
+						"button-props": { severity: "secondary" },
+						icon: f(ne),
+						"icon-props": {
+							width: "100%",
+							height: "100%"
+						},
+						onClick: f(je)
+					}, null, 8, [
+						"tooltip-props",
+						"icon",
+						"onClick"
+					])) : u("", !0), C(O, {
+						grouped: "",
+						"tooltip-props": { value: t.$t("views.instances.add") },
+						"button-props": { class: "text-white" },
+						icon: f(xe),
+						"icon-props": {
+							width: "30px",
+							height: "30px"
+						},
+						onClick: Ie
+					}, null, 8, ["tooltip-props", "icon"])], 64))]),
+					_: 1
+				}, 8, ["force-visible"]),
+				C(te, {
+					ref_key: "menuRef",
+					ref: B,
+					items: f(ke),
+					popover: { pt: { content: { class: "p-0! rounded-xl! overflow-hidden!" } } }
+				}, null, 8, ["items"])
+			]);
+		};
+	}
+});
+//#endregion
+export { st as default };