@wrongstack/webui 0.296.2 → 0.296.4

package/dist/assets/SetupScreen-BiOzT5PT.js

@@ -1 +0,0 @@
-import{r as e}from"./rolldown-runtime-QTnfLwEv.js";import{Bt as t,Fi as n,It as r,Ji as i,Kn as a,Kt as o,Li as s,Ri as c,Zr as l,_r as u,ci as d,cn as f,et as p,ga as m,ia as h,pn as g,rt as _,sr as v,t as y,xa as b,xr as x,ya as S}from"./vendor-9hC4n4Me.js";import"./i18n-CIqbHugq.js";import{t as C}from"./useWebSocket-DLQNx26C.js";import{t as w}from"./ws-client-D0KuNwAk.js";import{t as T}from"./utils-DzRQUvln.js";import{M as ee}from"./stores-nxVpq1NP.js";import{o as E}from"./view-navigation-DuOBOluC.js";import{n as D}from"./Toaster-C6a7sphP.js";import{a as O,n as te,o as ne,r as k,t as A}from"./dialog-BLr7olIX.js";import{t as j}from"./button-Bmh1yFe5.js";import{t as M}from"./input-BRS2rHSR.js";import{c as N,f as P,i as F,o as I,p as L,s as R,y as z}from"./index-Dy7C2V-G.js";var B=e(b(),1);function V(e,t=8e3){return new Promise((n,r)=>{let i=setTimeout(()=>{a(),r(Error(`timeout`))},t),a=e.on(`key.operation_result`,e=>{clearTimeout(i),a(),n(e.payload)})})}var H=p();function re({onKeySaved:e}){let{t}=m(),[r,i]=(0,B.useState)(!1),[o,s]=(0,B.useState)(``),[c,l]=(0,B.useState)(`openai-compatible`),[u,d]=(0,B.useState)(``),[f,p]=(0,B.useState)(``),[h,_]=(0,B.useState)(!1),[v,y]=(0,B.useState)([]),{setFieldRef:b,handleKeyDown:x}=N(),S=async()=>{if(o.trim()){_(!0);try{let n=w(ee.getState().wsUrl),r=V(n);n.send({type:`provider.add`,payload:{id:o.trim(),family:c,baseUrl:u.trim()||void 0,apiKey:f.trim()||void 0,models:v.length>0?v.map(e=>e.id):void 0,customModels:v.length>0?Object.fromEntries(v.filter(e=>e.name||e.maxOutput||e.capabilities).map(e=>[e.id,{...e.name&&e.name!==e.id?{name:e.name}:{},...e.maxOutput?{maxOutput:e.maxOutput}:{},...e.capabilities&&Object.values(e.capabilities).some(Boolean)?{capabilities:e.capabilities}:{}}])):void 0}});let a=await r;if(!a.success)throw Error(a.message);D.success(t(`setup:screen.toasts.providerAdded`,{id:o.trim()})),e(o.trim()),n.listSavedProviders(),n.probeProvider(o.trim()),s(``),d(``),p(``),y([]),i(!1)}catch(e){let n=e instanceof Error&&e.message&&e.message!==`timeout`?e.message:null;D.error(n??t(`setup:screen.toasts.providerAddFailed`))}finally{_(!1)}}};return(0,H.jsxs)(`div`,{className:`rounded-xl border border-dashed border-border/60 overflow-hidden`,children:[(0,H.jsxs)(`button`,{type:`button`,onClick:()=>i(!r),className:`w-full flex items-center gap-3 p-4 text-left hover:bg-muted/30 transition-colors`,children:[(0,H.jsx)(`div`,{className:`w-10 h-10 rounded-lg bg-muted/50 flex items-center justify-center`,children:(0,H.jsx)(g,{className:`h-5 w-5 text-muted-foreground`})}),(0,H.jsxs)(`div`,{className:`flex-1`,children:[(0,H.jsx)(`h3`,{className:`text-sm font-medium`,children:t(`setup:screen.custom.title`)}),(0,H.jsx)(`p`,{className:`text-xs text-muted-foreground`,children:t(`setup:screen.custom.description`)})]}),(0,H.jsx)(n,{className:T(`h-4 w-4 text-muted-foreground transition-transform`,r&&`rotate-90`)})]}),r&&(0,H.jsxs)(`div`,{className:`px-4 pb-4 space-y-3 border-t border-border/40`,children:[(0,H.jsxs)(`div`,{className:`space-y-1.5 pt-3`,children:[(0,H.jsx)(`span`,{className:`text-[11px] font-medium text-muted-foreground block`,children:t(`setup:screen.custom.localServers`)}),(0,H.jsx)(`div`,{className:`flex flex-wrap gap-1.5`,children:I.map(e=>(0,H.jsx)(j,{type:`button`,size:`sm`,variant:o===e.id?`default`:`outline`,onClick:()=>{s(e.id),l(`openai-compatible`),d(e.defaultBaseUrl),e.noAuth&&p(``),y([])},title:e.hint,children:e.label},e.id))})]}),(0,H.jsxs)(`div`,{className:`grid grid-cols-2 gap-3`,children:[(0,H.jsxs)(`div`,{children:[(0,H.jsx)(`span`,{className:`text-[11px] font-medium text-muted-foreground mb-1 block`,children:t(`setup:screen.custom.providerId`)}),(0,H.jsx)(M,{placeholder:`e.g. my-llm`,value:o,onChange:e=>s(e.target.value),className:`text-sm`,ref:b(0),onKeyDown:e=>x(e,0)})]}),(0,H.jsxs)(`div`,{children:[(0,H.jsx)(`span`,{className:`text-[11px] font-medium text-muted-foreground mb-1 block`,children:t(`setup:screen.custom.family`)}),(0,H.jsxs)(`select`,{value:c,onChange:e=>l(e.target.value),className:`flex h-9 w-full rounded-md border border-input bg-transparent px-3 text-sm`,ref:b(1),onKeyDown:e=>x(e,1),children:[(0,H.jsx)(`option`,{value:`openai-compatible`,children:t(`setup:screen.custom.familyOpenAiCompatible`)}),(0,H.jsx)(`option`,{value:`openai`,children:`OpenAI`}),(0,H.jsx)(`option`,{value:`anthropic`,children:`Anthropic`}),(0,H.jsx)(`option`,{value:`google`,children:`Google`})]})]})]}),(0,H.jsxs)(`div`,{children:[(0,H.jsx)(`span`,{className:`text-[11px] font-medium text-muted-foreground mb-1 block`,children:t(`setup:screen.custom.baseUrl`)}),(0,H.jsx)(M,{placeholder:`e.g. http://localhost:11434/v1`,value:u,onChange:e=>d(e.target.value),className:`text-sm font-mono`,ref:b(2),onKeyDown:e=>x(e,2)})]}),(0,H.jsxs)(`div`,{children:[(0,H.jsx)(`span`,{className:`text-[11px] font-medium text-muted-foreground mb-1 block`,children:t(`setup:screen.custom.apiKey`)}),(0,H.jsx)(M,{type:`password`,placeholder:t(`setup:screen.custom.apiKeyPlaceholder`),value:f,onChange:e=>p(e.target.value),className:`text-sm font-mono`,ref:b(3),onKeyDown:e=>x(e,3)})]}),(0,H.jsx)(F,{models:v,onChange:y}),(0,H.jsxs)(j,{onClick:S,disabled:!o.trim()||h,size:`sm`,ref:b(4),onKeyDown:e=>x(e,4,S),children:[h?(0,H.jsx)(a,{className:`h-4 w-4 animate-spin mr-2`}):null,t(`setup:screen.custom.add`)]})]})]})}var U=R();async function ie(e,t){try{let n=await fetch(e,{signal:t});if(!n.ok)throw Error(`HTTP ${n.status}`);let r=await n.json();if(!Array.isArray(r))throw Error(`Expected JSON array`);let i=r.filter(e=>typeof e.id==`string`&&typeof e.name==`string`&&typeof e.family==`string`);return i.length>0?i:U}catch{return U}}function ae(e,t){let n=new Date().getTime()-e.getTime(),r=Math.floor(n/1e3);if(r<10)return t(`setup:screen.time.justNow`);if(r<60)return t(`setup:screen.time.secondsAgo`,{count:r});let i=Math.floor(r/60);if(i<60)return t(`setup:screen.time.minutesAgo`,{count:i});let a=Math.floor(i/60);return a<24?t(`setup:screen.time.hoursAgo`,{count:a}):t(`setup:screen.time.daysAgo`,{count:Math.floor(a/24)})}var oe=e(y(),1);function se({popular:e,catalogProvider:t,savedProvider:r,onKeySaved:i,probeResult:u}){let{t:f}=m(),[p,h]=(0,B.useState)(``),[g,_]=(0,B.useState)(!1),[v,y]=(0,B.useState)(!!r?.apiKeys.some(e=>e.isActive)),[b,S]=(0,B.useState)(!1),[C,E]=(0,B.useState)(!1),[N,P]=(0,B.useState)(!1),[F,I]=(0,B.useState)(null);(0,B.useEffect)(()=>{N&&e.referral&&oe.toDataURL(e.referral.url,{width:200,margin:2,color:{dark:`#000000`,light:`#ffffff`}}).then(e=>I(e)).catch(()=>I(null))},[N,e.referral]);let L=async()=>{if(p.trim()){_(!0);try{let n=w(ee.getState().wsUrl),r=V(n);t?n.addKey(e.id,`default`,p.trim()):n.send({type:`provider.add`,payload:{id:e.id,family:e.family,apiKey:p.trim()}});let a=await r;if(!a.success)throw Error(a.message);y(!0),h(``),D.success(f(`setup:screen.toasts.keySaved`,{name:e.name})),i(e.id),n.listSavedProviders(),n.probeProvider(e.id)}catch(t){let n=t instanceof Error&&t.message&&t.message!==`timeout`?t.message:null;D.error(n??f(`setup:screen.toasts.keySaveFailed`,{name:e.name}))}finally{_(!1)}}},R=e=>{e.key===`Enter`&&p.trim()&&L()},z=async()=>{if(e.referral)try{await navigator.clipboard.writeText(e.referral.url),E(!0),D.success(f(`setup:screen.toasts.referralCopied`)),setTimeout(()=>E(!1),2e3)}catch{D.error(f(`setup:screen.toasts.referralCopyFailed`))}},re=t&&t.modelCount>0;return(0,H.jsxs)(`div`,{className:T(`rounded-xl border p-4 transition-all`,v?`border-success/30 bg-success/5`:`bg-gradient-to-br ${e.color}`),children:[(0,H.jsxs)(`div`,{className:`flex items-start gap-3`,children:[(0,H.jsx)(`span`,{className:`text-2xl shrink-0 mt-0.5`,children:e.icon}),(0,H.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,H.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,H.jsx)(`h3`,{className:`text-sm font-semibold`,children:e.name}),v&&(0,H.jsxs)(`span`,{className:`inline-flex items-center gap-1 text-[10px] px-1.5 py-0.5 rounded-full bg-success/10 text-success border border-success/20`,children:[(0,H.jsx)(c,{className:`h-2.5 w-2.5`}),f(`setup:screen.card.keySaved`)]}),e.referral&&!v&&(0,H.jsxs)(`span`,{className:`inline-flex items-center gap-1 text-[10px] px-1.5 py-0.5 rounded-full bg-warning/10 text-warning border border-warning/20`,children:[(0,H.jsx)(x,{className:`h-2.5 w-2.5`}),f(`setup:screen.card.referral`)]})]}),(0,H.jsx)(`p`,{className:`text-xs text-muted-foreground mt-0.5`,children:e.description}),e.referral&&!v&&(0,H.jsxs)(`p`,{className:`text-[11px] text-warning/80 mt-1`,children:[`🎁 `,e.referral.reward]}),v?v?(0,H.jsxs)(`div`,{className:`mt-3 space-y-1`,children:[r?.baseUrl&&(0,H.jsxs)(`div`,{className:`text-[11px] text-muted-foreground/70 font-mono truncate`,title:r.baseUrl,children:[(0,H.jsx)(`span`,{className:`text-muted-foreground/50`,children:`URL: `}),r.baseUrl]}),r?.models&&r.models.length>0&&(0,H.jsxs)(`div`,{className:`text-[11px] text-muted-foreground/70`,children:[(0,H.jsx)(`span`,{className:`text-muted-foreground/50`,children:`Models: `}),r.pickedModelId??r.models[0],(0,H.jsxs)(`span`,{className:`text-muted-foreground/50`,children:[` (+`,r.models.length-1,` more)`]})]}),u===`probing`?(0,H.jsxs)(`div`,{className:`flex items-center gap-1.5 text-[11px] text-muted-foreground mt-1`,children:[(0,H.jsx)(a,{className:`h-3 w-3 animate-spin`}),f(`setup:screen.probe.checking`,`Checking connection…`)]}):u&&u.ok?(0,H.jsxs)(`div`,{className:`flex items-center gap-1.5 text-[11px] text-success mt-1`,children:[(0,H.jsx)(c,{className:`h-3 w-3`}),(0,H.jsxs)(`span`,{children:[f(`setup:screen.probe.connected`,`Connected`),u.modelCount!=null&&` · ${u.modelCount} ${f(`setup:screen.probe.models`,`models`)}`,u.elapsedMs!=null&&` · ${u.elapsedMs}ms`]})]}):u&&!u.ok?(0,H.jsxs)(`div`,{className:`flex items-start gap-1.5 text-[11px] text-destructive mt-1`,children:[(0,H.jsx)(`span`,{className:`mt-0.5 shrink-0`,children:`✕`}),(0,H.jsxs)(`div`,{className:`min-w-0`,children:[(0,H.jsx)(`span`,{className:`font-medium`,children:f(`setup:screen.probe.failed`,`Probe failed`)}),u.status===`no_base_url`&&(0,H.jsx)(`span`,{className:`block text-destructive/70`,children:f(`setup:screen.probe.noBaseUrl`,`No base URL configured`)}),u.status===`unreachable`&&(0,H.jsxs)(`span`,{className:`block text-destructive/70`,children:[f(`setup:screen.probe.unreachable`,`Could not connect`),u.detail?`: ${u.detail}`:``]}),u.status!==`no_base_url`&&u.status!==`unreachable`&&(0,H.jsxs)(H.Fragment,{children:[(0,H.jsx)(`span`,{className:`block text-destructive/70`,children:u.httpStatus==null?u.status:`${f(`setup:screen.probe.httpStatus`,`Status`)} ${u.httpStatus}`}),u.detail&&(0,H.jsx)(`span`,{className:`block text-destructive/70 truncate max-w-[250px]`,title:u.detail,children:u.detail})]})]})]}):null,re&&(0,H.jsxs)(`button`,{type:`button`,onClick:()=>S(!b),className:`text-[11px] text-muted-foreground hover:text-foreground transition-colors flex items-center gap-1`,children:[f(`setup:screen.providers.modelsAvailable`,{count:t?.modelCount??0}),b?(0,H.jsx)(s,{className:`h-3 w-3`}):(0,H.jsx)(n,{className:`h-3 w-3`})]})]}):null:(0,H.jsxs)(`div`,{className:`mt-3 space-y-2`,children:[(0,H.jsxs)(`div`,{className:`flex gap-2`,children:[(0,H.jsx)(M,{type:`password`,placeholder:e.keyPlaceholder,value:p,onChange:e=>h(e.target.value),onKeyDown:R,className:`font-mono text-sm`}),(0,H.jsx)(j,{onClick:L,disabled:!p.trim()||g,size:`sm`,className:`shrink-0`,children:g?(0,H.jsx)(a,{className:`h-4 w-4 animate-spin`}):f(`setup:screen.card.save`)})]}),e.docsUrl&&(0,H.jsxs)(`a`,{href:e.docsUrl,target:`_blank`,rel:`noopener noreferrer`,className:`inline-flex items-center gap-1 text-[11px] text-muted-foreground hover:text-foreground transition-colors`,children:[f(`setup:screen.card.getKey`),` `,(0,H.jsx)(l,{className:`h-3 w-3`})]}),e.referral&&(0,H.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,H.jsx)(`button`,{type:`button`,onClick:z,className:`inline-flex items-center gap-1 text-[11px] text-warning/80 hover:text-warning transition-colors`,children:C?(0,H.jsxs)(H.Fragment,{children:[(0,H.jsx)(c,{className:`h-3 w-3`}),` `,f(`setup:screen.card.copied`)]}):(0,H.jsxs)(H.Fragment,{children:[(0,H.jsx)(d,{className:`h-3 w-3`}),` `,f(`setup:screen.card.copyReferral`)]})}),(0,H.jsxs)(`button`,{type:`button`,onClick:()=>P(!0),className:`inline-flex items-center gap-1 text-[11px] text-warning/80 hover:text-warning transition-colors`,children:[(0,H.jsx)(o,{className:`h-3 w-3`}),` `,f(`setup:screen.card.share`)]})]})]})]})]}),(0,H.jsx)(A,{open:N,onOpenChange:P,children:(0,H.jsxs)(te,{className:`sm:max-w-md`,children:[(0,H.jsxs)(O,{children:[(0,H.jsxs)(ne,{className:`flex items-center gap-2`,children:[(0,H.jsx)(x,{className:`h-4 w-4 text-warning`}),f(`setup:screen.share.title`,{name:e.name})]}),(0,H.jsx)(k,{children:f(`setup:screen.share.description`)})]}),(0,H.jsx)(`div`,{className:`flex flex-col items-center gap-4 py-4`,children:e.referral&&(0,H.jsxs)(H.Fragment,{children:[(0,H.jsx)(`div`,{className:`text-sm text-center`,children:(0,H.jsxs)(`p`,{className:`font-medium text-warning`,children:[`🎁 `,e.referral.reward]})}),F?(0,H.jsx)(`div`,{className:`rounded-lg border border-border p-2 bg-white`,children:(0,H.jsx)(`img`,{src:F,alt:f(`setup:screen.card.qrAlt`,{name:e.name}),className:`w-[200px] h-[200px]`})}):(0,H.jsx)(`div`,{className:`w-[200px] h-[200px] rounded-lg border border-border flex items-center justify-center bg-muted`,children:(0,H.jsx)(a,{className:`h-6 w-6 animate-spin text-muted-foreground`})}),(0,H.jsxs)(`div`,{className:`w-full space-y-2`,children:[(0,H.jsxs)(`div`,{className:`flex items-center justify-center gap-2`,children:[(0,H.jsxs)(`button`,{type:`button`,onClick:()=>{let t=encodeURIComponent(`Check out ${e.name}! 🎁 ${e.referral.reward}`),n=encodeURIComponent(e.referral.url);window.open(`https://twitter.com/intent/tweet?text=${t}&url=${n}`,`_blank`,`noopener,noreferrer`)},className:`inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-border bg-card text-xs text-foreground hover:bg-muted transition-colors`,title:f(`setup:screen.share.twitter`),children:[(0,H.jsx)(`svg`,{role:`img`,"aria-hidden":`true`,className:`h-3.5 w-3.5`,fill:`currentColor`,viewBox:`0 0 24 24`,children:(0,H.jsx)(`path`,{d:`M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z`})}),`X`]}),(0,H.jsxs)(`button`,{type:`button`,onClick:()=>{let t=encodeURIComponent(e.referral.url),n=encodeURIComponent(`Check out ${e.name}! ${e.referral.reward}`);window.open(`https://www.linkedin.com/sharing/share-offsite/?url=${t}&summary=${n}`,`_blank`,`noopener,noreferrer`)},className:`inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-border bg-card text-xs text-foreground hover:bg-muted transition-colors`,title:f(`setup:screen.share.linkedin`),children:[(0,H.jsx)(`svg`,{role:`img`,"aria-hidden":`true`,className:`h-3.5 w-3.5`,fill:`currentColor`,viewBox:`0 0 24 24`,children:(0,H.jsx)(`path`,{d:`M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z`})}),`LinkedIn`]}),(0,H.jsxs)(`button`,{type:`button`,onClick:()=>{let t=encodeURIComponent(`Check out ${e.name}! 🎁 ${e.referral.reward} ${e.referral.url}`);window.open(`https://t.me/share/url?url=${t}`,`_blank`,`noopener,noreferrer`)},className:`inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-border bg-card text-xs text-foreground hover:bg-muted transition-colors`,title:f(`setup:screen.share.telegram`),children:[(0,H.jsx)(`svg`,{role:`img`,"aria-hidden":`true`,className:`h-3.5 w-3.5`,fill:`currentColor`,viewBox:`0 0 24 24`,children:(0,H.jsx)(`path`,{d:`M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z`})}),`Telegram`]}),(0,H.jsxs)(`button`,{type:`button`,onClick:()=>{let t=encodeURIComponent(`Check out ${e.name}! 🎁 ${e.referral.reward}`),n=encodeURIComponent(e.referral.url);window.open(`https://wa.me/?text=${t}%20${n}`,`_blank`,`noopener,noreferrer`)},className:`inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-border bg-card text-xs text-foreground hover:bg-muted transition-colors`,title:f(`setup:screen.share.whatsapp`),children:[(0,H.jsx)(`svg`,{role:`img`,"aria-hidden":`true`,className:`h-3.5 w-3.5`,fill:`currentColor`,viewBox:`0 0 24 24`,children:(0,H.jsx)(`path`,{d:`M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.134 1.585 5.934L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z`})}),`WhatsApp`]}),(0,H.jsxs)(`button`,{type:`button`,onClick:()=>{let t=encodeURIComponent(e.referral.url),n=encodeURIComponent(`${e.name} - ${e.referral.reward}`);window.open(`https://www.reddit.com/submit?url=${t}&title=${n}`,`_blank`,`noopener,noreferrer`)},className:`inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-border bg-card text-xs text-foreground hover:bg-muted transition-colors`,title:f(`setup:screen.share.reddit`),children:[(0,H.jsx)(`svg`,{role:`img`,"aria-hidden":`true`,className:`h-3.5 w-3.5`,fill:`currentColor`,viewBox:`0 0 24 24`,children:(0,H.jsx)(`path`,{d:`M12 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0zm5.01 4.744c.688 0 1.25.561 1.25 1.249a1.25 1.25 0 0 1-2.498.056l-2.597-.547-.8 3.747c1.824.07 3.48.632 4.674 1.488.308-.309.73-.491 1.207-.491.968 0 1.754.786 1.754 1.754 0 .716-.435 1.333-1.01 1.614a3.111 3.111 0 0 1 .042.52c0 2.694-3.13 4.87-7.004 4.87-3.874 0-7.004-2.176-7.004-4.87 0-.183.015-.366.043-.534A1.748 1.748 0 0 1 4.028 12c0-.968.786-1.754 1.754-1.754.463 0 .898.196 1.207.49 1.207-.883 2.878-1.43 4.744-1.487l.885-4.182a.342.342 0 0 1 .14-.197.35.35 0 0 1 .238-.042l2.906.617a1.214 1.214 0 0 0 1.108-.701 1.25 1.25 0 0 1 2.144.33zm-8.811 8.748c-.968 0-1.754.786-1.754 1.754 0 .968.786 1.754 1.754 1.754.968 0 1.754-.786 1.754-1.754 0-.968-.786-1.754-1.754-1.754zm7.944 0c-.968 0-1.754.786-1.754 1.754 0 .968.786 1.754 1.754 1.754.968 0 1.754-.786 1.754-1.754 0-.968-.786-1.754-1.754-1.754z`})}),`Reddit`]}),(0,H.jsxs)(`button`,{type:`button`,onClick:()=>{let t=encodeURIComponent(`Check out ${e.name}! 🎁 ${e.referral.reward}`),n=encodeURIComponent(e.referral.url);window.open(`https://www.facebook.com/sharer/sharer.php?u=${n}&quote=${t}`,`_blank`,`noopener,noreferrer`)},className:`inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-border bg-card text-xs text-foreground hover:bg-muted transition-colors`,title:f(`setup:screen.share.facebook`),children:[(0,H.jsx)(`svg`,{role:`img`,"aria-hidden":`true`,className:`h-3.5 w-3.5`,fill:`currentColor`,viewBox:`0 0 24 24`,children:(0,H.jsx)(`path`,{d:`M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z`})}),`Facebook`]}),(0,H.jsxs)(`button`,{type:`button`,onClick:()=>{let t=encodeURIComponent(`Check out ${e.name}! 🎁 ${e.referral.reward}`),n=encodeURIComponent(e.referral.url);window.open(`mailto:?subject=${t}&body=${n}`,`_blank`,`noopener,noreferrer`)},className:`inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg bg-muted text-muted-foreground text-xs hover:bg-muted/80 transition-colors`,title:f(`setup:screen.share.email`),children:[(0,H.jsx)(`svg`,{role:`img`,"aria-hidden":`true`,className:`h-3.5 w-3.5`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,viewBox:`0 0 24 24`,children:(0,H.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,d:`M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25H4.5a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75`})}),`Email`]})]}),(0,H.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,H.jsx)(M,{value:e.referral.url,readOnly:!0,className:`font-mono text-xs flex-1`}),(0,H.jsx)(j,{size:`sm`,variant:`outline`,onClick:z,className:`shrink-0`,children:C?(0,H.jsx)(c,{className:`h-4 w-4`}):(0,H.jsx)(d,{className:`h-4 w-4`})})]}),(0,H.jsx)(`p`,{className:`text-[11px] text-muted-foreground text-center`,children:f(`setup:screen.share.hint`)})]})]})})]})})]})}function W(){let{t:e}=m(),{model:o,setProvider:s,setModel:l,wsConnected:d,wsUrl:p}=ee(_(e=>({model:e.model,setProvider:e.setProvider,setModel:e.setModel,wsConnected:e.wsConnected,wsUrl:e.wsUrl})));C();let[g,y]=(0,B.useState)([]),[b,x]=(0,B.useState)({}),[O,te]=(0,B.useState)([]),[ne,k]=(0,B.useState)(!1),[A,M]=(0,B.useState)(null),[N,F]=(0,B.useState)(0),[I,R]=(0,B.useState)(new Set),[V,oe]=(0,B.useState)({}),[W,ce]=(0,B.useState)(U),[G,K]=(0,B.useState)(!1),[le,ue]=(0,B.useState)(0),[de,fe]=(0,B.useState)(0),[q,pe]=(0,B.useState)(null),J=(0,B.useRef)(!0);(0,B.useEffect)(()=>{let e=new AbortController,t=`${window.location.origin}/providers.json`;return K(!0),ie(t,e.signal).then(t=>{if(t!==U){if(ce(t),K(!1),!J.current){let e=t.length-de;e>0?D.success(S.t(`setup:screen.toasts.providersLoadedNew`,{count:t.length,diff:e})):e<0?D.success(S.t(`setup:screen.toasts.providersLoadedRemoved`,{count:t.length,diff:Math.abs(e)})):D.success(S.t(`setup:screen.toasts.providersLoadedNoChanges`,{count:t.length})),fe(t.length)}pe(new Date);return}return ie(`https://raw.githubusercontent.com/WrongStack/WrongStack/main/packages/webui/public/providers.json`,e.signal)}).then(e=>{if(e){if(ce(e),!J.current){let t=e.length-de;t>0?D.success(S.t(`setup:screen.toasts.providersLoadedNew`,{count:e.length,diff:t})):t<0?D.success(S.t(`setup:screen.toasts.providersLoadedRemoved`,{count:e.length,diff:Math.abs(t)})):D.success(S.t(`setup:screen.toasts.providersLoadedNoChanges`,{count:e.length})),fe(e.length)}pe(new Date)}}).catch(()=>{J.current||D.error(S.t(`setup:screen.toasts.providersRefreshFailed`))}).finally(()=>{K(!1),J.current=!1}),()=>e.abort()},[le]);let[Y,me]=(0,B.useState)(null),[X,Z]=(0,B.useState)(null),[he,ge]=(0,B.useState)(!1);(0,B.useEffect)(()=>{if(!d)return;let e=w(p),t=setTimeout(()=>{t=null,k(!1),M(S.t(`setup:screen.errors.backendNotResponding`))},8e3),n=()=>{t&&=(clearTimeout(t),null)},r=e.on(`provider.catalog`,e=>{if(e.type===`provider.catalog`){n(),M(null);let t=e.payload.providers.sort((e,t)=>e.id.localeCompare(t.id));y(t),k(!1)}}),i=e.on(`provider.models`,e=>{if(e.type===`provider.models`){let t=e.payload;if(t.provider!==Y)return;x(e=>({...e,[t.provider]:t.models})),ge(!1),t.models.length===1?Z(t.models[0].id):o&&t.models.some(e=>e.id===o)&&Z(o)}}),a=e.on(`providers.saved`,e=>{if(e.type===`providers.saved`){let t=e.payload.providers.sort((e,t)=>e.id.localeCompare(t.id));te(t);let n=new Set(t.filter(e=>e.apiKeys.some(e=>e.isActive)).map(e=>e.id));R(n)}}),s=e.on(`provider.probe`,e=>{if(e.type!==`provider.probe`)return;let t=e.payload;oe(e=>({...e,[t.providerId]:t}))});return M(null),k(!0),e.listProviders(),()=>{n(),r?.(),i?.(),a?.(),s?.()}},[d,p,o,N]);let _e=(0,B.useCallback)(()=>{M(null),F(e=>e+1)},[]),ve=(0,B.useCallback)(()=>{ue(e=>e+1)},[]),ye=(0,B.useCallback)(t=>ae(t,e),[e]),be=(0,B.useCallback)(e=>{R(t=>new Set([...t,e])),me(e),Z(null)},[]),xe=I.size>0;(0,B.useEffect)(()=>{if(!Y||!d)return;let e=w(p);b[Y]||(ge(!0),e.listProviderModels(Y))},[Y,d,p,b]);let Se=Y?b[Y]??[]:[],Ce=(0,B.useCallback)(async()=>{if(!Y||!X)return;if(!I.has(Y)){D.error(`Please save the provider configuration before starting a session.`);return}s(Y),l(X);let e=w(p),t=await e.switchModel(Y,X,5e3);t.success?(e.newSession(),E(`chat`)):D.error(t.message||S.t(`setup:screen.errors.modelSwitchTimeout`))},[Y,X,s,l,p]),we=(0,B.useCallback)(async()=>{if(!Y||!X)return;s(Y),l(X);let e=await w(p).switchModel(Y,X,5e3);e.success?E(`chat`):D.error(e.message||S.t(`setup:screen.errors.modelSwitchTimeout`))},[Y,X,s,l,p]),Te=new Set(W.map(e=>e.id)),Ee=g.filter(e=>!Te.has(e.id)).sort((e,t)=>e.id.localeCompare(t.id)),Q=L(Ee,10);L(O,9);let $=L(Se,12,Y);return(0,H.jsxs)(`div`,{className:`flex h-full min-h-0 min-w-0 flex-col`,children:[(0,H.jsxs)(`header`,{className:`flex shrink-0 flex-col gap-3 border-b bg-card px-4 py-4 sm:flex-row sm:items-center sm:justify-between sm:px-6`,children:[(0,H.jsxs)(`div`,{className:`flex min-w-0 items-center gap-3`,children:[(0,H.jsx)(`img`,{src:`/wrongstack.svg`,alt:`WrongStack`,draggable:!1,className:`ws-brand-logo h-10 w-10 shrink-0 border border-border/70 shadow-sm`}),(0,H.jsxs)(`div`,{className:`min-w-0`,children:[(0,H.jsx)(`h1`,{className:`truncate text-lg font-semibold`,children:e(`setup:screen.header.title`)}),(0,H.jsx)(`p`,{className:`text-xs text-muted-foreground sm:truncate`,children:e(`setup:screen.header.subtitle`)})]})]}),xe&&Y?(0,H.jsxs)(`span`,{className:`text-xs text-success/80`,children:[(0,H.jsx)(c,{className:`h-3 w-3 inline-block mr-1`}),e(`setup:screen.header.continue`)]}):null]}),(0,H.jsx)(z,{className:`min-h-0 flex-1`,children:(0,H.jsxs)(`div`,{className:`mx-auto max-w-3xl space-y-8 p-4 pb-4 sm:p-6`,children:[(0,H.jsxs)(`div`,{className:`flex flex-wrap items-center gap-x-2 gap-y-1 text-sm`,children:[(0,H.jsxs)(`div`,{className:T(`flex min-w-0 items-center gap-1.5`,xe?`text-success`:`text-primary font-medium`),children:[(0,H.jsx)(v,{className:`h-4 w-4`}),(0,H.jsx)(`span`,{children:e(`setup:screen.steps.addKeys`)})]}),(0,H.jsx)(n,{className:`h-4 w-4 shrink-0 text-muted-foreground`}),(0,H.jsxs)(`div`,{className:T(`flex min-w-0 items-center gap-1.5`,Y?`text-primary font-medium`:`text-muted-foreground`),children:[(0,H.jsx)(i,{className:`h-4 w-4`}),(0,H.jsx)(`span`,{children:e(`setup:screen.steps.pickModel`)})]}),(0,H.jsx)(n,{className:`h-4 w-4 shrink-0 text-muted-foreground`}),(0,H.jsxs)(`div`,{className:T(`flex min-w-0 items-center gap-1.5`,Y&&X?`text-primary font-medium`:`text-muted-foreground`),children:[(0,H.jsx)(r,{className:`h-4 w-4`}),(0,H.jsx)(`span`,{children:e(`setup:screen.steps.start`)})]})]}),(0,H.jsxs)(`div`,{className:`flex items-start gap-3 rounded-xl border border-primary/20 bg-primary/5 p-4`,children:[(0,H.jsx)(t,{className:`h-5 w-5 text-primary shrink-0 mt-0.5`}),(0,H.jsxs)(`div`,{children:[(0,H.jsx)(`p`,{className:`text-sm font-medium`,children:e(`setup:screen.security.title`)}),(0,H.jsx)(`p`,{className:`text-xs text-muted-foreground mt-0.5`,children:e(`setup:screen.security.body`)})]})]}),A?(0,H.jsxs)(`div`,{className:`flex flex-col items-center text-center gap-4 py-12 rounded-xl border border-destructive/30 bg-destructive/5 px-6`,children:[(0,H.jsx)(`div`,{className:`w-12 h-12 rounded-xl bg-destructive/10 border border-destructive/30 flex items-center justify-center`,children:(0,H.jsx)(u,{className:`h-6 w-6 text-destructive`})}),(0,H.jsxs)(`div`,{children:[(0,H.jsx)(`p`,{className:`text-sm font-medium text-destructive`,children:e(`setup:screen.errors.backendUnreachable`)}),(0,H.jsx)(`p`,{className:`text-xs text-muted-foreground mt-1 max-w-sm`,children:A})]}),(0,H.jsxs)(j,{onClick:_e,size:`sm`,variant:`outline`,children:[(0,H.jsx)(a,{className:`h-4 w-4 mr-2`}),e(`setup:screen.errors.retry`)]})]}):(0,H.jsxs)(H.Fragment,{children:[(0,H.jsxs)(`div`,{className:`space-y-3`,children:[(0,H.jsxs)(`div`,{className:`flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between`,children:[(0,H.jsx)(`h2`,{className:`text-sm font-medium text-muted-foreground uppercase tracking-wider`,children:e(`setup:screen.providers.popular`)}),(0,H.jsxs)(`div`,{className:`flex flex-wrap items-center gap-2`,children:[G&&(0,H.jsxs)(`span`,{className:`inline-flex items-center gap-1 text-[11px] text-muted-foreground`,children:[(0,H.jsx)(a,{className:`h-3 w-3 animate-spin`}),e(`setup:screen.providers.updating`)]}),q&&!G&&(0,H.jsx)(`span`,{className:`text-[11px] text-muted-foreground`,title:q.toLocaleString(),children:ye(q)}),(0,H.jsxs)(`button`,{type:`button`,onClick:ve,disabled:G,className:`inline-flex items-center gap-1 text-[11px] text-muted-foreground hover:text-foreground transition-colors disabled:opacity-50 disabled:cursor-not-allowed`,title:e(`setup:screen.providers.refreshTitle`),children:[(0,H.jsx)(f,{className:T(`h-3 w-3`,G&&`animate-spin`)}),e(`setup:screen.providers.refresh`)]})]})]}),(0,H.jsx)(`div`,{className:`grid grid-cols-1 sm:grid-cols-2 gap-3`,children:W.map(e=>(0,H.jsx)(se,{popular:e,catalogProvider:g.find(t=>t.id===e.id),savedProvider:O.find(t=>t.id===e.id),onKeySaved:be,probeResult:V[e.id]},e.id))})]}),Ee.length>0&&(0,H.jsxs)(`div`,{className:`space-y-3`,children:[(0,H.jsx)(`h2`,{className:`text-sm font-medium text-muted-foreground uppercase tracking-wider`,children:e(`setup:screen.providers.more`)}),(0,H.jsx)(`div`,{className:`grid grid-cols-1 sm:grid-cols-2 gap-3`,children:Q.pageItems.map(t=>(0,H.jsx)(se,{popular:{id:t.id,name:t.name,description:e(`setup:screen.providers.catalogDescription`,{family:t.family,count:t.modelCount}),icon:`🔗`,color:`from-muted/60 to-muted/20 border-border hover:border-primary/40`,keyPlaceholder:`API key`,family:t.family},catalogProvider:t,savedProvider:O.find(e=>e.id===t.id),onKeySaved:be,probeResult:V[t.id]},t.id))}),(0,H.jsx)(P,{page:Q.page,pageSize:Q.pageSize,totalItems:Q.totalItems,onPageChange:Q.setPage,itemLabel:`providers`})]}),(0,H.jsxs)(`div`,{className:`space-y-3`,children:[(0,H.jsx)(`h2`,{className:`text-sm font-medium text-muted-foreground uppercase tracking-wider`,children:e(`setup:screen.providers.selfHosted`)}),(0,H.jsx)(re,{onKeySaved:be})]})]}),ne&&(0,H.jsx)(`div`,{className:`flex items-center justify-center py-8`,children:(0,H.jsx)(a,{className:`h-6 w-6 animate-spin text-muted-foreground`})}),Y&&(0,H.jsxs)(`div`,{className:`space-y-3`,children:[(0,H.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,H.jsxs)(`h2`,{className:`text-base font-semibold flex items-center gap-2`,children:[(0,H.jsx)(r,{className:`h-4 w-4 text-primary`}),e(`setup:screen.start.chooseModel`)]}),(0,H.jsx)(`button`,{type:`button`,onClick:()=>{me(null),Z(null)},className:`text-xs text-muted-foreground hover:text-foreground transition-colors`,children:e(`setup:screen.start.addMoreKeys`)})]}),(0,H.jsx)(`p`,{className:`text-xs text-muted-foreground`,children:e(`setup:screen.start.modelsFor`,{provider:Y})}),he?(0,H.jsx)(`div`,{className:`flex items-center justify-center py-8`,children:(0,H.jsx)(a,{className:`h-6 w-6 animate-spin text-muted-foreground`})}):Se.length>0?(0,H.jsx)(`div`,{className:`grid grid-cols-1 gap-2`,children:$.pageItems.map(e=>{let t=e.contextWindow?`${(e.contextWindow/1e6).toFixed(0)}M ctx`:null;return(0,H.jsx)(`button`,{type:`button`,onClick:()=>Z(e.id),className:T(`w-full text-left rounded-xl border p-3 transition-all`,`hover:border-primary/40 hover:bg-primary/5`,X===e.id?`border-primary bg-primary/10 ring-1 ring-primary/30`:`border-border bg-card`),children:(0,H.jsxs)(`div`,{className:`flex items-start justify-between gap-2`,children:[(0,H.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,H.jsx)(`span`,{className:`font-medium text-sm`,children:e.name}),(0,H.jsxs)(`div`,{className:`flex flex-wrap items-center gap-1.5 mt-1`,children:[t&&(0,H.jsx)(`span`,{className:`text-[10px] px-1.5 py-0.5 rounded bg-muted text-muted-foreground`,children:t}),e.capabilities.slice(0,3).map(e=>(0,H.jsx)(`span`,{className:`text-[10px] px-1.5 py-0.5 rounded bg-primary/10 text-primary border border-primary/20`,children:e},e))]})]}),X===e.id&&(0,H.jsx)(`div`,{className:`flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-primary`,children:(0,H.jsx)(c,{className:`h-3 w-3 text-primary-foreground`})})]})},e.id)})}):(0,H.jsx)(`p`,{className:`text-sm text-muted-foreground py-8 text-center`,children:e(`setup:screen.errors.noModels`)}),(0,H.jsx)(P,{page:$.page,pageSize:$.pageSize,totalItems:$.totalItems,onPageChange:$.setPage,itemLabel:`models`})]}),Y&&X&&(0,H.jsxs)(`div`,{className:`sticky bottom-0 -mx-4 border-t bg-background/80 px-4 py-4 backdrop-blur-sm sm:-mx-6 sm:px-6`,children:[(0,H.jsx)(`div`,{className:`mb-3 flex min-w-0 items-center justify-between gap-2 text-sm text-muted-foreground`,children:(0,H.jsxs)(`span`,{className:`min-w-0 truncate`,children:[Y,` / `,X]})}),(0,H.jsxs)(`div`,{className:`flex flex-col sm:flex-row gap-2`,children:[(0,H.jsxs)(j,{onClick:Ce,className:`flex-1`,size:`lg`,children:[(0,H.jsx)(i,{className:`h-4 w-4 mr-2`}),e(`setup:screen.start.startSession`),(0,H.jsx)(h,{className:`h-4 w-4 ml-2`})]}),(0,H.jsxs)(j,{onClick:we,variant:`outline`,className:`flex-1`,size:`lg`,children:[(0,H.jsx)(c,{className:`h-4 w-4 mr-2`}),e(`setup:screen.start.saveConfig`)]})]}),(0,H.jsx)(`p`,{className:`text-[11px] text-muted-foreground/60 text-center mt-2`,children:e(`setup:screen.start.saveConfigHint`)})]})]})})]})}export{W as SetupScreen};