https://openstagesai.com/assets/auth-test-CZKZ53hH.js

1import{c as p,r as i,v as u,w as L,j as e,A as U,L as B}from"./index-RMaK0V5T.js";import{u as I,r as F,S as O}from"./default-avatars-CvMkcpxu.js";import{E as $,P as j}from"./ui-bits-DXKNWyk0.js";import{A as q}from"./activity-DKKqhAg2.js";const D=[["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"}]],P=p("log-in",D);const H=[["path",{d:"m16 17 5-5-5-5",key:"1bji2h"}],["path",{d:"M21 12H9",key:"dn1m92"}],["path",{d:"M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4",key:"1uf3rs"}]],J=p("log-out",H);const G=[["path",{d:"M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8",key:"v9h5vc"}],["path",{d:"M21 3v5h-5",key:"1q7to0"}],["path",{d:"M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16",key:"3uifl3"}],["path",{d:"M8 16H3v5",key:"1cv678"}]],K=p("refresh-cw",G);const V=[["line",{x1:"10",x2:"14",y1:"2",y2:"2",key:"14vaq8"}],["line",{x1:"12",x2:"15",y1:"14",y2:"11",key:"17fdiu"}],["circle",{cx:"12",cy:"14",r:"8",key:"1e1u0o"}]],Q=p("timer",V);const Y=[["path",{d:"M10 11v6",key:"nco0om"}],["path",{d:"M14 11v6",key:"outv1u"}],["path",{d:"M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6",key:"miytrc"}],["path",{d:"M3 6h18",key:"d0wm0j"}],["path",{d:"M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2",key:"e791ji"}]],W=p("trash-2",Y);const X=[["circle",{cx:"12",cy:"8",r:"5",key:"1hypcn"}],["path",{d:"M20 21a8 8 0 0 0-16 0",key:"rfgkzh"}]],Z=p("user-round",X);function _(t){const s=t.user_metadata??{};for(const r of["avatar_url","picture"]){const n=s[r];if(typeof n=="string"&&n)return n}return null}function ee(t){const s=t.user_metadata??{};return typeof s.full_name=="string"&&s.full_name||typeof s.name=="string"&&s.name||t.email?.split("@")[0]||"Me"}function R(t){return t.split(/\s+/).filter(Boolean).slice(0,2).map(s=>s[0]?.toUpperCase()??"").join("")||"?"}function te(){const[t,s]=i.useState(null),[r,n]=i.useState(!0);i.useEffect(()=>{let l=!0;const{data:a}=u.auth.onAuthStateChange((d,g)=>{l&&(s(g?.user??null),n(!1))});u.auth.getSession().then(({data:{session:d}})=>{l&&(s(d?.user??null),n(!1))});const m=()=>{l&&u.auth.getSession().then(({data:{session:d}})=>{l&&s(d?.user??null)})};return window.addEventListener("storage",m),()=>{l=!1,a.subscription.unsubscribe(),window.removeEventListener("storage",m)}},[]);const o=I({queryKey:["nav-profile",t?.id],enabled:!!t?.id,queryFn:async()=>{const l=t.id,{data:a,error:m}=await u.from("speaker_profiles").select("id, avatar_url, initials, name, slug").eq("owner_id",l).maybeSingle();if(m)throw m;const d=ee(t);return a?{profileId:a.id,avatarUrl:F(a.avatar_url??_(t),l),initials:a.initials||R(a.name||d),name:a.name||d,slug:a.slug}:{profileId:null,avatarUrl:_(t),initials:R(d),name:d,slug:null}}});return{user:t,loading:r,profile:o.data??null,profileLoading:!!t&&o.isLoading}}const se=Date.now(),N="auth-test:run",y="auth-test:baseline",C=5;function A(t){if(!t.length)return 0;const s=[...t].sort((n,o)=>n-o),r=Math.floor(s.length/2);return s.length%2?s[r]:(s[r-1]+s[r])/2}function ae(){const t=performance.getEntriesByType("navigation")[0];return{ttfbMs:t?.responseStart??0,domReadyMs:t?.domContentLoadedEventEnd??0}}function v(t){return performance.getEntriesByType("resource").filter(s=>s.name.includes(".supabase.co")&&s.name.includes(t)).length}async function re(){const t=performance.now(),{data:s}=await u.auth.getUser(),{data:r}=await u.auth.getUser(),n=r.user?.id??s.user?.id;return n&&await u.from("speaker_profiles").select("id").eq("owner_id",n).maybeSingle(),performance.now()-t}async function ne(){const t=performance.now(),{data:s}=await u.auth.getClaims(),r=s?.claims?.sub;return r&&await u.from("speaker_profiles").select("id").eq("owner_id",r).maybeSingle(),performance.now()-t}function ce(){const{user:t,loading:s}=te(),r=L(),[n]=i.useState(ae),[o,l]=i.useState(null),[a,m]=i.useState(null),[d,g]=i.useState(null),[h,b]=i.useState(null),[w,k]=i.useState(0);i.useEffect(()=>{b(JSON.parse(localStorage.getItem(y)??"null")),k(v("/auth/v1/user"))},[]),i.useEffect(()=>{if(s||!t)return;const c=sessionStorage.getItem(N);if(!c)return;sessionStorage.removeItem(N);const x=JSON.parse(c);l({ms:Date.now()-x.startedAt,mode:x.mode,fullReload:se>x.startedAt})},[s,t]);const S=i.useCallback(c=>{const x={startedAt:Date.now(),mode:c};sessionStorage.setItem(N,JSON.stringify(x)),c==="full"?window.location.href=`/auth?redirect=${encodeURIComponent("/auth-test")}

1`:r({to:"/auth",search:{redirect:"/auth-test"}})},[r]),E=i.useCallback(async()=>{g("ab");const c=[],x=[];for(let M=0;M<C;M++)c.push(await re()),x.push(await ne());m({current:A(c),optimized:A(x)}),k(v("/auth/v1/user")),g(null)},[]),T=i.useCallback(()=>{const c={at:Date.now(),roundTripMs:o?.ms??null,roundTripMode:o?.mode??null,fullReload:o?.fullReload??null,ttfbMs:n.ttfbMs,domReadyMs:n.domReadyMs,currentMs:a?.current??null,optimizedMs:a?.optimized??null,userCalls:v("/auth/v1/user")};localStorage.setItem(y,JSON.stringify(c)),b(c)},[a,n,o]),z=i.useCallback(async()=>{await u.auth.signOut(),l(null),m(null)},[]);return e.jsxs("div",{className:"max-w-2xl mx-auto py-16 px-4",children:[e.jsx($,{children:"Internal"}),e.jsx("h1",{className:"editorial-heading text-4xl mt-3",children:"Auth test"}),e.jsxs("p",{className:"mt-4 text-base text-muted-foreground leading-relaxed",children:["Measures what sign-in costs, so “it feels slow” becomes a number. Not linked from the nav, marked ",e.jsx("code",{className:"text-xs",children:"noindex"}),"."]}),e.jsxs("div",{className:"card-paper p-6 mt-10",children:[e.jsxs("div",{className:"flex items-center justify-between gap-4",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(Z,{className:"size-4 text-muted-foreground"}),e.jsx("h2",{className:"text-sm font-medium",children:"Session"})]}),s?e.jsx(j,{children:"Checking…"}):t?e.jsx(j,{variant:"brand",children:"Signed in"}):e.jsx(j,{children:"Signed out"})]}),!s&&t?e.jsxs("dl",{className:"mt-5 grid grid-cols-[7rem_1fr] gap-y-2 text-sm",children:[e.jsx("dt",{className:"text-muted-foreground",children:"Email"}),e.jsx("dd",{className:"break-all",children:t.email??"—"}),e.jsx("dt",{className:"text-muted-foreground",children:"User ID"}),e.jsx("dd",{className:"break-all font-mono text-xs pt-0.5",children:t.id}),e.jsx("dt",{className:"text-muted-foreground",children:"Provider"}),e.jsx("dd",{children:t.app_metadata?.provider??"—"})]}):!s&&e.jsx("p",{className:"mt-4 text-sm text-muted-foreground",children:"Signed out. Locally the Google button will 404 — the broker rejects localhost callbacks. Paste a session from production first."})]}),e.jsxs("div",{className:"card-paper p-6 mt-6",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(q,{className:"size-4 text-muted-foreground"}),e.jsx("h2",{className:"text-sm font-medium",children:"A/B: guard implementation"})]}),e.jsxs("p",{className:"mt-3 text-xs text-muted-foreground leading-relaxed",children:["Runs both implementations ",C,"× alternating, reports the median. This compares the code paths directly — no need to change the app to see what the optimisation is worth."]}),e.jsxs("button",{onClick:E,disabled:!t||d==="ab",className:"w-full mt-4 inline-flex items-center justify-center gap-2 h-11 rounded-md border border-border text-sm font-medium hover:bg-surface-2 transition disabled:opacity-50",children:[e.jsx(K,{className:`size-4 ${d==="ab"?"animate-spin":""}`}),d==="ab"?"Measuring…":"Compare current vs optimised"]}),a&&e.jsx("table",{className:"w-full mt-5 text-sm",children:e.jsxs("tbody",{children:[e.jsxs("tr",{className:"border-b border-border/50",children:[e.jsxs("td",{className:"py-2",children:[e.jsx("span",{className:"font-mono text-xs",children:"getUser ×2 → query"}),e.jsx("span",{className:"block text-[11px] text-muted-foreground",children:"current"})]}),e.jsxs("td",{className:"py-2 text-right tabular-nums",children:[a.current.toFixed(0)," ms"]})]}),e.jsxs("tr",{className:"border-b border-border/50",children:[e.jsxs("td",{className:"py-2",children:[e.jsx("span",{className:"font-mono text-xs",children:"getClaims → query"}),e.jsx("span",{className:"block text-[11px] text-muted-foreground",children:"optimised"})]}),e.jsxs("td",{className:"py-2 text-right tabular-nums",children:[a.optimized.toFixed(0)," ms"]})]}),e.jsxs("tr",{children:[e.jsx("td",{className:"py-2 font-medium",children:"Saved"}),e.jsxs("td",{className:"py-2 text-right tabular-nums font-medium",children:[(a.current-a.optimized).toFixed(0)," ms",e.jsxs("span",{className:"text-muted-foreground ml-1",children:["(",Math.round((1-a.optimized/a.current)*100),"%)"]})]})]})]})})]}),e.jsxs("div",{className:"card-paper p-6 mt-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(Q,{className:"size-4 text-muted-foreground"}),e.jsx("h2",{className:"text-sm font-medium",children:"Sign-in round trip"})]}),e.jsxs("p",{className:"text-xs text-muted-foreground leading-relaxed",children:["Both buttons bounce through ",e.jsx("code",{children:"/auth"})," and come back here. SPA mode isolates how"," ",e.jsx("code",{children:"/auth"})," sends you back; full-reload mode also includes the SSR cost a real visitor pays."]}),e.jsxs("button",{onClick:()=>S("spa"),className:"w-full inline-flex items-center justify-center gap-2 h-11 rounded-md bg-ink text-paper text-sm font-medium hover:opacity-90 transition",children:[e.jsx(P,{className:"size-4"}),"Round trip (client navigation)",e.jsx(U,{className:"size-4 opacity-80"})]}),e.jsx("button",{onClick:()=>S("full"),className:"w-full inline-flex items-center justify-center gap-2 h-11 rounded-md border border-border text-sm font-medium hover:bg-surface-2 transition",children:"Round trip (full page load

1)"}),o&&e.jsxs("div",{className:"pt-3 border-t border-border/50",children:[e.jsxs("p",{className:"text-xs text-muted-foreground",children:["Round trip (",o.mode==="spa"?"client navigation":"full page load",")"]}),e.jsxs("p",{className:"editorial-heading text-3xl mt-1",children:[o.ms,e.jsx("span",{className:"text-base text-muted-foreground ml-1",children:"ms"})]}),e.jsx("p",{className:"text-[11px] mt-2 leading-relaxed",children:o.mode==="full"?e.jsx("span",{className:"text-muted-foreground",children:"Full-reload mode reloads on the way out by design, so only the total time is meaningful here. Use client-navigation mode to judge the return trip."}):o.fullReload?e.jsxs("span",{className:"text-destructive",children:["A full page reload happened on the way back — that’s the"," ",e.jsx("code",{children:"window.location.assign()"})," in auth.tsx costing a whole SSR load."]}):e.jsx("span",{className:"text-brand",children:"Stayed inside the SPA on the way back — no SSR reload."})})]})]}),e.jsxs("div",{className:"card-paper p-6 mt-6",children:[e.jsx("h2",{className:"text-sm font-medium",children:"This page load"}),e.jsxs("dl",{className:"mt-4 grid grid-cols-[1fr_auto] gap-y-2 text-sm",children:[e.jsx("dt",{className:"text-muted-foreground",children:"TTFB"}),e.jsxs("dd",{className:"tabular-nums",children:[n.ttfbMs.toFixed(0)," ms"]}),e.jsx("dt",{className:"text-muted-foreground",children:"DOM ready"}),e.jsxs("dd",{className:"tabular-nums",children:[n.domReadyMs.toFixed(0)," ms"]}),e.jsxs("dt",{className:"text-muted-foreground",children:[e.jsx("code",{className:"text-xs",children:"/auth/v1/user"})," calls"]}),e.jsx("dd",{className:"tabular-nums",children:w})]}),e.jsxs("p",{className:"text-[11px] text-muted-foreground mt-3 leading-relaxed",children:["The call count is the hardest signal — it ignores network noise. A ",e.jsx("code",{children:"jwks.json"})," ","request appearing instead is expected: it is cached for 10 minutes."]})]}),e.jsxs("div",{className:"card-paper p-6 mt-6",children:[e.jsxs("div",{className:"flex items-center justify-between gap-4",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(O,{className:"size-4 text-muted-foreground"}),e.jsx("h2",{className:"text-sm font-medium",children:"Baseline"})]}),h&&e.jsxs("button",{onClick:()=>{localStorage.removeItem(y),b(null)},className:"inline-flex items-center gap-1.5 text-xs text-muted-foreground hover:text-foreground transition",children:[e.jsx(W,{className:"size-3.5"}),"Clear"]})]}),e.jsx("button",{onClick:T,className:"w-full mt-4 inline-flex items-center justify-center gap-2 h-11 rounded-md border border-border text-sm font-medium hover:bg-surface-2 transition",children:"Save current numbers as baseline"}),h?e.jsxs("table",{className:"w-full mt-5 text-sm",children:[e.jsx("thead",{children:e.jsxs("tr",{className:"text-left text-xs text-muted-foreground border-b border-border",children:[e.jsx("th",{className:"pb-2 font-normal",children:"Metric"}),e.jsx("th",{className:"pb-2 font-normal text-right",children:"Baseline"}),e.jsx("th",{className:"pb-2 font-normal text-right",children:"Now"})]})}),e.jsxs("tbody",{children:[e.jsx(f,{label:"Guard (current impl)",before:h.currentMs,after:a?.current}),e.jsx(f,{label:"Guard (optimised)",before:h.optimizedMs,after:a?.optimized}),e.jsx(f,{label:"Round trip",before:h.roundTripMs,after:o?.ms}),e.jsx(f,{label:"TTFB",before:h.ttfbMs,after:n.ttfbMs}),e.jsx(f,{label:"/auth/v1/user calls",before:h.userCalls,after:w,unit:""})]})]}):e.jsx("p",{className:"mt-4 text-xs text-muted-foreground leading-relaxed",children:"Nothing saved yet. Run the measurements above, then save — after changing the code, the same numbers appear side by side here."})]}),t&&e.jsxs("div",{className:"flex gap-3 mt-6",children:[e.jsx(B,{to:"/my-profile",className:"flex-1 inline-flex items-center justify-center gap-2 h-11 rounded-md border border-border text-sm hover:bg-surface-2 transition",children:"Open /my-profile"}),e.jsxs("button",{onClick:z,className:"flex-1 inline-flex items-center justify-center gap-2 h-11 rounded-md border border-border text-sm hover:bg-surface-2 transition",children:[e.jsx(J,{className:"size-4"}),"Sign out"]})]})]})}function f({label:t,before:s,after:r,unit:n=" ms"}){const l=typeof s=="number"&&typeof r=="number"?r-s:null;return e.jsxs("tr",{className:"border-b border-border/50 last:border-0",children:[e.jsx("td",{className:"py-2",children:t}),e.jsx("td",{className:"py-2 text-right tabular-nums text-muted-foreground",children:typeof s=="number"?`${s.toFixed(0)}${n}`:"—"}),e.jsxs("td",{className:"py-2 text-right tabular-nums",children:[typeof r=="number"?`${r.toFixed(0)}${n}`:"—",l!==null&&l!==0&&e.jsxs("span",{className:l<0?"text-brand ml-1.5":"text-destructive ml-1.5",children:[l<0?"↓":"↑",Math.abs(l).toFixed(0)]})]})]})}export{ce as component};