@scalar/api-client
Version:
the open source API testing client
95 lines (94 loc) • 4.08 kB
JavaScript
import { defineComponent as k, ref as y, computed as C, createElementBlock as d, openBlock as r, createElementVNode as a, createVNode as o, createStaticVNode as w, Fragment as A, renderList as M, createBlock as f, createCommentVNode as N, unref as e, toDisplayString as D, withCtx as v } from "vue";
import { useModal as I, ScalarMarkdown as $, ScalarButton as m, ScalarIcon as j, ScalarModal as z } from "@scalar/components";
import { ScalarIconTrash as B } from "@scalar/icons";
import U from "../../components/Sidebar/Actions/DeleteSidebarListElement.vue.js";
import { useActiveEntities as V } from "../../store/active-entities.js";
import E from "./CollectionServerForm.vue.js";
import { useWorkspace as L } from "../../store/store.js";
const P = { class: "flex h-full w-full flex-col gap-12 px-1.5 pt-8" }, T = { class: "flex flex-col gap-4" }, F = { class: "rounded-lg border" }, O = { class: "bg-b-2 flex items-start justify-between rounded-t-lg py-1 pr-1 pl-3 text-sm" }, R = {
key: 1,
class: "self-center"
}, W = { class: "text-c-3 flex h-full items-center justify-center rounded-lg border p-4" }, ee = /* @__PURE__ */ k({
__name: "CollectionServers",
setup(Y) {
const { activeCollection: t } = V(), { servers: u, events: p, serverMutators: x } = L(), i = I(), n = y(null), h = C(() => !u || !t.value?.servers ? [] : Object.values(u).filter(
(c) => t.value?.servers.includes(c.uid)
)), _ = () => p.commandPalette.emit({
commandName: "Add Server"
}), S = () => {
!t.value?.uid || !n.value || (x.delete(n.value, t.value.uid), i.hide());
}, g = (c) => {
n.value = c, i.show();
};
return (c, s) => (r(), d("div", P, [
a("div", T, [
s[2] || (s[2] = w('<div class="flex items-start justify-between gap-2"><div class="flex flex-col gap-2"><div class="flex h-8 items-center"><h3 class="font-bold">Servers</h3></div><p class="text-sm"> Add different base URLs for your API. You can use <code class="font-code text-c-2">{variables}</code> for dynamic parts. </p></div></div>', 1)),
(r(!0), d(A, null, M(h.value, (l, b) => (r(), d("div", {
key: l.uid
}, [
a("div", F, [
a("div", O, [
l.description ? (r(), f(e($), {
key: 0,
class: "self-center",
value: l.description
}, null, 8, ["value"])) : (r(), d("span", R, "Server " + D(b + 1), 1)),
o(e(m), {
class: "hover:bg-b-3 hover:text-c-1 h-fit p-1.25",
variant: "ghost",
onClick: (q) => g(l.uid)
}, {
default: v(() => [
o(e(B), { class: "size-3.5" })
]),
_: 1
}, 8, ["onClick"])
]),
e(t) ? (r(), f(E, {
key: 0,
collectionId: e(t).uid,
serverUid: l.uid
}, null, 8, ["collectionId", "serverUid"])) : N("", !0)
])
]))), 128)),
a("div", W, [
o(e(m), {
class: "hover:bg-b-2 hover:text-c-1 flex items-center gap-2",
size: "sm",
variant: "ghost",
onClick: _
}, {
default: v(() => [
o(e(j), {
class: "inline-flex",
icon: "Add",
size: "sm",
thickness: "1.5"
}),
s[1] || (s[1] = a("span", null, "Add Server", -1))
]),
_: 1
})
])
]),
o(e(z), {
size: "xxs",
state: e(i),
title: `Delete ${n.value ? e(u)[n.value]?.url : "Server"}`
}, {
default: v(() => [
o(U, {
variableName: "Server",
warningMessage: "Are you sure you want to delete this server? This action cannot be undone.",
onClose: s[0] || (s[0] = (l) => e(i).hide()),
onDelete: S
})
]),
_: 1
}, 8, ["state", "title"])
]));
}
});
export {
ee as default
};