@camstack/addon-admin-ui 1.2.334 → 1.2.335

package/dist/assets/Network-Cx0uFr46.js

@@ -1 +0,0 @@
-import{I as e,K as t,Q as n,S as r,W as i,b as a,o,q as s,x as c,z as l}from"./_virtual_mf___mfe_internal__admin_ui_host__loadShare___mf_0_tanstack_mf_1_react_mf_2_query__loadShare__.js-DhP-Lgiq.js";import{at as u,ct as d,lt as f,vt as p}from"./player-overlays-B-iWFodj.js";import{$a as m,$l as h,Cn as g,Cu as _,Dt as v,Hn as y,Ja as b,Ka as x,Kl as ee,Ll as te,Nu as S,Pu as ne,Qa as C,Sl as w,Tl as T,Xa as re,Ya as ie,Za as ae,Zc as E,Zu as D,_n as O,ad as k,ao as A,au as j,bn as M,bu as N,co as P,cr as F,en as oe,eo as I,eu as L,fo as R,io as z,ju as B,lo as V,lr as H,lu as se,mo as ce,no as le,oo as ue,po as de,pu as fe,qa as pe,ro as me,so as he,tn as ge,to as _e,wt as ve,yd as ye}from"./src-D3Zan8Or.js";import{t as U}from"./boxes-Djrey7Kg.js";import{En as be,in as xe,on as Se,tn as Ce}from"./client-BomCPWqx.js";import{B as W,z as we}from"./index-CoHcNeUl.js";import{t as Te}from"./AdminPage-CiKtOLQm.js";import{t as Ee}from"./AdminTabs-C-9638Z4.js";import{t as De}from"./NodeAddonsSettingsPanel-CAP-fBly.js";import{t as G}from"./AddonCollectionPage-DkGiGxFC.js";import{t as K}from"./addon-display-names-DvSEQty-.js";var Oe=p(`file-up`,[[`path`,{d:`M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z`,key:`1oefj6`}],[`path`,{d:`M14 2v5a1 1 0 0 0 1 1h5`,key:`wfsgrz`}],[`path`,{d:`M12 12v6`,key:`3ahymv`}],[`path`,{d:`m15 15-3-3-3 3`,key:`15xj92`}]]),ke=p(`log-in`,[[`path`,{d:`m10 17 5-5-5-5`,key:`1bsop3`}],[`path`,{d:`M15 12H3`,key:`6jk70r`}],[`path`,{d:`M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4`,key:`u53s6r`}]]);n();var q=5e3,Ae={connected:!1,endpoint:null};function je(){let e=o(),t=H({capName:`network-access`},{refetchInterval:q}),n=F(void 0,{refetchInterval:q}),r=i(()=>K(n.data??[]),[n.data]),a=i(()=>(t.data??[]).map(e=>({addonId:e.addonId,displayName:r.get(e.addonId)??e.addonId,isActive:e.isActive})),[t.data,r]),[l,u]=s(null),[d,f]=s({}),p=(t,n)=>{let r=n?.addonId;e.invalidateQueries({queryKey:[[`networkAccess`,`getStatus`],{input:{addonId:r},type:`query`}]}),u(null),f(e=>{if(r===void 0||!(r in e))return e;let t={...e};return delete t[r],t})},m=(e,t)=>{u(null);let n=t?.addonId;if(n===void 0)return;let r=e instanceof Error?e.message:String(e);f(e=>({...e,[n]:r}))},h=de({onSuccess:p,onError:m}),g=ce({onSuccess:p,onError:m});return c(G,{title:`Remote Access`,subtitle:`Public-facing tunnels that expose this hub to the internet (Cloudflare Tunnel, ngrok, …). Settings, Logs and Events are docked under every provider.`,pageIcon:W,itemIcon:W,capability:`network-access`,installButtonLabel:`Add tunnel`,items:a,isLoading:t.isLoading,emptyTitle:`No remote-access providers installed`,emptyDescription:`Install a tunnel addon (e.g. @camstack/addon-cloudflare) to expose this hub publicly.`,renderStatusBadges:e=>c(Ne,{addonId:e.addonId}),itemError:e=>d[e.addonId]??null,renderPrimaryAction:e=>c(Pe,{addonId:e.addonId,busyId:l,onStart:e=>{u(e),h.mutate({addonId:e})},onStop:e=>{u(e),g.mutate({addonId:e})}})})}function Me(e){let{data:t}=R({addonId:e},{refetchInterval:q,retry:!1}),n=t?be.safeParse(t):null;return n?.success?n.data:Ae}function Ne({addonId:e}){let t=Me(e);return r(a,{children:[c(`span`,{className:`text-[10px] rounded-full px-2 py-0.5 font-medium ${t.connected?`bg-emerald-500/15 text-emerald-700 dark:text-emerald-300`:`bg-foreground-subtle/15 text-foreground-subtle`}`,children:t.connected?`Connected`:`Disconnected`}),t.endpoint&&r(`a`,{href:t.endpoint.url,target:`_blank`,rel:`noopener noreferrer`,onClick:e=>e.stopPropagation(),className:`text-[10px] text-emerald-700 dark:text-emerald-300 hover:underline flex items-center gap-1`,children:[c(D,{className:`h-3 w-3`}),t.endpoint.url]})]})}function Pe({addonId:e,busyId:t,onStart:n,onStop:i}){let a=Me(e),o=t===e;return a.connected?r(g,{size:`sm`,variant:`secondary`,disabled:o,onClick:()=>i(e),children:[o?c(S,{className:`h-3 w-3 animate-spin`}):c(d,{className:`h-3 w-3`}),`Stop`]}):r(g,{size:`sm`,variant:`primary`,disabled:o,onClick:()=>n(e),children:[o?c(S,{className:`h-3 w-3 animate-spin`}):c(N,{className:`h-3 w-3`}),`Start`]})}n();var Fe=3e4;function Ie(e){let t=[];for(let n of e)typeof n.urls==`string`?t.push(n.urls):t.push(...n.urls);return t}function Le(){let e=H({capName:`turn-provider`},{refetchInterval:Fe}),t=F(void 0,{refetchInterval:Fe}),n=E(),a=n.data??[],o=i(()=>K(t.data??[]),[t.data]);return c(G,{title:`TURN Servers`,subtitle:`ICE servers used for WebRTC NAT traversal. Multiple providers can coexist — the WebRTC layer concatenates servers from all enabled providers per session.`,pageIcon:_,itemIcon:_,capability:`turn-provider`,installButtonLabel:`Add provider`,items:i(()=>(e.data??[]).map(e=>({addonId:e.addonId,displayName:o.get(e.addonId)??e.addonId,isActive:e.isActive})),[e.data,o]),isLoading:e.isLoading,emptyTitle:`No TURN providers installed`,emptyDescription:`Install a TURN addon (e.g. @camstack/addon-cloudflare) to enable WebRTC behind restrictive NATs.`,renderExpandedPanel:e=>c(Re,{addonId:e.addonId,enabled:e.isActive}),trailing:r(O,{children:[r(`div`,{className:`px-4 py-3 border-b border-border flex items-center justify-between`,children:[r(`div`,{children:[c(`div`,{className:`text-sm font-semibold`,children:`Combined ICE server list`}),c(`div`,{className:`text-xs text-foreground-subtle`,children:`What the WebRTC layer fetches per-session.`})]}),c(g,{size:`sm`,variant:`secondary`,onClick:()=>n.refetch(),disabled:n.isFetching,children:`Refresh`})]}),c(`div`,{className:`p-4`,children:a.length===0?c(`div`,{className:`text-xs text-foreground-subtle`,children:`No servers from enabled providers.`}):c(`div`,{className:`flex flex-col gap-3`,children:a.map((e,t)=>{let n=Array.isArray(e.urls)?e.urls:[e.urls];return r(`div`,{className:`rounded border border-border bg-surface`,children:[(e.username||e.credential)&&r(`div`,{className:`px-3 py-1.5 border-b border-border text-[10px] font-mono text-foreground-subtle flex items-center gap-3`,children:[e.username&&r(`span`,{children:[c(`span`,{className:`text-foreground-subtle`,children:`user:`}),` `,c(`span`,{className:`text-foreground`,children:e.username})]}),e.credential&&r(`span`,{children:[c(`span`,{className:`text-foreground-subtle`,children:`credential:`}),` `,c(`span`,{className:`text-foreground`,children:`••••••••`})]})]}),c(`ul`,{className:`divide-y divide-border`,children:n.map(e=>c(`li`,{className:`px-3 py-1.5 font-mono text-xs text-foreground break-all`,children:e},e))})]},t)})})})]})})}function Re({addonId:e,enabled:t}){let n=E({addonId:e},{enabled:t,retry:!1}),a=i(()=>Ie(n.data??[]),[n.data]);return!t||a.length===0?null:r(`div`,{className:`rounded-lg border border-border bg-surface p-3`,children:[r(`div`,{className:`text-[11px] font-semibold text-foreground-subtle uppercase tracking-wide mb-2`,children:[`Discovered ICE servers (`,a.length,`)`]}),c(`div`,{className:`flex flex-wrap gap-1`,children:a.map(e=>c(`span`,{className:`inline-block rounded px-1.5 py-0.5 text-[10px] font-mono bg-foreground-subtle/10 text-foreground`,children:e},e))})]})}n();var ze={lan:_,wifi:T,docker:U,vpn:B,loopback:j,other:j},Be={lan:`LAN`,wifi:`Wi-Fi`,docker:`Docker`,vpn:`VPN`,loopback:`Loopback`,other:`Other`},Ve=[`lan`,`wifi`,`vpn`,`docker`,`other`,`loopback`];function He(e){let{interfaces:t,disabled:n,hideLoopback:a,ipv4Only:o,emptyMessage:s}=e,l=i(()=>t.filter(e=>!(a&&e.kind===`loopback`||o&&e.family!==`IPv4`)),[t,a,o]),u=i(()=>{let e=new Map;for(let t of l){let n=e.get(t.kind)??[];n.push(t),e.set(t.kind,n)}return Ve.filter(t=>e.has(t)).map(t=>({kind:t,items:e.get(t)}))},[l]),d=t=>e.mode===`single`?e.value===t:e.value.includes(t),f=t=>{if(n||t.kind===`loopback`)return;if(e.mode===`single`){e.onChange(e.value===t.address?null:t.address);return}let r=new Set(e.value);r.has(t.address)?r.delete(t.address):r.add(t.address),e.onChange([...r])};return l.length===0?c(`div`,{className:`text-xs text-foreground-subtle italic`,children:s??`No addresses available.`}):c(`div`,{className:`flex flex-col gap-3`,children:u.map(({kind:t,items:i})=>r(`div`,{className:`rounded-md border border-border overflow-hidden`,children:[r(`div`,{className:`flex items-center gap-2 px-3 py-1.5 bg-surface-hover/30 border-b border-border`,children:[c(ze[t]??j,{className:`h-3.5 w-3.5 text-foreground-subtle`}),c(`span`,{className:`text-[11px] font-semibold uppercase tracking-wide text-foreground-subtle`,children:Be[t]??t}),r(`span`,{className:`text-[10px] text-foreground-subtle`,children:[`· `,i.length]})]}),c(`ul`,{className:`divide-y divide-border`,children:i.map(t=>{let i=d(t.address),a=t.kind===`loopback`,o=!t.plausible&&!a;return r(`li`,{className:`flex items-center gap-3 px-3 py-2 ${a?`opacity-60 cursor-not-allowed`:n?`opacity-60`:o?`cursor-pointer hover:bg-surface-hover/30 bg-amber-500/[0.04]`:`cursor-pointer hover:bg-surface-hover/30`}`,onClick:()=>f(t),children:[c(`span`,{className:`flex items-center justify-center h-4 w-4 rounded ${e.mode===`single`?`rounded-full`:`rounded`} border ${i?`border-primary bg-primary text-primary-foreground`:`border-border bg-surface`}`,children:i&&c(ye,{className:`h-3 w-3`})}),r(`div`,{className:`flex-1 min-w-0 ${o?`text-foreground-subtle`:``}`,children:[r(`div`,{className:`flex items-center gap-2 flex-wrap`,children:[c(`span`,{className:`font-mono text-xs font-semibold ${o?`text-foreground-subtle`:`text-foreground`}`,children:t.name}),c(`span`,{className:`text-[10px] rounded px-1.5 py-0.5 bg-foreground-subtle/10 text-foreground-subtle font-mono`,children:t.family}),t.preferred&&c(`span`,{className:`text-[10px] rounded-full px-2 py-0.5 font-medium bg-primary/15 text-primary`,children:`Auto-preferred`}),a&&c(`span`,{className:`text-[10px] rounded-full px-2 py-0.5 font-medium bg-foreground-subtle/15 text-foreground-subtle`,children:`Always included`}),o&&r(`span`,{className:`inline-flex items-center gap-1 text-[10px] rounded-full px-2 py-0.5 font-medium bg-amber-500/15 text-amber-700 dark:text-amber-300`,title:t.plausibleReason||void 0,children:[c(te,{className:`h-2.5 w-2.5`}),`Unlikely usable`]})]}),r(`div`,{className:`text-xs text-foreground-subtle mt-0.5 font-mono break-all`,children:[t.address,t.cidr&&t.cidr!==t.address?` (${t.cidr})`:``]})]})]},`${t.name}-${t.family}-${t.address}`)})})]},t))})}function Ue(e,t){if(e===void 0)return null;let n=e.baseUrl??e.resolved,r=Se(e),i=r.form===`app`;return{flagged:n,appLink:i,appLinkHub:i?r.hubBaseUrl:null,preview:xe({base:r,destination:{kind:`camera`,deviceId:12,atMs:t}}),warning:We(r,n)}}function We(e,t){return e.form===`app`&&e.hubBaseUrl===null?`No public HTTPS address (tunnel or Tailscale) is up, so app links carry no hub address. The app still opens on a phone that already knows this hub; a new browser asks for the address once.`:e.form===`hub`&&t===null?`No reachable address is flagged, so notifications carry no tap link.`:e.form===`hub`&&t!==null&&t.startsWith(`http://`)?`This address is plain HTTP and usually only works on your own network — a notification opened away from home will not load.`:null}function Ge(e){let t=e.trim();if(t===``)return{ok:!1,error:`Enter an address.`};let n;try{n=new URL(t)}catch{return{ok:!1,error:`Not a URL — include https://.`}}return n.protocol!==`https:`&&n.protocol!==`http:`?{ok:!1,error:`Use an http:// or https:// address.`}:n.username!==``||n.password!==``?{ok:!1,error:`An address must not carry a user name or password.`}:{ok:!0,origin:n.origin}}n();function Ke({endpoint:e,saving:t,onFlag:n,nowMs:i}){let[o,l]=s(``),[u,d]=s(null),f=Ue(e,i??Date.now());return r(O,{children:[r(`div`,{className:`px-4 py-3 border-b border-border flex items-center justify-between gap-3 flex-wrap`,children:[r(`div`,{className:`min-w-0`,children:[r(`div`,{className:`text-sm font-semibold inline-flex items-center gap-1.5`,children:[c(ne,{className:`h-3.5 w-3.5`}),`Notification links`]}),r(`div`,{className:`text-xs text-foreground-subtle max-w-2xl`,children:[`Where tapping a notification takes you. The default, `,c(`b`,{children:`CamStack app link`}),`, opens the CamStack app on the phone when it is installed and the web viewer otherwise, and carries this hub's public address so it connects to the right hub. Flag one of this hub's own addresses in the table below to link straight to it instead. Attachments, action buttons and admin pages (such as addon updates) always use this hub's own address.`]})]}),e!==void 0&&e.baseUrl!==null&&c(g,{size:`sm`,variant:`secondary`,disabled:t,onClick:()=>n(null),children:`Use default (app link)`})]}),r(`div`,{className:`p-4 flex flex-col gap-3 text-xs`,children:[f===null?c(`div`,{className:`text-foreground-subtle`,children:`Loading…`}):r(a,{children:[r(`div`,{className:`grid grid-cols-[auto_1fr] gap-x-3 gap-y-1.5 items-baseline`,children:[c(`span`,{className:`text-foreground-subtle`,children:`Links point to`}),r(`span`,{className:`font-mono break-all`,"data-testid":`notification-link-flagged`,children:[f.appLink?`CamStack app link`:f.flagged??`nothing reachable`,e?.baseUrl===null?c(`span`,{className:`ml-1.5 font-sans text-foreground-subtle`,children:`(default)`}):null]}),f.appLink&&r(a,{children:[c(`span`,{className:`text-foreground-subtle`,children:`Hub address in the link`}),c(`span`,{className:`font-mono break-all`,"data-testid":`notification-link-hub`,children:f.appLinkHub??`none — no tunnel or Tailscale address is up`})]}),c(`span`,{className:`text-foreground-subtle`,children:`Example camera tap`}),c(`span`,{className:`font-mono break-all text-foreground`,"data-testid":`notification-link-preview`,children:f.preview??`— no link —`})]}),f.warning!==null&&c(`p`,{className:`text-[11px] text-amber-600 dark:text-amber-400`,children:f.warning})]}),r(`div`,{className:`flex flex-wrap items-start gap-2 pt-1`,children:[r(`div`,{className:`flex-1 min-w-[220px]`,children:[c(ge,{value:o,onChange:e=>{l(e.target.value),d(null)},placeholder:`Custom address, e.g. https://cams.example.com`,"aria-label":`Custom notification address`,disabled:t}),u!==null&&c(`div`,{className:`mt-1 text-[11px] text-red-600 dark:text-red-400`,children:u})]}),c(g,{size:`sm`,variant:`secondary`,disabled:t||o.trim()===``,onClick:()=>{let e=Ge(o);if(!e.ok){d(e.error);return}d(null),l(``),n(e.origin)},children:`Use custom address`})]})]})]})}n();var qe={"lan-ipv4":{label:`IPv4`,className:`bg-emerald-500/15 text-emerald-700 dark:text-emerald-300`},"lan-ipv6":{label:`IPv6`,className:`bg-violet-500/15 text-violet-700 dark:text-violet-300`},public:{label:`Public`,className:`bg-blue-500/15 text-blue-700 dark:text-blue-300`},"app-link":{label:`App link`,className:`bg-amber-500/15 text-amber-700 dark:text-amber-300`},loopback:{label:`Loopback`,className:`bg-foreground-subtle/15 text-foreground-subtle`}};function J(e){return e.kind!==`loopback`&&e.kind!==`app-link`}function Je(e){return e.kind!==`loopback`}function Ye(){let e=o(),t=u(),n=ae(void 0,{refetchInterval:3e4}),a=x(void 0),d=_e({onSuccess:()=>{e.invalidateQueries({queryKey:[[`localNetwork`]]})}}),p=m({onSuccess:t=>{y(t.addresses),e.invalidateQueries({queryKey:[[`localNetwork`]]})}}),h=i(()=>n.data?.interfaces??[],[n.data]),_=pe({port:typeof window<`u`?Number(window.location.port)||(window.location.protocol===`https:`?443:80):4e3,scheme:typeof window<`u`&&window.location.protocol===`https:`?`https`:`http`,includeAppLink:!0},{refetchInterval:3e4}),[v,y]=s([]),[S,ne]=s(!1);l(()=>{!S&&a.data&&(y(a.data.addresses),ne(!0))},[a.data,S]);let C=a.data?.addresses??[],w=i(()=>{if(v.length!==C.length)return!0;let e=[...v].toSorted(),t=[...C].toSorted();return e.some((e,n)=>e!==t[n])},[v,C]),T=()=>{d.mutate({addresses:[...v]})},ie=()=>{y(C)},E=()=>{y([])},D=()=>{n.refetch(),_.refetch(),a.refetch(),A.refetch(),M.refetch()},k=async()=>{try{let e=await t.raceConnectionEndpoints({perCandidateTimeoutMs:1500});console.info(`[network-addresses] race result`,e)}catch(e){console.warn(`[network-addresses] race failed`,e)}},A=b(),j=le({onSuccess:()=>void A.refetch()}),M=re(),N=me({onSuccess:()=>void M.refetch()}),P=_.data?.endpoints??[],F=A.data?.baseUrl??null,I=A.data?.resolved??null,L=A.data?.appLinkHub??null,R=M.data?.baseUrls??[],z=R.length===0,B=F===null,V=e=>z?e.kind===`lan-ipv4`||e.kind===`public`&&e.interfaceKind===`public`:R.includes(e.baseUrl),H=e=>F===null?I===e.baseUrl:F===e.baseUrl,ce=e=>{if(!J(e))return;let t=z?P.filter(e=>J(e)&&V(e)).map(e=>e.baseUrl):[...R],n=t.includes(e.baseUrl)?t.filter(t=>t!==e.baseUrl):[...t,e.baseUrl];N.mutate({baseUrls:n})},ue=e=>{if(Je(e)){if(H(e)){B||j.mutate({baseUrl:null});return}j.mutate({baseUrl:e.kind===`app-link`?null:e.baseUrl})}},de=i(()=>[{key:`url`,header:`Endpoint`,render:e=>r(`div`,{className:`min-w-0 py-0.5`,children:[c(`div`,{className:`font-mono text-[12px] break-all ${e.plausible?`text-foreground`:`text-foreground-subtle`}`,children:e.baseUrl}),r(`div`,{className:`mt-0.5 flex flex-wrap items-center gap-1.5 text-[11px] text-foreground-subtle`,children:[c(`span`,{children:e.label}),e.kind===`app-link`&&r(`span`,{className:`font-mono`,children:[`hub= `,L??`none (no tunnel or Tailscale)`]}),e.interfaceKind!==`lan`&&e.interfaceKind!==`public`&&c(`span`,{className:`uppercase tracking-wide`,children:e.interfaceKind}),!e.plausible&&e.interfaceKind!==`loopback`&&r(`span`,{className:`inline-flex items-center gap-1 text-amber-700 dark:text-amber-300`,title:e.plausibleReason||void 0,children:[c(te,{className:`h-2.5 w-2.5`}),`Unlikely usable`]})]})]})},{key:`kind`,header:`Kind`,nowrap:!0,render:e=>{let t=qe[e.kind]??qe.loopback;return c(`span`,{className:`text-[10px] rounded-full px-2 py-0.5 font-medium ${t.className}`,children:t.label})}},{key:`viewer`,headerRender:()=>r(`span`,{className:`inline-flex items-center gap-1`,children:[`Viewer`,z?c(`span`,{className:`text-[10px] font-normal normal-case text-foreground-subtle`,children:`auto`}):null]}),align:`center`,nowrap:!0,width:`w-24`,render:e=>{let t=J(e);return c(`label`,{className:`inline-flex justify-center ${t?`cursor-pointer`:`cursor-not-allowed opacity-40`}`,title:e.kind===`loopback`?`Loopback is not a client route.`:e.kind===`app-link`?`The app link is not a hub address — it is only a notification link target.`:`Use this URL in the API / viewer race.`,children:c(oe,{checked:t&&V(e),disabled:!t||N.isPending,onChange:()=>ce(e),"aria-label":`Viewer: ${e.baseUrl}`})})}},{key:`notifications`,headerRender:()=>r(`span`,{className:`inline-flex items-center gap-1`,children:[`Notifications`,B?c(`span`,{className:`text-[10px] font-normal normal-case text-foreground-subtle`,children:`auto`}):null]}),align:`center`,nowrap:!0,width:`w-28`,render:e=>{let t=Je(e);return c(`label`,{className:`inline-flex justify-center ${t?`cursor-pointer`:`cursor-not-allowed opacity-40`}`,title:t?`Notification links and deep links use this address.`:`Loopback is not a client route.`,children:c(oe,{checked:t&&H(e),disabled:!t||j.isPending,onChange:()=>ue(e),"aria-label":`Notifications: ${e.baseUrl}`})})}}],[z,B,R,F,I,L,N.isPending,j.isPending,P]);return r(Te,{children:[r(`div`,{className:`flex items-center justify-between gap-3 flex-wrap`,children:[c(`p`,{className:`text-xs text-foreground-subtle max-w-2xl`,children:`Pin which host addresses exist, then tick the destinations each URL should serve. Viewer auto is IPv4 + public; every other row (including IPv6) can be ticked on.`}),r(`div`,{className:`flex items-center gap-2 shrink-0`,children:[r(g,{size:`sm`,variant:`secondary`,onClick:D,disabled:n.isLoading,children:[c(fe,{className:`h-3 w-3 ${n.isLoading?`animate-spin`:``}`}),`Refresh`]}),c(g,{size:`sm`,variant:`secondary`,onClick:k,children:`Probe race`})]})]}),r(O,{children:[r(`div`,{className:`px-4 py-3 border-b border-border flex items-center justify-between gap-3 flex-wrap`,children:[r(`div`,{children:[c(`div`,{className:`text-sm font-semibold`,children:`Allowed addresses`}),c(`div`,{className:`text-xs text-foreground-subtle`,children:v.length===0?`Auto — every non-loopback / non-link-local interface participates.`:`${v.length} pinned`})]}),r(`div`,{className:`flex items-center gap-1`,children:[r(g,{size:`sm`,variant:`secondary`,onClick:()=>p.mutate(void 0),disabled:p.isPending||d.isPending,title:`Re-run the auto-detection heuristic + overwrite the current allowlist with the best matches.`,children:[c(ee,{className:`h-3 w-3`}),p.isPending?`Detecting…`:`Best match`]}),r(g,{size:`sm`,variant:`secondary`,onClick:E,disabled:v.length===0||d.isPending,children:[c(f,{className:`h-3 w-3`}),`Clear`]}),w&&c(g,{size:`sm`,variant:`secondary`,onClick:ie,disabled:d.isPending,children:`Discard`}),r(g,{size:`sm`,variant:`primary`,onClick:T,disabled:!w||d.isPending,children:[c(se,{className:`h-3 w-3`}),d.isPending?`Saving…`:`Save`]})]})]}),c(`div`,{className:`p-4`,children:c(He,{mode:`multiple`,interfaces:h,value:v,onChange:y,disabled:d.isPending,emptyMessage:n.isLoading?`Loading interfaces…`:`No interfaces detected.`})})]}),c(Ke,{endpoint:A.data,saving:j.isPending,onFlag:e=>j.mutate({baseUrl:e})}),r(O,{children:[r(`div`,{className:`px-4 py-3 border-b border-border flex items-center justify-between gap-3 flex-wrap`,children:[r(`div`,{children:[c(`div`,{className:`text-sm font-semibold`,children:`Connection endpoints`}),c(`div`,{className:`text-xs text-foreground-subtle`,children:`Ranked URLs this hub advertises, plus the CamStack app link. Tick Viewer (many) and Notifications (one — the address notification taps open).`})]}),r(`div`,{className:`flex items-center gap-1`,children:[!z&&c(g,{size:`sm`,variant:`secondary`,disabled:N.isPending,onClick:()=>N.mutate({baseUrls:[]}),children:`Viewer → auto`}),!B&&c(g,{size:`sm`,variant:`secondary`,disabled:j.isPending,onClick:()=>j.mutate({baseUrl:null}),children:`Notifications → default`})]})]}),c(ve,{columns:de,rows:P,rowKey:e=>`${e.priority}-${e.baseUrl}`,minWidthPx:640,bordered:!1,mobileMode:`scroll`,emptyMessage:_.isLoading?`Loading…`:`No endpoints available.`,rowClassName:e=>e.plausible?void 0:`opacity-80`})]})]})}n();var Xe={mesh:`bg-violet-500/15 text-violet-700 dark:text-violet-300`,public:`bg-blue-500/15 text-blue-700 dark:text-blue-300`},Y=5e3,Ze=3e4,Qe={joined:!1,meshIp:``,magicDnsHostname:``,peerCount:0,endpoints:[],tenantName:``,magicDnsSuffix:``,userLogin:null,controlPlaneUrl:``,keyExpiry:null};function $e(){let e=H({capName:`mesh-network`},{refetchInterval:Y}),t=F(void 0,{refetchInterval:Y}),n=i(()=>K(t.data??[]),[t.data]);return c(G,{title:`Mesh Networks`,subtitle:`Private VPN meshes that connect CamStack to your other devices (Tailscale, Headscale, …). Each provider can also expose this hub publicly via its ingress (Tailscale Funnel).`,pageIcon:U,itemIcon:_,capability:`mesh-network`,installButtonLabel:`Add mesh`,items:i(()=>(e.data??[]).map(e=>({addonId:e.addonId,displayName:n.get(e.addonId)??e.addonId,isActive:e.isActive})),[e.data,n]),isLoading:e.isLoading,emptyTitle:`No mesh-network providers installed`,emptyDescription:`Install a mesh addon (e.g. @camstack/addon-tailscale) to join this hub into a private VPN mesh.`,renderStatusBadges:e=>c(et,{addonId:e.addonId}),renderPrimaryAction:e=>c(tt,{addonId:e.addonId}),renderExpandedPanel:e=>c(nt,{addonId:e.addonId})})}function X(e){let{data:t,isLoading:n}=A({addonId:e},{refetchInterval:Y,retry:!1}),r=t?Ce.safeParse(t):null;return{status:r?.success?r.data:Qe,isLoading:n}}function et({addonId:e}){let{status:t}=X(e);return r(a,{children:[c(`span`,{className:`text-[10px] rounded-full px-2 py-0.5 font-medium ${t.joined?`bg-emerald-500/15 text-emerald-700 dark:text-emerald-300`:`bg-foreground-subtle/15 text-foreground-subtle`}`,children:t.joined?`Joined`:`Not joined`}),t.joined&&r(`span`,{className:`text-[10px] rounded-full px-2 py-0.5 font-medium bg-foreground-subtle/15 text-foreground-subtle`,children:[t.peerCount,` peer`,t.peerCount===1?``:`s`]})]})}function tt({addonId:t}){let n=o(),[i,l]=s(!1),[d,f]=s(null),p=u(),{status:m}=X(t),h=e(()=>{n.invalidateQueries({queryKey:[[`meshNetwork`]]})},[n]),_=V(),v=ue({onSuccess:h}),y=P({onSuccess:h}),b=e(async()=>{l(!0);let e={cancelled:!1};f(e);try{let n=await _.mutateAsync({addonId:t});if(e.cancelled)return;n.loginUrl&&window.open(n.loginUrl,`_blank`,`noopener,noreferrer`);let r=Date.now();for(;!e.cancelled&&(await lt(2e3),!e.cancelled);){let e=await p.trpcClient.meshNetwork.getStatus.query({addonId:t}).catch(()=>null),n=e?Ce.safeParse(e):null;if(n?.success&&n.data.joined){h();break}if(Date.now()-r>6e5)break}}finally{l(!1),f(null)}},[t,h,_,p]),x=e(()=>{d&&(d.cancelled=!0),l(!1),f(null)},[d]);return c(a,{children:m.joined?r(a,{children:[r(g,{size:`sm`,variant:`secondary`,disabled:v.isPending,onClick:()=>v.mutate({addonId:t}),children:[v.isPending?c(S,{className:`h-3 w-3 animate-spin`}):c(we,{className:`h-3 w-3`}),`Disconnect`]}),r(g,{size:`sm`,variant:`ghost`,disabled:y.isPending,onClick:()=>y.mutate({addonId:t}),children:[y.isPending?c(S,{className:`h-3 w-3 animate-spin`}):c(L,{className:`h-3 w-3`}),`Log out`]})]}):i?r(g,{size:`sm`,variant:`ghost`,onClick:x,children:[c(w,{className:`h-3 w-3 mr-1`}),` Cancel`]}):r(a,{children:[r(g,{size:`sm`,variant:`primary`,onClick:()=>void b(),children:[c(ke,{className:`h-3 w-3`}),`Connect`]}),r(g,{size:`sm`,variant:`ghost`,disabled:y.isPending,onClick:()=>y.mutate({addonId:t}),children:[y.isPending?c(S,{className:`h-3 w-3 animate-spin`}):c(L,{className:`h-3 w-3`}),`Log out`]})]})})}function nt({addonId:e}){let{status:t}=X(e),n=he({addonId:e},{refetchInterval:Ze,retry:!1});return r(`div`,{className:`rounded-lg border border-border bg-surface`,children:[r(`div`,{className:`p-4 space-y-4`,children:[t.error&&c(M,{message:t.error}),c(rt,{status:t}),t.endpoints.length>0&&r(`div`,{className:`space-y-1.5`,children:[c(`div`,{className:`text-[11px] font-semibold text-foreground-subtle uppercase tracking-wide`,children:`Endpoints`}),t.endpoints.map(e=>r(`div`,{className:`flex items-center gap-2 text-xs flex-wrap`,children:[r(`span`,{className:`text-[10px] rounded-full px-2 py-0.5 font-medium ${Xe[e.scope]??`bg-foreground-subtle/15 text-foreground-subtle`}`,children:[e.scope===`public`?c(W,{className:`inline h-2.5 w-2.5 mr-0.5`}):null,e.label]}),r(`a`,{href:e.url,target:`_blank`,rel:`noopener noreferrer`,onClick:e=>e.stopPropagation(),className:`text-emerald-700 dark:text-emerald-300 hover:underline break-all flex items-center gap-1`,children:[c(D,{className:`h-3 w-3 shrink-0`}),e.url]})]},e.id))]})]}),c(`div`,{className:`border-t border-border`,children:c(at,{peers:n.data?.peers??[],loading:n.isLoading})})]})}function rt({status:e}){return c(`div`,{className:`grid grid-cols-1 sm:grid-cols-2 gap-x-6 gap-y-1.5`,children:[{label:`Tenant`,value:e.tenantName||`—`},{label:`User`,value:e.userLogin??`—`},{label:`Control plane`,value:e.controlPlaneUrl||`—`},{label:`Mesh IP`,value:e.meshIp||`—`,mono:!0},{label:`MagicDNS`,value:e.magicDnsHostname||`—`,mono:!0},{label:`DNS suffix`,value:e.magicDnsSuffix||`—`,mono:!0},{label:`Peers`,value:String(e.peerCount)},{label:`Key expiry`,value:e.keyExpiry?it(e.keyExpiry):`—`}].map(e=>r(`div`,{className:`flex items-baseline justify-between gap-3 text-xs`,children:[c(`span`,{className:`text-foreground-subtle shrink-0`,children:e.label}),c(`span`,{className:`text-foreground truncate ${e.mono?`font-mono`:``}`,children:e.value})]},e.label))})}function it(e){let t=e-Date.now();if(t<0)return`Expired ${ct(e)}`;let n=Math.floor(t/864e5);if(n>60)return new Date(e).toLocaleDateString();if(n>1)return`in ${n} days`;let r=Math.floor(t/36e5);return r>1?`in ${r}h`:`in ${Math.max(1,Math.floor(t/6e4))} min`}function at({peers:t,loading:n}){let a=i(()=>t.map(e=>({...e,_id:e.id})),[t]),o=e(e=>{e&&navigator.clipboard?.writeText(e)},[]),s=i(()=>[{key:`hostname`,header:`Hostname`,render:e=>r(`div`,{className:`flex flex-col`,children:[r(`div`,{className:`flex items-center gap-1.5`,children:[c(`span`,{className:`font-medium text-foreground`,children:e.hostname||`(unknown)`}),e.isSelf&&c(y,{variant:`info`,children:`self`}),e.exitNodeOption&&c(y,{variant:`warning`,children:`exit-node`})]}),e.userLogin&&c(`div`,{className:`text-[10px] text-foreground-subtle truncate`,children:e.userLogin})]})},{key:`magicDns`,header:`MagicDNS`,render:e=>e.magicDns?r(`div`,{className:`flex items-center gap-1`,children:[c(`span`,{className:`font-mono text-xs truncate`,children:e.magicDns}),c(`button`,{onClick:()=>o(e.magicDns),className:`p-0.5 hover:bg-foreground-subtle/10 rounded`,"aria-label":`Copy MagicDNS`,children:c(k,{className:`h-3 w-3 text-foreground-subtle`})})]}):c(`span`,{className:`text-foreground-subtle`,children:`—`})},{key:`addresses`,header:`IP`,render:e=>{let t=e.addresses[0]??``;return t?r(`div`,{className:`flex items-center gap-1`,children:[c(`span`,{className:`font-mono text-xs`,children:t}),c(`button`,{onClick:()=>o(t),className:`p-0.5 hover:bg-foreground-subtle/10 rounded`,"aria-label":`Copy IP`,children:c(k,{className:`h-3 w-3 text-foreground-subtle`})})]}):c(`span`,{className:`text-foreground-subtle`,children:`—`})}},{key:`connection`,header:`Connection`,render:e=>r(`div`,{className:`flex items-center gap-1.5`,children:[c(y,{variant:ot(e.connection),children:e.connection}),e.relay&&c(`span`,{className:`text-[10px] text-foreground-subtle font-mono`,children:e.relay})]})},{key:`routes`,header:`Routes`,render:e=>e.advertisedRoutes.length>0?c(`span`,{className:`text-[10px] font-mono text-foreground-subtle truncate`,children:e.advertisedRoutes.join(`, `)}):c(`span`,{className:`text-foreground-subtle`,children:`—`})},{key:`tx`,header:`TX / RX`,render:e=>r(`span`,{className:`text-[10px] text-foreground-subtle font-mono`,children:[`↑ `,st(e.txBytes),` · ↓ `,st(e.rxBytes)]})},{key:`lastSeen`,header:`Last seen`,render:e=>c(`span`,{className:`text-[10px] text-foreground-subtle`,children:e.lastSeenMs>0?ct(e.lastSeenMs):`—`})}],[o]);return n&&t.length===0?r(`div`,{className:`p-4 text-xs text-foreground-subtle`,children:[c(S,{className:`h-3 w-3 animate-spin inline mr-1`}),` Loading peers…`]}):t.length===0?c(`div`,{className:`p-4 text-xs text-foreground-subtle`,children:`No peers visible — your tailnet may be empty or the host is not joined.`}):c(`div`,{className:`p-4`,children:c(ve,{columns:s,rows:a,rowKey:e=>e._id,minWidthPx:820})})}function ot(e){return e===`direct`?`success`:e===`relay`?`warning`:`info`}function st(e){return e<1024?`${e}B`:e<1024*1024?`${(e/1024).toFixed(1)}KB`:e<1024*1024*1024?`${(e/1024/1024).toFixed(1)}MB`:`${(e/1024/1024/1024).toFixed(2)}GB`}function ct(e){let t=Date.now()-e;return t<6e4?`just now`:t<36e5?`${Math.round(t/6e4)}m ago`:t<864e5?`${Math.round(t/36e5)}h ago`:`${Math.round(t/864e5)}d ago`}function lt(e){return new Promise(t=>setTimeout(t,e))}var ut=/-----BEGIN CERTIFICATE-----[\s\S]+?-----END CERTIFICATE-----/,Z=/-----BEGIN ((?:RSA |EC |ENCRYPTED )?PRIVATE KEY)-----[\s\S]+?-----END \1-----/,dt={certificate:`.pem,.crt,.cer`,privateKey:`.pem,.key`,ca:`.pem,.crt,.cer`};function Q(e,t){if(t.trim()===``)return null;if(e===`privateKey`){let e=Z.exec(t);return e===null?ut.test(t)?`This is a certificate, not a private key.`:`Not a PEM private key — expected -----BEGIN … PRIVATE KEY-----.`:e[1]===`ENCRYPTED PRIVATE KEY`?`The private key is password-protected. Export it without a passphrase.`:null}return ut.test(t)?e===`certificate`&&Z.test(t)?`This file also contains a private key. Pick the certificate file, and the key in its own field.`:null:Z.test(t)?`This is a private key, not a certificate.`:`Not a PEM certificate — expected -----BEGIN CERTIFICATE-----.`}function ft(e){return e.text()}n();function $({kind:e,label:n,value:i,onChange:a,rows:o=6}){let l=t(null),[u,d]=s(null),[f,p]=s(null),m=f??Q(e,i),h=`pem-${e}`,_=async e=>{let t=e.target.files?.[0];if(e.target.value=``,t!==void 0){d(t.name);try{let e=await ft(t);p(null),a(e)}catch(e){p(`Could not read ${t.name}: ${e instanceof Error?e.message:String(e)}`)}}};return r(`div`,{className:`space-y-1`,children:[r(`div`,{className:`flex items-center justify-between gap-2`,children:[c(`label`,{htmlFor:h,className:`text-[11px] text-foreground-subtle`,children:n}),r(`div`,{className:`flex min-w-0 items-center gap-2`,children:[u!==null&&c(`span`,{className:`truncate font-mono text-[10px] text-foreground-subtle`,"data-testid":`${h}-file-name`,children:u}),c(`input`,{ref:l,type:`file`,accept:dt[e],onChange:e=>void _(e),className:`hidden`,"data-testid":`${h}-file`}),r(g,{size:`sm`,variant:`outline`,type:`button`,onClick:()=>l.current?.click(),children:[c(Oe,{className:`mr-1 h-3 w-3`}),`Choose file`]})]})]}),c(`textarea`,{id:h,value:i,onChange:e=>{d(null),p(null),a(e.target.value)},rows:o,"aria-invalid":m!==null,className:`w-full rounded border border-border bg-surface px-2 py-1 font-mono text-[11px]`}),m!==null&&c(`p`,{className:`text-[11px] text-danger`,role:`alert`,children:m})]})}n();function pt(e){if(e===null||e===``)return`—`;let t=e.replace(/:/g,``);return t.length<=16?e:`${t.slice(0,8)}…${t.slice(-8)}`}function mt(){let e=o(),t=ie(void 0,{refetchInterval:15e3}),n=C({onSuccess:()=>void e.invalidateQueries({queryKey:[[`localNetwork`]]})}),i=I({onSuccess:()=>void e.invalidateQueries({queryKey:[[`localNetwork`]]})}),a=z({onSuccess:()=>{d(!1),p(``),_(``),b(``),e.invalidateQueries({queryKey:[[`localNetwork`]]})}}),l=t.data,[u,d]=s(!1),[f,p]=s(``),[m,_]=s(``),[y,b]=s(``),x=()=>{if(!l?.caCertPem)return;let e=new Blob([l.caCertPem],{type:`application/x-pem-file`}),t=URL.createObjectURL(e),n=document.createElement(`a`);n.href=t,n.download=`camstack-ca.crt`,n.click(),URL.revokeObjectURL(t)},ee=l?.mode===`uploaded`?`Uploaded`:l?.mode===`generated`?`Generated local CA`:`TLS disabled`;return r(`div`,{className:`flex flex-col gap-4`,children:[c(De,{nodeId:`hub`,addonIds:[`local-network`],level:`global`,title:`LAN HTTP`,description:`Native apps on this Wi-Fi use http:// and skip the private certificate. The tunnel and this admin UI stay on HTTPS.`}),r(O,{className:`p-4 space-y-3`,children:[r(`div`,{className:`flex items-center gap-2`,children:[c(h,{className:`h-4 w-4 text-foreground-subtle`}),c(`h3`,{className:`text-sm font-semibold`,children:`Certificate`})]}),t.isError&&c(`p`,{className:`text-xs text-danger`,children:`Could not read TLS status.`}),l?.reissueError&&c(`p`,{className:`rounded-md border border-amber-500/40 bg-amber-500/10 px-3 py-2 text-[11px] text-amber-700 dark:text-amber-300`,children:l.reissueError}),l?.restartRequired&&c(`p`,{className:`rounded-md border border-amber-500/40 bg-amber-500/10 px-3 py-2 text-[11px] text-amber-700 dark:text-amber-300`,children:`The HTTPS listener still serves the previous certificate. Restart the hub to apply it.`}),r(`dl`,{className:`grid grid-cols-1 gap-2 text-xs sm:grid-cols-2`,children:[r(`div`,{children:[c(`dt`,{className:`text-foreground-subtle`,children:`Mode`}),c(`dd`,{className:`font-medium`,children:ee})]}),r(`div`,{children:[c(`dt`,{className:`text-foreground-subtle`,children:`Valid to`}),c(`dd`,{className:`font-mono`,children:l?.validTo?new Date(l.validTo).toLocaleString():`—`})]}),r(`div`,{children:[c(`dt`,{className:`text-foreground-subtle`,children:`Leaf SHA-256`}),c(`dd`,{className:`font-mono`,title:l?.leafFingerprintSha256??void 0,children:pt(l?.leafFingerprintSha256??null)})]}),r(`div`,{children:[c(`dt`,{className:`text-foreground-subtle`,children:`CA SHA-256`}),c(`dd`,{className:`font-mono`,title:l?.caFingerprintSha256??void 0,children:l?.mode===`uploaded`&&l.caFingerprintSha256===null?c(`span`,{className:`font-sans text-foreground-subtle`,children:`Issuer not included in the upload (not the local CA)`}):pt(l?.caFingerprintSha256??null)})]})]}),l&&l.sans.length>0&&c(`div`,{className:`flex flex-wrap gap-1`,children:l.sans.map(e=>c(`span`,{className:`rounded border border-border bg-surface px-1.5 py-0.5 font-mono text-[10px] text-foreground-subtle`,children:e},e))}),r(`div`,{className:`flex flex-wrap gap-2`,children:[c(v,{label:`Regenerate`,title:`Issue a new leaf?`,description:`Issues a new leaf under the current local CA. Clients that trust the CA keep working. The HTTPS listener reloads.`,confirmLabel:`Regenerate`,disabled:l?.mode===`uploaded`||n.isPending,action:()=>n.mutateAsync({})}),c(g,{size:`sm`,variant:`outline`,onClick:()=>d(e=>!e),children:`Upload`}),l?.caCertPem&&c(g,{size:`sm`,variant:`outline`,onClick:x,children:`Download CA`}),l?.mode===`uploaded`&&c(v,{label:`Revert to generated`,title:`Drop the uploaded certificate?`,description:`Deletes the uploaded pair and returns to the generated local CA.`,confirmLabel:`Revert`,confirmVariant:`danger`,disabled:i.isPending,action:()=>i.mutateAsync({})})]}),u&&r(`div`,{className:`space-y-2 border-t border-border pt-3`,children:[c($,{kind:`certificate`,label:`Certificate or full chain (PEM)`,value:f,onChange:p}),c($,{kind:`privateKey`,label:`Private key (PEM)`,value:m,onChange:_}),c($,{kind:`ca`,label:`CA (PEM, optional)`,value:y,onChange:b,rows:4}),c(g,{size:`sm`,disabled:!f.trim()||!m.trim()||Q(`certificate`,f)!==null||Q(`privateKey`,m)!==null||Q(`ca`,y)!==null||a.isPending,onClick:()=>a.mutate({certPem:f,keyPem:m,...y.trim()?{caPem:y}:{}}),children:`Save certificate`}),a.isError&&c(`p`,{className:`text-xs text-danger`,children:a.error instanceof Error?a.error.message:`Upload failed`})]})]})]})}function ht(){return c(`div`,{className:`flex flex-col p-4`,children:c(Ee,{defaultTab:`addresses`,tabs:[{id:`local-access`,label:`Local access`,icon:T,content:c(mt,{})},{id:`addresses`,label:`Network Addresses`,icon:j,content:c(Ye,{})},{id:`remote-access`,label:`Remote Access`,icon:W,content:c(je,{})},{id:`mesh`,label:`Mesh Networks`,icon:U,content:c($e,{})},{id:`turn`,label:`TURN Servers`,icon:_,content:c(Le,{})}]})})}export{ht as NetworkPage};