import*as r from"react";import{useQuery as y}from"@tanstack/react-query";import{Admonition as l}from"@redocly/theme/markdoc/components/Admonition/Admonition";import g from"../../../../../client/app/CircularProgress";import{MultiSelect as h}from"./MultiSelect";import{parseCombinedId as m}from"../../utils";function A(c){const{onChange:i,initialEnabledApis:o}=c,{isLoading:p,error:s,data:a}=y({queryKey:["API-PRODUCTS"],queryFn:async()=>{const e=await fetch("/api/api-keys/api-products");try{return await e.json()}catch{throw new Error("Something unexpected happened. Please try again later.")}}}),d=(a||[]).sort((e,n)=>e.name.localeCompare(n.name)),t=(a||[]).filter(e=>{const{id:n}=m(e.id);return o.includes(n)});for(const e of o)t.some(u=>{const{id:f}=m(u.id);return f===e})||t.push({id:e,name:e});return r.useEffect(()=>{t.length>0&&i(t.map(e=>e.id))},[t.length]),p?r.createElement(g,null):s?r.createElement(l,{type:"danger"},s.message):a?.length?r.createElement(h,{options:d.map(e=>({label:e.name,value:e.id})),defaultValue:t.map(e=>({label:e.name,value:e.id})),onChange:i}):r.createElement(l,{type:"warning"},"You don't have access to any API.")}export{A as default};
