UNPKG

@scalar/api-client

Version:

the open source API testing client

277 lines (276 loc) 9.18 kB
import { defineComponent as $, ref as f, computed as b, watch as E, onMounted as D, createBlock as V, openBlock as d, withCtx as u, createVNode as v, createElementBlock as O, createTextVNode as K, Fragment as j, renderList as F, normalizeClass as A, createSlots as J, unref as g, createCommentVNode as L, withModifiers as q, nextTick as p } from "vue"; import { ScalarButton as G } from "@scalar/components"; import { ScalarIconWarning as H, ScalarIconTrash as P } from "@scalar/icons"; import T from "../../../components/CodeInput/CodeInput.vue.js"; import Q from "../../../components/DataTable/DataTable.vue.js"; import U from "../../../components/DataTable/DataTableCell.vue.js"; import z from "../../../components/DataTable/DataTableHeader.vue.js"; import M from "../../../components/DataTable/DataTableRow.vue.js"; import { useWorkspace as X } from "../../../store/store.js"; const re = /* @__PURE__ */ $({ __name: "EnvironmentForm", props: { collection: {}, environment: {}, workspace: {}, envVariables: {} }, setup(o) { const { collectionMutators: y } = X(), r = f([]), k = f(/* @__PURE__ */ new Set()), w = f(/* @__PURE__ */ new Map()), c = f(!1), x = b(() => { var e; if (!((e = o.environment) != null && e.value)) return [{ key: "", value: "" }]; try { const n = JSON.parse(o.environment.value), l = Object.entries(n).map(([t, a]) => ({ key: t, value: String(a) })); return l.length === 0 ? [{ key: "", value: "" }] : l; } catch { return [{ key: "", value: "" }]; } }), N = b(() => { const e = r.value[r.value.length - 1]; return e ? e.key || e.value ? [...r.value, { key: "", value: "" }] : r.value : [{ key: "", value: "" }]; }), C = b(() => { const e = /* @__PURE__ */ new Map(); return r.value.forEach((n, l) => { if (n.key) { const t = e.get(n.key) || []; t.push(l), e.set(n.key, t); } }), w.value.forEach((n, l) => { if (n) { const t = e.get(n) || []; t.push(l), e.set(n, t); } }), Array.from(e.values()).filter((n) => n.length > 1).flat(); }); E( x, (e) => { r.value = [...e], k.value = new Set(e.map((n) => n.key).filter(Boolean)); }, { immediate: !0 } ); const S = async (e, n, l) => { var t; if (!c.value) { if (n === "key") { w.value.set(e, l); const a = new Set(k.value), s = r.value[e]; if (s && a.delete(s.key), a.has(l)) return; } c.value = !0; try { const a = [...r.value], s = a[e]; if (!s) return; a[e] = { key: n === "key" ? l : s.key, value: n === "value" ? l : s.value }, !a[e].key && !a[e].value && e !== a.length - 1 && a.splice(e, 1); const m = a.reduce( (i, { key: I, value: R }) => ((I || R) && (i[I] = R), i), {} ); if (o.collection) { const i = { ...o.collection["x-scalar-environments"], [o.environment.name]: { ...(t = o.collection["x-scalar-environments"]) == null ? void 0 : t[o.environment.name], variables: m } }; await y.edit( o.collection.uid, "x-scalar-environments", i ); } if (e === r.value.length - 1) { const i = a[a.length - 1]; i && (i.key || i.value) && await h(); } await p(), r.value = a, n === "key" && (k.value = new Set( a.map((i) => i.key).filter(Boolean) ), w.value.delete(e)); } finally { c.value = !1; } } }, h = async () => { var e; if (!c.value) { c.value = !0; try { const n = [...r.value, { key: "", value: "" }], l = n.reduce( (t, { key: a, value: s }) => ((a || s) && (t[a] = s), t), {} ); if (o.collection) { const t = { ...o.collection["x-scalar-environments"], [o.environment.name]: { ...(e = o.collection["x-scalar-environments"]) == null ? void 0 : e[o.environment.name], variables: l } }; await y.edit( o.collection.uid, "x-scalar-environments", t ); } await p(), r.value = n; } finally { c.value = !1; } } }, W = async (e) => { var n; if (!c.value) { c.value = !0; try { const l = [...r.value]; l.splice(e, 1); const t = l.reduce( (a, { key: s, value: m }) => ((s || m) && (a[s] = m), a), {} ); if (o.collection) { const a = { ...o.collection["x-scalar-environments"], [o.environment.name]: { ...(n = o.collection["x-scalar-environments"]) == null ? void 0 : n[o.environment.name], variables: t } }; await y.edit( o.collection.uid, "x-scalar-environments", a ); } await p(), r.value = l; } finally { c.value = !1; } } }, B = async () => { if (r.value.length === 0) await h(); else if (r.value.length >= 1) { const e = r.value[r.value.length - 1]; e && (e.key || e.value) && await h(); } }; return D(() => { B(); }), E( () => r.value, () => { B(); } ), (e, n) => (d(), V(Q, { class: "group/table flex-1", columns: ["", ""] }, { default: u(() => [ v(M, { class: "sr-only !block" }, { default: u(() => [ v(z, null, { default: u(() => n[0] || (n[0] = [ K("Key") ])), _: 1, __: [0] }), v(z, null, { default: u(() => n[1] || (n[1] = [ K("Value") ])), _: 1, __: [1] }) ]), _: 1 }), (d(!0), O(j, null, F(N.value, (l, t) => (d(), V(M, { key: t, class: A({ error: C.value.includes(t) }) }, { default: u(() => [ v(U, null, { default: u(() => [ v(T, { disableCloseBrackets: "", disableEnter: "", disableTabIndent: "", lineWrapping: "", environment: e.environment, envVariables: e.envVariables, modelValue: l.key, placeholder: "Key", workspace: e.workspace, "onUpdate:modelValue": (a) => S(t, "key", a) }, J({ _: 2 }, [ C.value.includes(t) ? { name: "icon", fn: u(() => [ v(g(H), { class: "text-red mr-0.75 size-3.5 brightness-[.9]" }) ]), key: "0" } : void 0 ]), 1032, ["environment", "envVariables", "modelValue", "workspace", "onUpdate:modelValue"]) ]), _: 2 }, 1024), v(U, null, { default: u(() => [ v(T, { class: "pr-6 group-hover:pr-10 group-has-[.cm-focused]:pr-10", disableCloseBrackets: "", disableEnter: "", disableTabIndent: "", lineWrapping: "", environment: e.environment, envVariables: e.envVariables, modelValue: l.value, placeholder: "Value", workspace: e.workspace, "onUpdate:modelValue": (a) => S(t, "value", a) }, { icon: u(() => [ l.key || l.value ? (d(), V(g(G), { key: 0, class: "text-c-2 hover:text-c-1 hover:bg-b-2 z-context hidden h-fit rounded p-1 group-hover:flex group-has-[.cm-focused]:flex", size: "sm", variant: "ghost", onClick: q((a) => W(t), ["stop"]) }, { default: u(() => [ v(g(P), { class: "size-3.5" }) ]), _: 2 }, 1032, ["onClick"])) : L("", !0) ]), _: 2 }, 1032, ["environment", "envVariables", "modelValue", "workspace", "onUpdate:modelValue"]) ]), _: 2 }, 1024) ]), _: 2 }, 1032, ["class"]))), 128)) ]), _: 1 })); } }); export { re as default };