@camera.ui/server 2.4.0 → 2.4.1

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

@@ -0,0 +1,670 @@
+import { c as e, m as t } from "./ripple-CGl9oC16.js";
+import { G as n, H as r, I as i, Kt as a, Ot as o, St as s, Xt as c, Yt as l, bt as u, d, f, gt as p, jt as m, l as h, lt as g, ot as _, p as v, r as y, rt as b, u as x, vt as S, x as C, y as w } from "./runtime-core.esm-bundler-CrWKbcD2.js";
+import { t as T } from "./tag-B53KW-vD.js";
+import { $i as E, E as D, Qa as O, T as k, Vi as A, Zn as ee, Zr as j, ai as te, ci as ne, fi as re, mt as ie, nr as ae, oi as oe, ot as se, qi as ce, sr as le, st as ue, ut as de, zi as fe } from "./api-BCqn9EdE.js";
+import { R as pe } from "./protocol-BB4jdtUC-CGK3LRf3.js";
+import { s as M } from "./vee-validate-DWIY1QrX.js";
+import { n as me } from "./vue-i18n-DzDRu5NH.js";
+import { t as N } from "./CuiButton-CGAd8xvo.js";
+import { n as he, t as ge } from "./inputicon-Cv_r9VoH.js";
+import { t as P } from "./inputtext-DfgvQQt_.js";
+import { t as _e } from "./close-BYhywzVJ.js";
+import { t as ve } from "./search-BFDoeYxq.js";
+import { t as ye } from "./pencil-outline-C2o3oqgD.js";
+import { t as be } from "./back-filled-DHF_824p.js";
+import { t as xe } from "./plus-CVdkLDRi.js";
+import { t as Se } from "./trash-fill-BVvtCCQH.js";
+//#region ~icons/mdi/harddisk
+var F = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function I(e, t) {
+	return r(), v("svg", F, [...t[0] ||= [x("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 L = S({
+	name: "mdi-harddisk",
+	render: I
+}), R = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function Ce(e, t) {
+	return r(), v("svg", R, [...t[0] ||= [x("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 = S({
+	name: "mdi-record-circle-outline",
+	render: Ce
+}), Te = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function Ee(e, t) {
+	return r(), v("svg", Te, [...t[0] ||= [x("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 = S({
+	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__ */ C({
+	__name: "CuiInstanceCard",
+	props: {
+		instance: {},
+		menuOpen: { type: Boolean },
+		selectionMode: { type: Boolean },
+		selected: { type: Boolean }
+	},
+	emits: ["toggle-favorite", "open-menu"],
+	setup(e, { emit: n }) {
+		let i = e, s = n, { instance: u } = o(i), p = h(() => u.value.lastUpdatedAt ? S(u.value.lastUpdatedAt) : "");
+		function _(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 b(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, i) => {
+			let o = j, h = De, S = N, C = T, E = A, D = we, O = L, k = M;
+			return r(), d(k, { class: a(["cui-card transition-shadow h-[176px] relative", {
+				"ring-1 ring-primary": m(u).active,
+				"cursor-pointer hover:shadow-md": e.selectionMode || m(u).status !== "offline",
+				"opacity-60": m(u).status === "offline"
+			}]) }, {
+				content: g(() => [x("div", z, [
+					x("div", B, [x("div", V, [e.selectionMode ? (r(), v("div", {
+						key: 0,
+						class: a(["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 ? (r(), d(o, {
+						key: 0,
+						class: "w-4 h-4 text-white"
+					})) : f("", !0)], 2)) : (r(), d(S, {
+						key: 1,
+						severity: "secondary",
+						text: "",
+						rounded: "",
+						class: "cui-icon-sm shrink-0 !ml-[calc(-0.25rem*2)]",
+						onClick: i[0] ||= t((e) => s("toggle-favorite"), ["stop"])
+					}, {
+						icon: g(() => [m(u).favorite ? (r(), d(h, {
+							key: 0,
+							class: "w-4 h-4 text-yellow-500"
+						})) : (r(), d(h, {
+							key: 1,
+							class: "w-4 h-4"
+						}))]),
+						_: 1
+					})), x("h3", H, c(m(u).name), 1)]), x("div", U, [
+						m(u).pending2fa ? (r(), d(C, {
+							key: 0,
+							severity: "warn",
+							value: "2FA",
+							class: "text-xs"
+						})) : f("", !0),
+						m(u).status === "offline" ? (r(), d(C, {
+							key: 1,
+							severity: "danger",
+							value: n.$t("views.instances.offline"),
+							class: "text-xs"
+						}, null, 8, ["value"])) : f("", !0),
+						m(u).active ? (r(), d(C, {
+							key: 2,
+							severity: "success",
+							value: n.$t("views.instances.active")
+						}, null, 8, ["value"])) : f("", !0),
+						e.selectionMode ? f("", !0) : (r(), d(S, {
+							key: 3,
+							severity: "secondary",
+							text: "",
+							rounded: "",
+							class: "cui-icon-sm",
+							onClick: i[1] ||= t((e) => s("open-menu", e), ["stop"])
+						}, {
+							icon: g(() => [x("div", Oe, [
+								x("div", { class: a(["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),
+								x("div", { class: a(["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),
+								x("div", { class: a(["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
+						}))
+					])]),
+					x("div", W, [
+						x("div", { class: a(["w-2 h-2 rounded-full shrink-0", {
+							"bg-green-500": m(u).status === "online",
+							"bg-red-500": m(u).status === "offline",
+							"bg-gray-400": m(u).status === "unknown"
+						}]) }, null, 2),
+						x("span", G, c(m(u).version ? `v${m(u).version}` : m(u).url || ""), 1),
+						m(p) ? (r(), v("span", ke, c(m(p)), 1)) : f("", !0)
+					]),
+					m(u).resources ? (r(), v("div", K, [x("div", Ae, [x("div", {
+						class: a(["h-full rounded-full transition-all duration-300", b(m(u).resources.cpuUsage)]),
+						style: l({ width: `${m(u).resources.cpuUsage}%` })
+					}, null, 6)]), x("div", q, [x("span", null, "CPU " + c(m(u).resources.cpuUsage) + "%", 1), x("span", null, c(_(m(u).resources.memUsed)) + " / " + c(_(m(u).resources.memTotal)), 1)])])) : m(u).hasCredentials ? m(u).pending2fa ? (r(), v("div", X, [x("span", Z, c(n.$t("views.instances.two_factor_pending_hint")), 1)])) : (r(), v("div", je, [x("span", Q, c(m(u).status === "offline" ? n.$t("views.instances.server_offline") : n.$t("views.instances.no_data")), 1)])) : (r(), v("div", J, [x("span", Y, c(n.$t("views.instances.credentials_required")), 1)]))
+				])]),
+				footer: g(() => [x("div", Me, [m(u).cameras ? (r(), v("div", Ne, [x("div", Pe, [w(E, { class: "w-4 h-4" }), x("span", Fe, c(m(u).cameras.online) + "/" + c(m(u).cameras.total), 1)]), x("div", Ie, [w(D, { class: "w-4 h-4 text-red-500" }), x("span", Le, c(m(u).cameras.recording), 1)])])) : f("", !0), m(u).resources ? (r(), v("div", Re, [w(O, { class: "w-4 h-4" }), x("span", ze, c(y(m(u).resources.diskUsed)) + " / " + c(y(m(u).resources.diskTotal)), 1)])) : f("", !0)])]),
+				_: 1
+			}, 8, ["class"]);
+		};
+	}
+}), Ve = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function He(e, t) {
+	return r(), v("svg", Ve, [...t[0] ||= [x("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 = S({
+	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__ */ C({
+	__name: "EditInstanceDialog",
+	props: {
+		currentName: {},
+		currentUrl: {},
+		hasCredentials: { type: Boolean }
+	},
+	setup(e, { expose: t }) {
+		let n = e, { t: i } = me(), a = E(), o = s(n.currentName), l = s(n.currentUrl ?? ""), u = s(""), f = s(""), g = h(() => !n.currentName), _ = h(() => !!n.hasCredentials);
+		return t({ onConfirm: async () => {
+			let e = o.value.trim();
+			if (!e) return null;
+			if (g.value) {
+				let t = l.value.trim();
+				if (!t) return null;
+				let n = u.value.trim();
+				return !n || !f.value ? (a.add({
+					severity: "warn",
+					detail: i("views.settings.instances.credentials_required"),
+					life: 3e3
+				}), null) : {
+					name: e,
+					url: t,
+					credentials: {
+						username: n,
+						password: f.value
+					}
+				};
+			}
+			return {
+				name: e,
+				credentials: u.value.trim() && f.value ? {
+					username: u.value.trim(),
+					password: f.value
+				} : void 0
+			};
+		} }), (t, n) => {
+			let i = P;
+			return r(), v("div", We, [
+				x("div", Ge, [x("label", Ke, c(t.$t("views.settings.instances.name")), 1), w(i, {
+					id: "instanceName",
+					modelValue: m(o),
+					"onUpdate:modelValue": n[0] ||= (e) => p(o) ? o.value = e : null,
+					placeholder: t.$t("views.settings.instances.name"),
+					class: "w-full",
+					autofocus: ""
+				}, null, 8, ["modelValue", "placeholder"])]),
+				x("div", qe, [x("label", Je, c(t.$t("views.settings.instances.url")), 1), m(g) ? (r(), d(i, {
+					key: 0,
+					id: "instanceUrl",
+					modelValue: m(l),
+					"onUpdate:modelValue": n[1] ||= (e) => p(l) ? l.value = e : null,
+					placeholder: t.$t("views.settings.instances.url_placeholder"),
+					class: "w-full"
+				}, null, 8, ["modelValue", "placeholder"])) : (r(), d(i, {
+					key: 1,
+					id: "instanceUrl",
+					"model-value": e.currentUrl,
+					class: "w-full",
+					readonly: ""
+				}, null, 8, ["model-value"]))]),
+				x("div", Ye, [x("label", Xe, c(t.$t("views.settings.instances.credentials_username")), 1), w(i, {
+					id: "credUsername",
+					modelValue: m(u),
+					"onUpdate:modelValue": n[2] ||= (e) => p(u) ? u.value = e : null,
+					placeholder: m(_) ? t.$t("views.settings.instances.credentials_unchanged") : t.$t("views.settings.instances.credentials_username"),
+					class: "w-full",
+					autocomplete: "off"
+				}, null, 8, ["modelValue", "placeholder"])]),
+				x("div", Ze, [x("label", Qe, c(t.$t("views.settings.instances.credentials_password")), 1), w(i, {
+					id: "credPassword",
+					modelValue: m(f),
+					"onUpdate:modelValue": n[3] ||= (e) => p(f) ? f.value = e : null,
+					type: "password",
+					placeholder: m(_) ? 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__ */ C({
+	__name: "Instances",
+	setup(t) {
+		let a = new D(), { t: o } = me(), { smBreakpoint: S } = ne(), { width: C, height: T } = re(), A = ee(), j = E(), M = k(), F = h(() => M.serverInstances.filter((e) => !!e.credentials)), { data: I, isPending: L } = a.listQuery(), { mutateAsync: R } = a.createMutation(), { mutateAsync: Ce } = a.updateMutation(), { mutateAsync: we } = a.deleteMutation(), { mutateAsync: Te } = a.bulkDeleteMutation(), { mutateAsync: Ee } = a.toggleFavoriteMutation(), De = a.statusQueries(F), z, B = b("menuRef"), V = s(!1), H = s(""), U = u({}), Oe = h(() => (S.value ? 1 : Math.max(1, Math.floor(C.value / $))) * Math.max(1, Math.ceil(T.value / 184))), W = h(() => {
+			let e = 0;
+			return M.serverInstances.map((t) => {
+				let n = !!t.credentials;
+				if (!n) return {
+					id: t.id,
+					name: t.name,
+					url: t.url,
+					status: "unknown",
+					active: t.id === M.activeId,
+					favorite: M.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 === M.activeId,
+					favorite: M.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 = h(() => {
+			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 = h(() => [
+			{
+				label: o("views.instances.two_factor_enter_code"),
+				icon: Ue,
+				hide: !B.value?.data?.pending2fa,
+				onClick: (e) => {
+					M.complete2FALogin(e.id, e.name);
+				}
+			},
+			{
+				label: o("views.settings.edit"),
+				icon: ye,
+				onClick: (e) => {
+					let t = Ae(e);
+					t && Le(t);
+				}
+			},
+			{
+				label: o("views.settings.remove"),
+				icon: Se,
+				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 F.value) U[t.id] === void 0 && (U[t.id] = "checking"), M.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 = M.serverInstances.find((t) => t.id === e.id);
+			if (!t) return;
+			let n = M.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 } = se(G, (e) => e.id);
+		function Pe() {
+			if (!Y.value.length || Z.value) return;
+			let e = Y.value.map((e) => e.id);
+			A.openTextDialog({
+				data: {
+					title: o("components.dialog.title.confirm"),
+					contentText: o("views.instances.remove_selected_confirm", { count: e.length }),
+					confirmText: o("views.settings.instances.remove"),
+					loading: V
+				},
+				onConfirm: async () => {
+					Z.value = !0, V.value = !0;
+					try {
+						await Te({ ids: e }), Q();
+					} catch (e) {
+						j.add({
+							severity: "error",
+							detail: e,
+							life: 3e3
+						});
+					} finally {
+						Z.value = !1, V.value = !1;
+					}
+				}
+			});
+		}
+		function Fe(e) {
+			q.value ? Ne(e.id) : e.active || e.status === "offline" || (e.pending2fa ? M.complete2FALogin(e.id, e.name) : e.id === "__home__" ? M.switchInstance(null) : M.switchInstance(e.id));
+		}
+		function Ie() {
+			A.openComponentDialog($e, {
+				data: {
+					title: o("views.instances.add"),
+					confirmText: o("components.form.button.add"),
+					contentProps: {
+						currentName: "",
+						hasCredentials: !1
+					}
+				},
+				onConfirm: async (e) => {
+					if (e) try {
+						let t = await R({
+							name: e.name,
+							url: e.url,
+							credentials: e.credentials
+						});
+						t.requires2fa && await M.complete2FALogin(t.id, t.name);
+					} catch (e) {
+						j.add({
+							severity: "error",
+							detail: e,
+							life: 3e3
+						});
+					}
+				}
+			});
+		}
+		function Le(e) {
+			A.openComponentDialog($e, {
+				data: {
+					title: o("views.settings.instances.edit"),
+					confirmText: o("components.form.button.save"),
+					contentProps: {
+						currentName: e.name,
+						currentUrl: e.url,
+						hasCredentials: e.hasCredentials
+					}
+				},
+				onConfirm: async (t) => {
+					if (t) try {
+						let n = await Ce({
+							id: e.id,
+							data: {
+								name: t.name === e.name ? void 0 : t.name,
+								credentials: t.credentials ?? void 0
+							}
+						});
+						n.requires2fa && await M.complete2FALogin(n.id, n.name);
+					} catch (e) {
+						j.add({
+							severity: "error",
+							detail: e,
+							life: 3e3
+						});
+					}
+				}
+			});
+		}
+		function Re(e) {
+			A.openTextDialog({
+				data: {
+					title: o("components.dialog.title.confirm"),
+					contentText: o("views.settings.instances.confirm_remove"),
+					confirmText: o("views.settings.instances.remove"),
+					loading: V
+				},
+				onConfirm: async () => {
+					V.value = !0;
+					try {
+						await we(e);
+					} catch (e) {
+						j.add({
+							severity: "error",
+							detail: e,
+							life: 3e3
+						});
+					}
+					V.value = !1;
+				}
+			});
+		}
+		return _(I, (e) => {
+			e && (ce(M.serverInstances, e.instances) || (M.serverInstances = e.instances), M.serverHomeId !== e.homeId && (M.serverHomeId = e.homeId));
+		}, { immediate: !0 }), _(F, K, {
+			immediate: !0,
+			deep: !0
+		}), pe(K, ot), i(() => {
+			z?.abort();
+		}), (t, i) => {
+			let a = be, s = N, u = ie, h = ve, _ = ge, b = P, C = he, T = O, E = Be, D = fe, k = te, A = oe;
+			return r(), v("div", et, [
+				m(S) ? f("", !0) : (r(), v("h1", tt, c(t.$t("views.instances.title")), 1)),
+				w(u, { position: "left" }, {
+					default: g(() => [w(s, {
+						severity: "secondary",
+						text: "",
+						class: "cui-button p-2 text-color non-draggable-region",
+						onClick: i[0] ||= (e) => t.$router.push("/menu")
+					}, {
+						icon: g(() => [w(a, { class: "w-6 h-6" })]),
+						_: 1
+					})]),
+					_: 1
+				}),
+				x("div", nt, [w(C, { class: "flex-1" }, {
+					default: g(() => [w(_, null, {
+						default: g(() => [w(h, { class: "w-4 h-4" })]),
+						_: 1
+					}), w(b, {
+						modelValue: m(H),
+						"onUpdate:modelValue": i[1] ||= (e) => p(H) ? H.value = e : null,
+						placeholder: m(o)("views.instances.search"),
+						class: "w-full"
+					}, null, 8, ["modelValue", "placeholder"])]),
+					_: 1
+				})]),
+				w(e, {
+					name: "fade-2",
+					mode: "out-in"
+				}, {
+					default: g(() => [m(L) ? (r(), v("div", {
+						key: "loading",
+						class: "grid w-full gap-2 p-px",
+						style: l({ gridTemplateColumns: `repeat(auto-fill, minmax(${m(S) ? "100%" : `${$}px`}, 1fr))` })
+					}, [(r(!0), v(y, null, n(m(Oe), (e) => (r(), d(T, {
+						key: e,
+						height: `${at}px`,
+						class: "cui-card"
+					}, null, 8, ["height"]))), 128))], 4)) : m(G).length ? (r(), v("div", {
+						key: "content",
+						class: "grid w-full gap-2 p-px",
+						style: l({ gridTemplateColumns: `repeat(auto-fill, minmax(${m(S) ? "100%" : `${$}px`}, 1fr))` })
+					}, [(r(!0), v(y, null, n(m(G), (e) => (r(), d(E, {
+						key: e.id,
+						instance: e,
+						"menu-open": m(B)?.isOpen && m(B)?.data?.id === e.id,
+						"selection-mode": m(q),
+						selected: m(J).has(e.id),
+						onClick: (t) => Fe(e),
+						onToggleFavorite: (t) => m(Ee)(e.id),
+						onOpenMenu: (t) => m(B)?.toggleMenu(t, void 0, e)
+					}, null, 8, [
+						"instance",
+						"menu-open",
+						"selection-mode",
+						"selected",
+						"onClick",
+						"onToggleFavorite",
+						"onOpenMenu"
+					]))), 128))], 4)) : (r(), v("div", rt, [w(D, { class: "w-12 h-12 text-muted" }), x("span", it, c(t.$t("views.instances.no_instances")), 1)]))]),
+					_: 1
+				}),
+				w(A, { "force-visible": m(q) }, {
+					default: g(() => [m(q) ? (r(), v(y, { key: 1 }, [
+						w(k, {
+							grouped: "",
+							"tooltip-props": { value: m(o)("components.form.tooltip.cancel_selection") },
+							"button-props": { severity: "secondary" },
+							icon: m(_e),
+							"icon-props": {
+								width: "100%",
+								height: "100%"
+							},
+							onClick: m(Q)
+						}, null, 8, [
+							"tooltip-props",
+							"icon",
+							"onClick"
+						]),
+						w(k, {
+							grouped: "",
+							"tooltip-props": { value: m(X) ? m(o)("views.instances.deselect_all") : m(o)("views.instances.select_all") },
+							"button-props": { severity: m(X) ? "primary" : "secondary" },
+							icon: m(de),
+							"icon-props": {
+								width: "100%",
+								height: "100%"
+							},
+							onClick: m(Me)
+						}, null, 8, [
+							"tooltip-props",
+							"button-props",
+							"icon",
+							"onClick"
+						]),
+						w(k, {
+							grouped: "",
+							"tooltip-props": { value: m(o)("views.instances.remove_selected") },
+							"button-props": {
+								severity: "danger",
+								disabled: !m(J).size || m(Z)
+							},
+							icon: m(le),
+							"icon-props": {
+								width: "100%",
+								height: "100%"
+							},
+							onClick: Pe
+						}, null, 8, [
+							"tooltip-props",
+							"button-props",
+							"icon"
+						])
+					], 64)) : (r(), v(y, { key: 0 }, [m(W).length ? (r(), d(k, {
+						key: 0,
+						grouped: "",
+						"tooltip-props": { value: m(o)("views.instances.select") },
+						"button-props": { severity: "secondary" },
+						icon: m(ue),
+						"icon-props": {
+							width: "100%",
+							height: "100%"
+						},
+						onClick: m(je)
+					}, null, 8, [
+						"tooltip-props",
+						"icon",
+						"onClick"
+					])) : f("", !0), w(k, {
+						grouped: "",
+						"tooltip-props": { value: t.$t("views.instances.add") },
+						"button-props": { class: "text-white" },
+						icon: m(xe),
+						"icon-props": {
+							width: "30px",
+							height: "30px"
+						},
+						onClick: Ie
+					}, null, 8, ["tooltip-props", "icon"])], 64))]),
+					_: 1
+				}, 8, ["force-visible"]),
+				w(ae, {
+					ref_key: "menuRef",
+					ref: B,
+					items: m(ke),
+					popover: { pt: { content: { class: "p-0! rounded-xl! overflow-hidden!" } } }
+				}, null, 8, ["items"])
+			]);
+		};
+	}
+});
+//#endregion
+export { st as default };