UNPKG

@scalar/api-client

Version:

the open source API testing client

206 lines (205 loc) 7.61 kB
import { defineComponent as $, useId as K, ref as E, computed as p, createBlock as N, openBlock as d, withCtx as f, createVNode as y, unref as i, createElementVNode as a, createElementBlock as S, Fragment as k, createTextVNode as x, toDisplayString as A, createCommentVNode as j, normalizeClass as z } from "vue"; import { useModal as W, ScalarComboboxMultiselect as Y, ScalarButton as F, ScalarIcon as H } from "@scalar/components"; import { safeLocalStorage as J, CLIENT_LS_KEYS as G } from "@scalar/helpers/object/local-storage"; import { isDefined as P } from "@scalar/oas-utils/helpers"; import Q from "../../../../components/ViewLayout/ViewLayoutCollapse.vue.js"; import { useLayout as X } from "../../../../hooks/useLayout.js"; import { useWorkspace as Z } from "../../../../store/store.js"; import _ from "./DeleteRequestAuthModal.vue.js"; import ee from "./RequestAuthDataTable.vue.js"; import { getSecurityRequirements as te, formatComplexScheme as le, formatScheme as oe, getSchemeOptions as ne } from "../../libs/auth.js"; const se = ["id"], re = { class: "-mx-1 flex flex-1" }, ie = { class: "text-c-1" }, ve = /* @__PURE__ */ $({ __name: "RequestAuth", props: { collection: {}, environment: {}, envVariables: {}, layout: {}, operation: {}, persistAuth: { type: Boolean, default: !1 }, selectedSecuritySchemeUids: {}, server: {}, title: {}, workspace: {} }, setup(s) { const { layout: C } = X(), { securitySchemes: u, securitySchemeMutators: O, requestMutators: T, collectionMutators: w } = Z(), q = K(), R = E(null), h = W(), v = E( null ), V = p(() => { const e = te(s.operation, s.collection); return { filteredRequirements: e.filter((n) => Object.keys(n).length), requirements: e }; }), g = p(() => { const { filteredRequirements: e, requirements: t } = V.value; if (!t.length) return null; const o = !t.some( (m) => Object.keys(m).length > 1 ) && e.length < t.length, l = o ? "Unlock" : "Lock", r = o ? "Optional" : "Required", L = `${e.length === 1 ? (() => { const m = Object.keys(e[0] || {}); return m.length > 1 ? m.join(" & ") : m[0] || ""; })() : ""} ${r}`; return { icon: l, text: L }; }), c = p( () => s.selectedSecuritySchemeUids.map((e) => { if (Array.isArray(e)) return le(e, u); const t = u[e ?? ""]; if (t) return oe(t); }).filter(P) ); function M(e) { var o; const t = e.find((l) => l.payload), n = e.filter((l) => !l.payload).map(({ id: l }) => { const r = l.split(","); return r.length > 1 ? r : l; }); if (t != null && t.payload) { const l = O.add( t.payload, (o = s.collection) == null ? void 0 : o.uid ); l && n.push(l.uid); } D(n); } const D = (e) => { var t; if (s.collection.useCollectionSecurity) { if (w.edit(s.collection.uid, "selectedSecuritySchemeUids", e), !s.persistAuth) return; const n = e.map((o) => { var l; return Array.isArray(o) ? o.map((r) => { var b; return (b = u[r]) == null ? void 0 : b.nameKey; }) : (l = u[o]) == null ? void 0 : l.nameKey; }); J().setItem( G.SELECTED_SECURITY_SCHEMES, JSON.stringify(n) ); } else (t = s.operation) != null && t.uid && T.edit(s.operation.uid, "selectedSecuritySchemeUids", e); }; function U({ id: e, label: t }) { v.value = { id: e, label: t }, h.show(); } const B = (e) => { var n; if (!e) return; const t = s.selectedSecuritySchemeUids.filter((o) => { const l = e.split(","); return l.length > 1 && Array.isArray(o) && l.length === o.length ? o.every((r) => !l.includes(r)) : o !== e; }); D(t), (n = R.value) == null || n.$el.focus(), h.hide(); }, I = p( () => { var e; return ne( V.value.filteredRequirements, ((e = s.collection) == null ? void 0 : e.securitySchemes) ?? [], u, C === "modal" || s.layout === "reference" ); } ); return (e, t) => (d(), N(Q, { class: "group/params", itemCount: c.value.length, layout: e.layout }, { title: f(() => [ a("div", { id: i(q), class: "inline-flex items-center gap-1" }, [ a("span", null, A(e.title), 1), g.value ? (d(), S("span", { key: 0, class: z(["text-c-3 text-xs leading-[normal]", { "text-c-1": g.value.text === "Required" }]) }, A(g.value.text), 3)) : j("", !0) ], 8, se) ]), actions: f(() => [ a("div", re, [ y(i(Y), { class: "w-72 text-xs", isDeletable: i(C) !== "modal" && e.layout !== "reference", modelValue: c.value, multiple: "", options: I.value, onDelete: U, "onUpdate:modelValue": M }, { default: f(() => [ y(i(F), { ref_key: "comboboxButtonRef", ref: R, "aria-describedby": i(q), class: "hover:bg-b-3 text-c-1 hover:text-c-1 h-fit px-1.5 py-0.25 font-normal", fullWidth: "", variant: "ghost" }, { default: f(() => { var n; return [ a("div", ie, [ c.value.length === 0 ? (d(), S(k, { key: 0 }, [ t[2] || (t[2] = a("span", { class: "sr-only" }, "Select", -1)), t[3] || (t[3] = x(" Auth Type ")) ], 64)) : c.value.length === 1 ? (d(), S(k, { key: 1 }, [ t[4] || (t[4] = a("span", { class: "sr-only" }, "Selected Auth Type:", -1)), x(" " + A((n = c.value[0]) == null ? void 0 : n.label), 1) ], 64)) : (d(), S(k, { key: 2 }, [ t[5] || (t[5] = x(" Multiple ")), t[6] || (t[6] = a("span", { class: "sr-only" }, "Auth Types Selected", -1)) ], 64)) ]), y(i(H), { class: "ml-1 shrink-0", icon: "ChevronDown", size: "sm" }) ]; }), _: 1 }, 8, ["aria-describedby"]) ]), _: 1 }, 8, ["isDeletable", "modelValue", "options"]) ]) ]), default: f(() => [ y(ee, { collection: e.collection, envVariables: e.envVariables, environment: e.environment, layout: e.layout, persistAuth: e.persistAuth, selectedSchemeOptions: c.value, server: e.server, workspace: e.workspace }, null, 8, ["collection", "envVariables", "environment", "layout", "persistAuth", "selectedSchemeOptions", "server", "workspace"]), y(_, { scheme: v.value, state: i(h), onClose: t[0] || (t[0] = (n) => i(h).hide()), onDelete: t[1] || (t[1] = (n) => { var o; return B((o = v.value) == null ? void 0 : o.id); }) }, null, 8, ["scheme", "state"]) ]), _: 1 }, 8, ["itemCount", "layout"])); } }); export { ve as default };