https://flipspeak.ai/assets/RegisterPage-BNtAv7m0.js

1import{a as S,d as E,u as y,r as c,e as L,j as s,L as b,f as $}from"./index-C143ad9o.js";const I="_container_lotax_1",A="_header_lotax_8",G="_logoLink_lotax_17",B="_logo_lotax_17",P="_headerControls_lotax_27",F="_languageSelector_lotax_33",D="_langBtn_lotax_42",R="_active_lotax_58",O="_themeToggle_lotax_65",W="_main_lotax_83",H="_registerCard_lotax_91",K="_title_lotax_101",M="_subtitle_lotax_109",q="_form_lotax_116",z="_error_lotax_122",J="_inputGroup_lotax_131",Q="_label_lotax_137",U="_input_lotax_131",V="_inputError_lotax_167",X="_inputWithStatus_lotax_171",Y="_statusChecking_lotax_182",Z="_statusAvailable_lotax_183",ee="_statusTaken_lotax_184",se="_errorText_lotax_203",ae="_submitBtn_lotax_208",te="_footer_lotax_230",oe="_loginLink_lotax_237",re="_successCard_lotax_254",ne="_successIcon_lotax_265",e={container:I,header:A,logoLink:G,logo:B,headerControls:P,languageSelector:F,langBtn:D,active:R,themeToggle:O,main:W,registerCard:H,title:K,subtitle:M,form:q,error:z,inputGroup:J,label:Q,input:U,inputError:V,inputWithStatus:X,statusChecking:Y,statusAvailable:Z,statusTaken:ee,errorText:se,submitBtn:ae,footer:te,loginLink:oe,successCard:re,successIcon:ne},le="https://www.dheraldlang.com/img/common/logo_black.png",ie="https://www.dheraldlang.com/img/common/logo_white.png";function me(){const k=S(),{theme:u,toggleTheme:j}=E(),{language:a,setLanguage:p}=y(),[t,N]=c.useState({member_id:"",password:"",password_confirm:"",member_name:"",email:"",phone:""}),[m,_]=c.useState("idle"),[o,d]=c.useState({}),[l,g]=c.useState(!1),[f,w]=c.useState(!1);c.useEffect(()=>{if(t.member_id.length>=3){_("checking");const r=setTimeout(async()=>{const n=await L(t.member_id);_(n?"available":"taken")},500);return()=>clearTimeout(r)}else _("idle")},[t.member_id]);const i=r=>{const{name:n,value:T}=r.target;N(h=>({...h,[n]:T})),o[n]&&d(h=>{const x={...h};return delete x[n],x})},v=()=>{const r={};return!t.member_id||t.member_id.length<3?r.member_id=a==="ko"?"아이디는 3자 이상이어야 합니다.":"ID must be at least 3 characters.":m==="taken"&&(r.member_id=a==="ko"?"이미 사용 중인 아이디입니다.":"This ID is already taken."),(!t.password||t.password.length<6)&&(r.password=a==="ko"?"비밀번호는 6자 이상이어야 합니다.":"Password must be at least 6 characters."),t.password!==t.password_confirm&&(r.password_confirm=a==="ko"?"비밀번호가 일치하지 않습니다.":"Passwords do not match."),t.member_name||(r.member_name=a==="ko"?"이름을 입력해주세요.":"Please enter your name."),t.email&&!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(t.email)&&(r.email=a==="ko"?"올바른 이메일 형식이 아닙니다.":"Invalid email format."),d(r),Object.keys(r).length===0},C=async r=>{if(r.preventDefault(),!!v()){g(!0);try{const n=await $({member_id:t.member_id,password:t.password,member_name:t.member_name,email:t.email||void 0,phone:t.phone||void 0});n.success?(w(!0),setTimeout(()=>{k("/login")},2e3)):d({form:n.error||(a==="ko"?"회원가입에 실패했습니다.":"Registration failed.")})}catch{d({form:a==="ko"?"회원가입 중 오류가 발생했습니다.":"An error occurred during registration."})}finally{g(!1)}}};return f?s.jsx("div",{className:e.container,children:s.jsx("div",{className:e.main,children:s.jsxs("div",{className:e.successCard,children:[s.jsx("div",{className:e.successIcon,children:"✓"}),s.jsx("h2",{children:a==="ko"?"회원가입 완료!":"Registration Complete!"}),s.jsx("p",{children:a==="ko"?"잠시 후 로그인 페이지로 이동합니다...":"Redirecting to login page..."})]})})}):s.jsxs("div",{className:e.container,children:[s.jsxs("div",{className:e.header,children:[s.jsx(b,{to:"/",className:e.logoLink,children:s.jsx("img",{src:u==="light"?le:ie,alt:"D.Herald FLIP",className:e.logo})}),s.jsxs("div",{className:e.headerControls,children:[s.jsxs("div",{className:e.languageSelector,children:[s.jsx("button",{className:`${e.langBtn} ${a==="ko"?e.active:""}`,onClick:()=>p("ko"),children:"한국어"}),s.jsx("button",{className:`${e.langBtn} ${a==="en"?e.active:""}`,onClick:()=>p("en"),children:"English"})]}),s.jsx("button",{className:e.themeToggle,onClick:j,"aria-label":u==="light"?"Switch to dark mode":"Switch to light mode",children:u==="light"?"🌙":"☀️"})]})]}),s.jsx("main",{className:e.main,children:s.jsxs("div",{className:e.registerCard,children:[s.jsx("h1",{className:e.title,children:a==="ko"?"회원가입":"Register"}),s.jsx("p",{className:e.subtitle,children:a==="ko"?"Speaking Test 계정을 만드세요":"Create your Speaking Test account"}),s.jsxs("form",{onSubmit:C,className:e.form,children:[o.form&&s.jsx("div",{className:e.error,children:o.form}),s.jsxs("div",{className:e.inputGroup,children:[s.jsxs("label",{htmlFor:"member_id",className:e.label,children:[a==="ko"?"아이디":"ID"," *"]}),s.jsxs("div",{className:e.inputWithStatus,children:[s.jsx("input",{type:"text",id:"member_id",name:"member_id",value:t.member_id,onChange:i,className:`${e.input} ${o.member_id?e.inputError:""}`,placeholder:a==="ko"?"3자 이상 입력":"At least 3 characters",autoComplete:"username",disabled:l}),m==="checking"&&s.jsx("span",{className:e.statusChecking,children:a==="ko"?"확인 중...":"Checking..."}),m==="available"&&s.jsxs("span",{className:e.statusAvailable,children:["✓ ",a==="ko"?"사용 가능":"Available"]}),m==="taken"&&s.jsxs("span",{className:e.statusTaken,children:["✗ ",a==="ko"?"사용 불가":"Taken"]})]}),o.member_id&&s.jsx("span",{className:e.errorText,children:o.member_id})]}),s.jsxs("div",{className:e.inputGroup,children:[s.jsxs("label",{htmlFor:"member_name",className:e.label,children:[a==="ko"?"이름":"Name"," *"]}),s.jsx("input",{type:"text",id:"member_name",name:"member_name",value:t.member_name,onChange:i,className:`${e.input} ${o.member_name?e.inputError:""}`,placeholder:a==="ko"?"이름을 입력하세요":"Enter your name",disabled:l}),o.member_name&&s.jsx("span",{className:e.errorText,children:o.member_name})]}),s.jsxs("div",{className:e.inputGroup,children:[s.jsxs("label",{htmlFor:"password",className:e.label,children:[a==="ko"?"비밀번호":"Password"," *"]}),s.jsx("input",{type:"password",id:"password",name:"password",value:t.password,onChange:i,className:`${e.input} ${o.password?e.inputError:""}`,placeholder:a==="ko"?"6자 이상 입력":"At least 6 characters",autoComplete:"new-password",disabled:l}),o.password&&s.jsx("span",{className:e.errorText,children:o.password})]}),s.jsxs("div",{className:e.inputGroup,children:[s.jsxs("label",{htmlFor:"password_confirm",className:e.label,children:[a==="ko"?"비밀번호 확인":"Confirm Password"," *"]}),s.jsx("input",{type:"password",id:"password_confirm",name:"password_confirm",value:t.password_confirm,onChange:i,className:`${e.input} ${o.password_confirm?e.inputError:""}`,placeholder:a==="ko"?"비밀번호를 다시 입력하세요":"Enter password again",autoComplete:"new-password",disabled:l}),o.password_confirm&&s.jsx("span",{className:e.errorText,children:o.password_confirm})]}),s.jsxs("div",{className:e.inputGroup,children:[s.jsx("label",{htmlFor:"email",className:e.label,children:a==="ko"?"이메일":"Email"}),s.jsx("input",{type:"email",id:"email",name:"email",value:t.email,onChange:i,className:`${e.input} ${o.email?e.inputError:""}`,placeholder:a==="ko"?"이메일 주소 (선택)":"Email address (optional)",autoComplete:"email",disabled:l}),o.email&&s.jsx("span",{className:e.errorText,children:o.email})]}),s.jsxs("div",{className:e.inputGroup,children:[s.jsx("label",{htmlFor:"phone",className:e.label,children:a==="ko"?"전화번호":"Phone"}),s.jsx("input",{type:"tel",id:"phone",name:"phone",value:t.phone,onChange:i,className:e.input,placeholder:a==="ko"?"전화번호 (선택)":"Phone number (optional)",autoComplete:"tel",disabled:l})]}),s.jsx("button",{type:"submit",className:e.submitBtn,disabled:l||m==="taken",children:l?a==="ko"?"처리 중...":"Processing...":a==="ko"?"회원가입":"Register"})]}),s.jsx("div",{className:e.footer,children:s.jsxs("p",{className:e.loginLink,children:[a==="ko"?"이미 계정이 있으신가요?":"Already have an account?"," ",s.jsx(b,{to:"/login",children:a==="ko"?"로그인":"Login"})]})})]})})]})}export{me as RegisterPage};