@scalar/api-client
Version:
the open source API testing client
209 lines (208 loc) • 8.33 kB
JavaScript
import { defineComponent as L, ref as T, computed as h, watchEffect as E, createElementBlock as v, openBlock as i, Fragment as b, createVNode as s, createSlots as j, withCtx as u, createElementVNode as l, normalizeClass as U, renderList as F, createBlock as M, unref as n, toDisplayString as W, createCommentVNode as H, createTextVNode as d } from "vue";
import { useModal as q, ScalarMarkdown as G, ScalarButton as O, ScalarToggle as J, ScalarModal as K } from "@scalar/components";
import { debounce as Q } from "@scalar/helpers/general/debounce";
import { isHttpMethod as C } from "@scalar/helpers/http/is-http-method";
import { ScalarIconTrash as X, ScalarIconPlus as Y } from "@scalar/icons";
import { getResolvedRef as Z } from "@scalar/workspace-store/helpers/get-resolved-ref";
import _ from "../../../../components/Sidebar/Actions/DeleteSidebarListElement.vue.js";
import ee from "../../settings/components/Section.vue.js";
import te from "./Form.vue.js";
import le from "../../../../components/Server/ServerVariablesForm.vue.js";
const re = { class: "flex h-8 items-center" }, ae = { class: "flex flex-col gap-4" }, oe = { class: "bg-b-2 flex items-center justify-between rounded-t-lg px-3 py-1 text-sm" }, se = {
key: 1,
class: "self-center"
}, ne = { class: "divide-0 flex w-full flex-col divide-y rounded-b-lg text-sm" }, ie = { class: "text-c-3 flex h-full items-center justify-center rounded-lg border p-4" }, ge = /* @__PURE__ */ L({
__name: "Servers",
props: {
documentSlug: {},
document: {},
eventBus: {},
layout: {},
path: {},
method: {},
exampleName: {},
environment: {},
securitySchemes: {},
workspaceStore: {},
activeWorkspace: {},
plugins: {},
customThemes: {},
currentTheme: {},
isDarkMode: { type: Boolean },
collectionType: {}
},
setup(t) {
const g = q(), c = T(-1), m = h(() => t.collectionType === "operation"), S = h(() => !m.value || !t.path || !C(t.method) ? null : Z(t.document?.paths?.[t.path]?.[t.method])), f = T(!1);
E(() => {
f.value = S.value?.servers !== void 0;
});
const k = h(() => t.collectionType === "operation" && S.value ? S.value.servers ?? [] : t.document?.servers ?? []), D = h(() => k.value[c.value]), o = h(() => t.collectionType === "operation" && t.path && C(t.method) ? { type: "operation", path: t.path, method: t.method } : { type: "document" }), N = [
{
label: "URL",
key: "url",
placeholder: "https://void.scalar.com"
},
{
label: "Description",
key: "description",
placeholder: "Production"
}
], V = (r) => {
c.value = r, g.show();
}, w = () => {
g.hide(), c.value = -1;
}, R = () => {
c.value < 0 || (t.eventBus.emit("server:delete:server", {
index: c.value,
meta: o.value
}), w());
}, { execute: $ } = Q({ delay: 328, maxWait: 1e3 }), A = (r, e, a) => $(
`${r}-${e}-${o.value.type}`,
() => t.eventBus.emit("server:update:server", {
index: r,
server: { [e]: a },
meta: o.value
})
), I = (r, e, a) => $(
`${r}-${e}-${o.value.type}`,
() => t.eventBus.emit("server:update:variables", {
index: r,
key: e,
value: a,
meta: o.value
})
), z = () => t.eventBus.emit("server:add:server", { meta: o.value }), B = (r, e = 0) => r?.description || `Server ${e + 1}`, P = (r) => {
if (o.value.type === "operation")
return f.value = r, r ? t.eventBus.emit("server:initialize:servers", {
meta: o.value
}) : t.eventBus.emit("server:clear:servers", { meta: o.value });
};
return (r, e) => (i(), v(b, null, [
s(ee, null, j({
title: u(() => [
e[0] || (e[0] = d("Servers", -1))
]),
description: u(() => [
m.value ? (i(), v(b, { key: 0 }, [
e[1] || (e[1] = l("span", { class: "block" }, " Override servers for this operation with the toggle. ", -1)),
e[2] || (e[2] = l("span", { class: "mt-1 block" }, [
l("strong", null, "On"),
d(" — Servers below apply only to this operation. ")
], -1)),
e[3] || (e[3] = l("span", { class: "mt-1 block" }, [
l("strong", null, "Off"),
d(" — Removes operation servers; this operation uses document or path servers from the OpenAPI spec. ")
], -1)),
e[4] || (e[4] = l("span", { class: "text-c-3 mt-1 block" }, [
d(" Use "),
l("code", { class: "font-code text-c-2" }, "{variables}"),
d(" for dynamic URL parts. ")
], -1))
], 64)) : (i(), v(b, { key: 1 }, [
e[5] || (e[5] = d(" Add different base URLs for your API. Use ", -1)),
e[6] || (e[6] = l("code", { class: "font-code text-c-2" }, "{variables}", -1)),
e[7] || (e[7] = d(" for dynamic parts. ", -1))
], 64))
]),
default: u(() => [
l("div", {
class: U(m.value && !f.value && "cursor-not-allowed")
}, [
l("div", {
class: U([
"flex flex-col gap-4",
m.value && !f.value && "pointer-events-none cursor-not-allowed opacity-50 mix-blend-luminosity"
])
}, [
l("div", ae, [
(i(!0), v(b, null, F(k.value, (a, p) => (i(), v("div", {
key: p,
class: "rounded-lg border"
}, [
l("div", oe, [
a.description ? (i(), M(n(G), {
key: 0,
class: "self-center",
value: a.description
}, null, 8, ["value"])) : (i(), v("span", se, W(B(a, p)), 1)),
s(n(O), {
class: "hover:bg-b-3 hover:text-c-1 h-fit p-1.25",
"data-testid": "delete-server-button",
variant: "ghost",
onClick: (y) => V(p)
}, {
default: u(() => [
s(n(X), { class: "size-3.5" })
]),
_: 1
}, 8, ["onClick"])
]),
l("div", ne, [
s(te, {
data: a,
environment: t.environment,
onUpdate: (y, x) => A(p, y, x),
options: N
}, null, 8, ["data", "environment", "onUpdate"]),
a.variables ? (i(), M(n(le), {
key: 0,
variables: a.variables,
"onUpdate:variable": (y, x) => I(p, y, x)
}, null, 8, ["variables", "onUpdate:variable"])) : H("", !0)
])
]))), 128))
]),
l("div", ie, [
s(n(O), {
class: "hover:bg-b-2 hover:text-c-1 flex items-center gap-2",
size: "sm",
variant: "ghost",
onClick: z
}, {
default: u(() => [
s(n(Y)),
e[8] || (e[8] = l("span", null, "Add Server", -1))
]),
_: 1
})
])
], 2)
], 2)
]),
_: 2
}, [
m.value ? {
name: "actions",
fn: u(() => [
l("div", re, [
s(n(J), {
class: "w-4",
modelValue: f.value,
"onUpdate:modelValue": P
}, null, 8, ["modelValue"])
])
]),
key: "0"
} : void 0
]), 1024),
s(n(K), {
size: "xxs",
state: n(g),
title: `Delete ${B(D.value, c.value)}`
}, {
default: u(() => [
s(_, {
variableName: "Server",
warningMessage: "Are you sure you want to delete this server? This action cannot be undone.",
onClose: w,
onDelete: R
})
]),
_: 1
}, 8, ["state", "title"])
], 64));
}
});
export {
ge as default
};