https://www.pathfindercard.com/assets/Activate-DIJ0AnA5.js

1import{r as o,j as a,L as D,F as G}from"./index-CC1u1DhI.js";import{B as E}from"./Button-1ZUN4Kdg.js";import{l as H}from"./logo-purple-CQMhzVvH.js";function Q(){const[x,f]=o.useState("phone"),[i,O]=o.useState("+1"),[l,w]=o.useState(Array(10).fill("")),[v,A]=o.useState(""),[h,m]=o.useState(Array(4).fill("")),[g,y]=o.useState(!1),[j,p]=o.useState(""),d=o.useRef([]),u=o.useRef([]),L=o.useRef(null),b="https://pathfinder-cards-three.vercel.app",C=()=>{const e=v||l.join("");return`${i}${e}`},N=async()=>{const e=v||l.join("");if(!(!e||e.length<10||!i)){y(!0),p("");try{const t=await fetch(`${b}/api/otp-v2/send`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({phoneNumber:C()})}),s=await t.json();if(!t.ok||!s.success)throw new Error(s.error||"Failed to send verification code");f("otp")}catch(t){p(t instanceof Error?t.message:"Something went wrong. Please try again.")}finally{y(!1)}}},R=async()=>{try{const e=await fetch(`${b}/api/cards/activate`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({phoneNumber:C()})}),t=await e.json();if(!e.ok||!t.success)throw new Error(t.error||"Card activation failed");f("success")}catch(e){p(e instanceof Error?e.message:"Card activation failed. Please try again."),f("otp")}finally{y(!1)}},P=async()=>{const e=h.join("");if(e.length===4){y(!0),p("");try{const t=await fetch(`${b}/api/otp-v2/verify`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({phoneNumber:C(),code:e})}),s=await t.json();if(!t.ok||!s.success)throw new Error(s.error||"Verification failed");if(!s.approved)throw new Error("Invalid verification code. Please try again.");f("activating"),await R()}catch(t){p(t instanceof Error?t.message:"Something went wrong. Please try again."),y(!1)}}},$=(e,t)=>{var c;const s=t.replace(/\D/g,"").slice(-1),r=[...l];r[e]=s,w(r),s&&e<9&&((c=d.current[e+1])==null||c.focus())},F=(e,t)=>{var s,r,c;if(t.key==="Backspace")if(t.preventDefault(),l[e]===""&&e>0)(s=d.current[e-1])==null||s.focus();else{const n=[...l];n[e]="",w(n)}else t.key==="ArrowLeft"&&e>0?(r=d.current[e-1])==null||r.focus():t.key==="ArrowRight"&&e<9?(c=d.current[e+1])==null||c.focus():t.key==="Enter"&&N()},M=e=>{var c;e.preventDefault();let t=e.clipboardData.getData("text").replace(/\D/g,"");t.length===11&&t.startsWith("1")&&i==="+1"&&(t=t.slice(1)),t=t.slice(0,10);const s=Array(10).fill("");for(let n=0;n<t.length;n++)s[n]=t[n];w(s);const r=s.findIndex(n=>n==="");(c=d.current[r===-1?9:r])==null||c.focus()},S=e=>{const t=e.replace(/[^+\d]/g,"").slice(0,4);O(t)},T=e=>{let t=e.replace(/\D/g,"");t.length===11&&t.startsWith("1")&&i==="+1"&&(t=t.slice(1)),A(t.slice(0,10))},B=(e,t)=>{var c;const s=t.replace(/\D/g,"").slice(-1),r=[...h];r[e]=s,m(r),s&&e<3&&((c=u.current[e+1])==null||c.focus())},K=(e,t)=>{var s,r,c;if(t.key==="Backspace")if(t.preventDefault(),h[e]===""&&e>0)(s=u.current[e-1])==null||s.focus();else{const n=[...h];n[e]="",m(n)}else t.key==="ArrowLeft"&&e>0?(r=u.current[e-1])==null||r.focus():t.key==="ArrowRight"&&e<3?(c=u.current[e+1])==null||c.focus():t.key==="Enter"&&P()},I=e=>{var c;e.preventDefault();const t=e.clipboardData.getData("text").replace(/\D/g,"").slice(0,4),s=Array(4).fill("");for(let n=0;n<t.length;n++)s[n]=t[n];m(s);const r=s.findIndex(n=>n==="");(c=u.current[r===-1?3:r])==null||c.focus()},W=l.every(e=>e!==""),J=v.length===10,V=(W||J)&&i.length>=2,Y=h.every(e=>e!==""),k=(e,t,s)=>a.jsx("div",{className:`activate-phone-group activate-phone-group-${s}`,children:l.slice(e,t).map((r,c)=>a.jsx("input",{ref:n=>{d.current[e+c]=n},type:"tel",inputMode:"numeric",maxLength:1,value:r,onChange:n=>$(e+c,n.target.value),onKeyDown:n=>F(e+c,n),onPaste:M},e+c))}),U=()=>{const e=v||l.join("");return e.length===10?`${i} (${e.slice(0,3)}) ${e.slice(3,6)}-${e.slice(6)}`:`${i}${e}`};return a.jsxs("div",{className:"activate-page",children:[a.jsxs("header",{className:"activate-header",children:[a.jsx(D,{to:"/",children:a.jsx("img",{src:H,alt:"Pathfinder",className:"activate-logo"})}),a.jsx(D,{to:"/contact",className:"activate-contact-support",children:"Contact Support"})]}),a.jsx("div",{className:"activate-container",children:a.jsx("div",{className:"activate-card",children:x==="activating"?a.jsxs("div",{className:"activate-success",children:[a.jsx("div",{className:"activate-spinner"}),a.jsx("h1",{children:"Activating your card..."}),a.jsx("p",{children:"This may take a moment. Please don't close this page."})]}):x==="success"?a.jsxs("div",{className:"activate-success",children:[a.jsx("div",{className:"activate-success-icon",children:a.jsx("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",children:a.jsx("path",{d:"M20 6L9 17l-5-5",strokeLinecap:"round",strokeLinejoin:"round"})})}

1),a.jsx("h1",{children:"Your card is now activated!"}),a.jsx("p",{children:"You're all set to start using your Pathfinder card."}),a.jsx(D,{to:"/",className:"activate-back-link",children:"Back to Home"})]}):x==="otp"?a.jsxs("div",{className:"activate-form",children:[a.jsx("h1",{className:"activate-title",children:"Enter verification code"}),a.jsxs("p",{className:"activate-subtitle",children:["We sent a 4-digit code to ",U()]}),j&&a.jsx("div",{className:"activate-error",children:j}),a.jsx("div",{className:"activate-otp-container",children:h.map((e,t)=>a.jsx("input",{ref:s=>{u.current[t]=s},type:"tel",inputMode:"numeric",maxLength:1,value:e,onChange:s=>B(t,s.target.value),onKeyDown:s=>K(t,s),onPaste:I,className:"activate-otp-input",autoFocus:t===0},t))}),a.jsx(E,{variant:"purple",onClick:P,className:"activate-submit",disabled:!Y||g,children:g?"Verifying...":"Verify"}),a.jsx("button",{className:"activate-resend",onClick:()=>{m(Array(4).fill("")),p(""),N()},disabled:g,children:"Didn't receive the code? Resend"}),a.jsx("button",{className:"activate-back",onClick:()=>{f("phone"),m(Array(4).fill("")),p("")},children:"← Change phone number"})]}):a.jsxs("div",{className:"activate-form",children:[a.jsx("h1",{className:"activate-title",children:"Activate your card"}),a.jsx("p",{className:"activate-subtitle",children:"Enter the phone number associated with your Pathfinder account."}),j&&a.jsx("div",{className:"activate-error",children:j}),a.jsxs("div",{className:"activate-field",children:[a.jsx("label",{className:"activate-label",children:"Your Phone Number"}),a.jsxs("div",{className:"activate-phone-desktop",children:[a.jsx("input",{ref:L,type:"tel",className:"activate-country",value:i,onChange:e=>S(e.target.value),onKeyDown:e=>{var t;return e.key==="ArrowRight"&&((t=d.current[0])==null?void 0:t.focus())},placeholder:"+1"}),a.jsx("span",{className:"activate-separator",children:"-"}),k(0,3,3),a.jsx("span",{className:"activate-separator",children:"-"}),k(3,6,3),a.jsx("span",{className:"activate-separator",children:"-"}),k(6,10,4)]}),a.jsxs("div",{className:"activate-phone-mobile",children:[a.jsx("input",{type:"tel",className:"activate-country",value:i,onChange:e=>S(e.target.value),placeholder:"+1"}),a.jsx("input",{type:"tel",inputMode:"numeric",className:"activate-input activate-phone-simple",value:v,onChange:e=>T(e.target.value),onKeyDown:e=>e.key==="Enter"&&N(),maxLength:10,autoFocus:!0})]})]}),a.jsx(E,{variant:"purple",onClick:N,className:"activate-submit",disabled:!V||g,children:g?"Sending...":"Continue"})]})})}),a.jsx(G,{})]})}export{Q as default};