https://siz.land/_next/static/chunks/pages/mytab/onboarding-3f7a63ae3175bc59.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[685],{60454:(e,t,a)=>{(window.__NEXT_P=window.__NEXT_P||[]).push(["/mytab/onboarding",function(){return a(81939)}])},81939:(e,t,a)=>{"use strict";a.r(t),a.d(t,{default:()=>S});var r=a(37876),s=a(14232),l=a(77328),n=a.n(l),i=a(89099),o=a(10553),d=a(17581),c=a(70858);let m=e=>{let{onAliasConfirmed:t}=e,[a,l]=(0,s.useState)(""),[n,i]=(0,s.useState)(null),[o,d]=(0,s.useState)(!1),[m,x]=(0,s.useState)(null),u=(0,s.useCallback)(async e=>{let t=(0,c.jX)(e);if(t){i(t),x(null);return}d(!0),i(null);try{let t=await fetch("/api/mytab/alias/check?alias=".concat(encodeURIComponent(e))),a=await t.json();x(a.available),a.available||i("Username already taken")}catch(e){i("Could not check availability")}finally{d(!1)}},[]);return(0,r.jsxs)("div",{className:"flex flex-col gap-4",children:[(0,r.jsxs)("div",{children:[(0,r.jsx)("label",{className:"font-label text-[12px] leading-[16px] tracking-[0.05em] font-bold uppercase text-mt-on-surface-variant mb-2 block",children:"Choose your username"}),(0,r.jsxs)("div",{className:"relative group",children:[(0,r.jsx)("span",{className:"absolute left-4 top-1/2 -translate-y-1/2 text-mt-on-surface-variant font-headline text-lg",children:"@"}),(0,r.jsx)("input",{className:"w-full bg-mt-pure-black/30 border border-mt-glass-border rounded-2xl pl-10 pr-12 py-4 font-mono text-[15px] leading-[20px] tracking-[0.02em] font-medium text-mt-ledger-white focus:border-mt-primary focus:bg-mt-pure-black/50 focus:outline-none focus:ring-4 focus:ring-mt-primary/10 placeholder:text-mt-on-surface-variant/50 transition-all duration-300 shadow-inner",placeholder:"your_username",value:a,onChange:e=>{let t=e.target.value.toLowerCase().replace(/[^a-z0-9_]/g,"");if(l(t),x(null),i(null),t.length>=3){let e=setTimeout(()=>u(t),400);return()=>clearTimeout(e)}},maxLength:20}),(0,r.jsxs)("div",{className:"absolute right-4 top-1/2 -translate-y-1/2",children:[o&&(0,r.jsx)("span",{className:"material-symbols-outlined text-mt-on-surface-variant animate-spin text-[20px]",children:"progress_activity"}),!o&&!0===m&&(0,r.jsx)("span",{className:"material-symbols-outlined text-mt-primary text-[20px]",children:"check_circle"}),!o&&!1===m&&(0,r.jsx)("span",{className:"material-symbols-outlined text-mt-error text-[20px]",children:"cancel"})]})]}),n&&(0,r.jsx)("p",{className:"text-mt-error text-sm mt-2 font-body",children:n}),m&&!n&&(0,r.jsxs)("p",{className:"text-mt-primary text-sm mt-2 font-body",children:["@",a," is available"]})]}),(0,r.jsxs)("button",{disabled:!m||!!n,onClick:()=>t(a),className:"w-full bg-mt-primary text-mt-pure-black font-body text-base font-bold rounded-full py-4 hover:bg-mt-primary-fixed hover:shadow-[0_0_24px_rgba(66,238,147,0.4)] hover:-translate-y-1 transition-all duration-300 disabled:opacity-40 disabled:cursor-not-allowed disabled:hover:translate-y-0 disabled:hover:shadow-none flex justify-center items-center gap-2",children:[(0,r.jsx)("span",{className:"material-symbols-outlined",children:"verified"}),"Claim @",a||"username"]})]})},x=e=>{let{selected:t,onSelect:a}=e;return(0,r.jsxs)("div",{className:"flex flex-col gap-3 sm:gap-4 min-w-0",children:[(0,r.jsx)("button",{type:"button",onClick:()=>a("external"),className:"relative w-full min-w-0 text-left p-4 sm:p-6 rounded-3xl border transition-all duration-300 group ".concat("external"===t?"border-mt-primary bg-mt-primary/10 shadow-[0_0_20px_rgba(66,238,147,0.15)]":"border-mt-glass-border bg-mt-pure-black/20 hover:border-mt-primary/40 hover:bg-mt-pure-black/30"),children:(0,r.jsxs)("div",{className:"flex items-start gap-3 sm:gap-4 min-w-0",children:[(0,r.jsx)("div",{className:"shrink-0 p-2.5 sm:p-3 rounded-2xl border ".concat("external"===t?"bg-mt-primary/20 border-mt-primary/30":"bg-mt-surface-container-highest/50 border-mt-glass-border"),children:(0,r.jsx)("span",{className:"material-symbols-outlined text-2xl text-mt-primary",children:"account_balance_wallet"})}),(0,r.jsxs)("div",{className:"flex-1 min-w-0",children:[(0,r.jsx)("h3",{className:"font-headline text-base sm:text-lg text-mt-ledger-white font-bold mb-1 normal-case tracking-normal",children:"Connect Existing Wallet"}),(0,r.jsx)("p",{className:"font-body text-sm text-mt-on-surface-variant leading-relaxed",children:"Use MetaMask, Coinbase Wallet, or any WalletConnect-compatible wallet. You manage your own keys and pay gas fees."}),(0,r.jsxs)("div",{className:"flex flex-wrap items-center gap-2 mt-3",children:[(0,r.jsx)("span",{className:"bg-mt-surface-container-high/80 border border-mt-glass-border text-mt-on-surface-variant px-2.5 py-1 rounded-full font-label text-[10px] tracking-wider up

1percase",children:"Self-custody"}),(0,r.jsx)("span",{className:"bg-mt-surface-container-high/80 border border-mt-glass-border text-mt-on-surface-variant px-2.5 py-1 rounded-full font-label text-[10px] tracking-wider uppercase",children:"Gas fees apply"})]})]}),(0,r.jsx)("div",{className:"w-5 h-5 rounded-full border-2 shrink-0 mt-1 flex items-center justify-center overflow-hidden transition-all ".concat("external"===t?"border-mt-primary bg-mt-primary":"border-mt-outline"),children:"external"===t&&(0,r.jsx)("span",{className:"material-symbols-outlined text-mt-pure-black text-[14px]",children:"check"})})]})}),(0,r.jsx)("button",{type:"button",onClick:()=>a("smart_account"),className:"relative w-full min-w-0 text-left p-4 sm:p-6 rounded-3xl border transition-all duration-300 group ".concat("smart_account"===t?"border-mt-primary bg-mt-primary/10 shadow-[0_0_20px_rgba(66,238,147,0.15)]":"border-mt-glass-border bg-mt-pure-black/20 hover:border-mt-primary/40 hover:bg-mt-pure-black/30"),children:(0,r.jsxs)("div",{className:"flex items-start gap-3 sm:gap-4 min-w-0",children:[(0,r.jsx)("div",{className:"shrink-0 p-2.5 sm:p-3 rounded-2xl border ".concat("smart_account"===t?"bg-mt-primary/20 border-mt-primary/30":"bg-mt-surface-container-highest/50 border-mt-glass-border"),children:(0,r.jsx)("span",{className:"material-symbols-outlined text-2xl text-mt-primary",children:"auto_awesome"})}),(0,r.jsxs)("div",{className:"flex-1 min-w-0",children:[(0,r.jsx)("h3",{className:"font-headline text-base sm:text-lg text-mt-ledger-white font-bold mb-1 normal-case tracking-normal",children:"Create Smart Account"}),(0,r.jsx)("p",{className:"font-body text-sm text-mt-on-surface-variant leading-relaxed",children:"We generate a secure wallet for you. No browser extensions needed. Gas fees are sponsored — completely free to start."}),(0,r.jsxs)("div",{className:"flex flex-wrap items-center gap-2 mt-3",children:[(0,r.jsx)("span",{className:"bg-mt-primary/10 border border-mt-primary/20 text-mt-primary px-2.5 py-1 rounded-full font-label text-[10px] tracking-wider uppercase",children:"Recommended"}),(0,r.jsx)("span",{className:"bg-mt-surface-container-high/80 border border-mt-glass-border text-mt-on-surface-variant px-2.5 py-1 rounded-full font-label text-[10px] tracking-wider uppercase",children:"Gas-free"}),(0,r.jsx)("span",{className:"bg-mt-surface-container-high/80 border border-mt-glass-border text-mt-on-surface-variant px-2.5 py-1 rounded-full font-label text-[10px] tracking-wider uppercase",children:"ERC-4337"})]})]}),(0,r.jsx)("div",{className:"w-5 h-5 rounded-full border-2 shrink-0 mt-1 flex items-center justify-center overflow-hidden transition-all ".concat("smart_account"===t?"border-mt-primary bg-mt-primary":"border-mt-outline"),children:"smart_account"===t&&(0,r.jsx)("span",{className:"material-symbols-outlined text-mt-pure-black text-[14px]",children:"check"})})]})})]})};var u=a(90246),b=a(8047),p=a(94508),f=a(99867);function h(e){var t;let a=null!=(t=e.issuedAt)?t:new Date().toISOString();return["MyTab Alias Registration\n","Register @".concat(e.alias.toLowerCase()," to ").concat(e.address),"Domain: ".concat(e.domain),"Issued At: ".concat(a)].join("\n")}let y=e=>{let{alias:t,onConnected:a}=e,{address:l,isConnected:n,chain:i}=(0,b.F)(),{disconnect:o}=(0,p.u)(),{signMessageAsync:d}=(0,f.Y)(),[c,m]=(0,s.useState)(null),[x,y]=(0,s.useState)(!1),g=(0,s.useCallback)(async()=>{if(l){y(!0),m(null);try{let e=h({alias:t,address:l,domain:window.location.host}),r=await d({message:e}),s=await fetch("/api/mytab/alias/register",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({alias:t,address:l,signature:r,message:e})}),n=await s.json();if(!s.ok)throw Error(n.error||"Alias registration failed");a(l)}catch(e){m(e instanceof Error?e.message:"Registration failed")}finally{y(!1)}}},[l,t,a,d]);return(0,r.jsxs)("div",{className:"flex flex-col gap-5",children:[(0,r.jsx)("div",{className:"bg-mt-primary/5 border border-mt-primary/15 rounded-2xl p-4",children:(0,r.jsxs)("p",{className:"font-body text-sm text-mt-on-surface-variant leading-relaxed",children:["Connect an existing wallet (MetaMask, Coinbase, etc.). You will sign a message to bind ",(0,r.jsxs)("span",{className:"text-mt-primary font-bold",children:["@",t]})," ","to your address. Gas fees apply for on-chain transactions."]})}),(0,r.jsx)("div",{className:"flex justify-center",children:(0,r.jsx)(u.pK,{})}),n&&l&&(0,r.jsxs)("div",{className:"flex flex-col gap-3",children:[(0,r.jsx)("div",{className:"bg-mt-pure-black/30 border border-mt-glass-border rounded-2xl px-5 py-4 font-mono text-[13px] text-mt-ledger-white break-all",children:l}),i&&(0,r.jsxs)("p",{className:"font-body text-xs text-mt-on-surface-variant text-center",children:["Network: ",i.name]}),(0,r.jsxs)("button",{type:"button",disabled:x,onClick:g,className:"w-full bg-mt-primary text-mt-pure-black font-body text-base font-bold rounded-full py-4 hover:bg-mt-primary-fixed transition-all disabled:opacity-40 flex justify-center items-center gap-2",children:[x?(0,r.jsx)("span",{className:"material-symbols-outlined animate-spin",children:"progress_activity"}):(0,r.jsx)("span",{className:"material-symbols-outlined",children:"draw"}),x?"Signing…":"Sign & Bind @".concat(t)]}),(0,r.jsx)("button",{type:"button",onClick:()=>o(),className:"text-mt-on-surface-variant text-sm font-body hover:text-mt-error transition-colors",children:"Disconnect wallet"})]}),c&&(0,r.jsx)("p",{className:"text-mt-error text-sm font-body text-center",children:c})]})};var g=a(50651),w=a(96106);let j=e=>{let{alias:t,onConnected:l}

1=e,[n,i]=(0,s.useState)(g.loadSmartAccountAddress),[o,d]=(0,s.useState)(null),[c,m]=(0,s.useState)(!1),x=async()=>{if(n){m(!0),d(null);try{let e=(await Promise.resolve().then(a.bind(a,50651))).loadSmartAccountPrivateKey();if(!e)throw Error("Smart account key not found");let r=(0,w.R)(e),s=h({alias:t,address:r.address,domain:window.location.host}),n=await r.signMessage({message:s}),i=await fetch("/api/mytab/alias/register",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({alias:t,address:r.address,signature:n,message:s})}),o=await i.json();if(!i.ok)throw Error(o.error||"Alias registration failed");l(r.address)}catch(e){d(e instanceof Error?e.message:"Setup failed")}finally{m(!1)}}};return(0,r.jsxs)("div",{className:"flex flex-col gap-5",children:[(0,r.jsx)("div",{className:"bg-mt-primary/5 border border-mt-primary/15 rounded-2xl p-4",children:(0,r.jsx)("p",{className:"font-body text-sm text-mt-on-surface-variant leading-relaxed",children:"We generate a secure wallet in your browser. Keys stay on this device — gas is sponsored once ERC-4337 paymaster is live on Base."})}),n?(0,r.jsxs)("div",{className:"flex flex-col gap-3",children:[(0,r.jsx)("div",{className:"bg-mt-pure-black/30 border border-mt-glass-border rounded-2xl px-5 py-4 font-mono text-[13px] text-mt-ledger-white break-all",children:n}),(0,r.jsx)("span",{className:"bg-mt-primary/10 border border-mt-primary/20 text-mt-primary px-3 py-1.5 rounded-full font-label text-[10px] tracking-wider uppercase text-center w-fit mx-auto",children:"Gas-free (when paymaster live)"}),(0,r.jsxs)("button",{type:"button",disabled:c,onClick:x,className:"w-full bg-mt-primary text-mt-pure-black font-body text-base font-bold rounded-full py-4 hover:bg-mt-primary-fixed transition-all disabled:opacity-40 flex justify-center items-center gap-2",children:[c?(0,r.jsx)("span",{className:"material-symbols-outlined animate-spin",children:"progress_activity"}):(0,r.jsx)("span",{className:"material-symbols-outlined",children:"draw"}),c?"Registering…":"Sign & Bind @".concat(t)]})]}):(0,r.jsxs)("button",{type:"button",onClick:()=>{d(null),i((0,g.createSmartAccount)().address)},className:"w-full bg-mt-primary text-mt-pure-black font-body text-base font-bold rounded-full py-4 hover:bg-mt-primary-fixed transition-all flex justify-center items-center gap-2",children:[(0,r.jsx)("span",{className:"material-symbols-outlined",children:"auto_awesome"}),"Generate Smart Account"]}),o&&(0,r.jsx)("p",{className:"text-mt-error text-sm font-body text-center",children:o})]})};var v=a(96188),N=a(44834);let k={alias:{title:"Pick your identity",subtitle:"Your @username is how others find you on MyTab.",icon:"badge"},track:{title:"Choose your wallet track",subtitle:"External wallet or gas-free smart account.",icon:"account_balance_wallet"},wallet:{title:"Connect your wallet",subtitle:"Sign to bind your @username to your address.",icon:"draw"},phone:{title:"Verify your phone",subtitle:"Anchor your identity for recovery and trust scoring.",icon:"smartphone"},complete:{title:"You're all set",subtitle:"Your MyTab ledger is ready to use.",icon:"celebration"}},_=["alias","track","wallet","phone","complete"];function S(){let e=(0,i.useRouter)(),{update:t}=(0,o.useSession)(),[a,l]=(0,s.useState)(!1),[c,u]=(0,s.useState)("alias"),[b,p]=(0,s.useState)(""),[f,h]=(0,s.useState)(null),[g,w]=(0,s.useState)(null),[S,C]=(0,s.useState)(!1);if((0,s.useEffect)(()=>l(!0),[]),!a)return null;let A=_.indexOf(c),E=k[c],T=e=>{w(e),u("phone")},M=async()=>{(0,N.n3)({alias:b,walletTrack:f,accountAddress:g,phoneVerified:S}),f&&(0,N.Qt)(f),await (null==t?void 0:t({mytabAlias:b,mytabAccountAddress:g,walletTrack:f,phoneVerified:S})),e.push("/mytab")};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsxs)(n(),{children:[(0,r.jsx)("title",{children:"Set Up MyTab"}),(0,r.jsx)("meta",{name:"description",content:"Create your MyTab identity"})]}),(0,r.jsxs)("div",{className:"mytab-app flex min-h-screen relative text-mt-on-background selection:bg-mt-primary/30 selection:text-mt-primary",children:[(0,r.jsx)(d.X,{}),(0,r.jsxs)("main",{className:"flex-1 flex flex-col items-center justify-center w-full max-w-full px-4 py-12 relative z-10",children:[(0,r.jsx)("div",{className:"w-full max-w-md min-w-0 mb-8 sm:mb-12",children:(0,r.jsx)("div",{className:"flex items-center justify-between gap-1 mb-2",children:_.map((e,t)=>(0,r.jsxs)(s.Fragment,{children:[(0,r.jsx)("div",{className:"w-7 h-7 sm:w-8 sm:h-8 shrink-0 overflow-hidden rounded-full flex items-center justify-center text-sm font-bold transition-all duration-300 ".concat(t<=A?"bg-mt-primary text-mt-pure-black shadow-[0_0_12px_rgba(66,238,147,0.4)]":"bg-mt-surface-container-highest/50 text-mt-on-surface-variant border border-mt-glass-border"),children:t<A?(0,r.jsx)("span",{className:"material-symbols-outlined text-[16px]",children:"check"}):t+1}),t<_.length-1&&(0,r.jsx)("div",{className:"flex-1 min-w-0 h-0.5 mx-0.5 sm:mx-1 rounded transition-all duration-500 ".concat(t<A?"bg-mt-primary":"bg-mt-glass-border")})]},e))})}),(0,r.jsxs)("div",{className:"w-full max-w-md min-w-0 bg-mt-surface-container-lowest/40 backdrop-blur-xl border border-mt-glass-border rounded-[2rem] p-5 sm:p-8 shadow-2xl relative overflow-hidden",children:[(0,r.jsx)("div",{className:"absolute top-0 right-0 w-48 h-48 bg-mt-primary/5 rounded-full blur-[60px] -translate-y-1/2 translate-x-1/4 pointer-events-none"}),(0,r.jsxs)("div",{className:"flex items-start gap-3 sm:gap-4 mb-6 sm:mb-8 relative z-10 min-w-0",children:[(0,r.jsx)("div",{className:"shrink-0 bg-mt-primary/20 p-2.5 sm:p-3 rounded-2xl border border-mt-primary/20",children:(0,r.jsx)("span",{className:"material-symbols-outlined text-mt-primary text-2xl",children:E.icon})}),(0,r.jsxs)("div",{className:"min-w-0 flex-1",children:[(0,r.jsx)("h2",{className:"font-headline text-lg sm:text-xl text-mt-ledger-white font-bold normal-case tracking-normal break-words",children:E.title}),(0,r.jsx)("p",{className:"font-body text-sm text-mt-on-surface-variant mt-0.5",children:E.subtitle})]})]}),(0,r.jsxs)("div",{className:"relative z-10 min-w-0",children:["alias"===c&&(0,r.jsx)(m,{onAliasConfirmed:e=>{p(e),u("track")}}),"track"===c&&(0,r.jsxs)("div",{className:"flex flex-col gap-6 min-w-0",children:[(0,r.jsx)(x,{selected:f,onSelect:h}),(0,r.jsxs)("button",{type:"button",disabled:!f,onClick:()=>{f&&u("wallet")},className:"w-full min-w-0 bg-mt-primary text-mt-pure-black font-body text-base font-bold rounded-full py-4 hover:bg-mt-primary-fixed hover:shadow-[0_0_24px_rgba(66,238,147,0.4)] hover:-translate-y-1 transition-all duration-300 disabled:opacity-40 disabled:cursor-not-allowed disabled:hover:translate-y-0 flex justify-center items-center gap-2",children:[(0,r.jsx)("span",{className:"material-symbols-outlined",children:"arrow_forward"}),"Continue"]})]}),"wallet"===c&&"external"===f&&(0,r.jsx)(y,{alias:b,onConnected:T}),"wallet"===c&&"smart_account"===f&&(0,r.jsx)(j,{alias:b,onConnected:T}

1),"phone"===c&&(0,r.jsx)(v.g,{accountAddress:g,onVerified:()=>{C(!0),u("complete")},onSkip:()=>u("complete")}),"complete"===c&&(0,r.jsxs)("div",{className:"flex flex-col items-center text-center gap-6",children:[(0,r.jsx)("div",{className:"w-20 h-20 rounded-full bg-mt-primary/20 border border-mt-primary/30 flex items-center justify-center",children:(0,r.jsx)("span",{className:"material-symbols-outlined text-4xl text-mt-primary",style:{fontVariationSettings:"'FILL' 1"},children:"celebration"})}),(0,r.jsxs)("div",{className:"flex flex-col gap-3 w-full",children:[(0,r.jsxs)("div",{className:"bg-mt-pure-black/30 border border-mt-glass-border rounded-2xl p-4 text-left",children:[(0,r.jsx)("p",{className:"font-label text-[10px] tracking-wider uppercase text-mt-on-surface-variant mb-1",children:"Username"}),(0,r.jsxs)("p",{className:"font-mono text-lg text-mt-primary",children:["@",b]})]}),(0,r.jsxs)("div",{className:"bg-mt-pure-black/30 border border-mt-glass-border rounded-2xl p-4 text-left",children:[(0,r.jsx)("p",{className:"font-label text-[10px] tracking-wider uppercase text-mt-on-surface-variant mb-1",children:"Wallet"}),(0,r.jsx)("p",{className:"font-mono text-xs text-mt-ledger-white break-all",children:g})]}),(0,r.jsxs)("div",{className:"bg-mt-pure-black/30 border border-mt-glass-border rounded-2xl p-4 text-left",children:[(0,r.jsx)("p",{className:"font-label text-[10px] tracking-wider uppercase text-mt-on-surface-variant mb-1",children:"Phone"}),(0,r.jsx)("p",{className:"font-body text-mt-ledger-white",children:S?"Verified & hash registered":"Skipped — verify later in Settings"})]})]}),(0,r.jsxs)("button",{type:"button",onClick:M,className:"w-full bg-mt-primary text-mt-pure-black font-body text-base font-bold rounded-full py-4 hover:bg-mt-primary-fixed hover:shadow-[0_0_24px_rgba(66,238,147,0.4)] hover:-translate-y-1 transition-all duration-300 flex justify-center items-center gap-2",children:[(0,r.jsx)("span",{className:"material-symbols-outlined",children:"dashboard"}),"Go to Dashboard"]})]})]})]})]})]})]})}}},e=>{e.O(0,[422,636,6593,8792],()=>e(e.s=60454)),_N_E=e.O()}]);