https://myka.ng/assets/ProfilePage-IXtEVWmU.js

1import{j as e,r as h}from"./vendor-react-DfYGAhtm.js";import{m as o,g as w,aR as X,aT as Y,Y as K,J as Z,aU as ee,aV as ae,aW as oe,ax as W,av as ie}from"./index-DsBgCU7r.js";import{g as F}from"./errors-BYKXB8DF.js";import{ab as re,aQ as te,w as I,aR as B,v as ne,aS as le,r as se}from"./vendor-icons-1odZwi-b.js";import{a as j,T as b,F as O,v as C,I as ce,H as v,n as de,i as L,G as me,a8 as U,h as pe}from"./vendor-ui-DA_r9yXk.js";import"./vendor-state-BsBVN-fX.js";import"./vendor-forms-BP-7CbAP.js";const H="#2D3748",ue="#A0AEC0",xe=({label:a,icon:s,value:m,onChange:n,onSave:u,onCancel:x,isSubmitting:c=!1,error:r,placeholder:t,helperText:d,saveButtonText:p="Save",cancelButtonText:y="Cancel"})=>e.jsxs(j,{children:[e.jsx(b,{fontSize:"sm",fontWeight:"medium",color:H,mb:2,children:a}),e.jsxs(O,{align:"center",gap:3,minW:0,borderRadius:"lg",px:3,py:2.5,bg:"white",border:"1px solid",borderColor:r?"red.500":o.orange[300],_focusWithin:{borderColor:o.orange[500],boxShadow:`0 0 0 1px ${o.orange[500]}`},children:[e.jsx(C,{as:s,boxSize:4,color:ue,flexShrink:0}),e.jsx(ce,{value:m,onChange:l=>n(l.target.value),placeholder:t,disabled:c,border:"none",bg:"transparent",p:0,h:"auto",lineHeight:"1.5",_focusVisible:{boxShadow:"none",outline:"none"},fontSize:"sm",color:H,flex:1})]}),r&&e.jsx(b,{fontSize:"xs",color:"red.500",mt:1,children:r}),!r&&d&&e.jsx(b,{fontSize:"xs",color:o.text.info,mt:1,children:d}),e.jsxs(v,{gap:2,mt:2,justify:"flex-end",flexWrap:"wrap",children:[e.jsx(w,{buttonType:"ghost",text:y,borderRadius:"full",onClick:x,type:"button"}),e.jsx(w,{buttonType:"primary",text:p,borderRadius:"full",onClick:u,loading:c,type:"button"})]})]}),fe=({initial:a,imageSrc:s,onImageChange:m})=>{const n=h.useRef(null),u=()=>n.current?.click(),x=c=>{const r=c.target.files?.[0];if(!r)return;const t=URL.createObjectURL(r);m(r,t),c.target.value=""};return e.jsxs(j,{position:"relative",display:"inline-flex",flexShrink:0,children:[e.jsx(X,{initial:a,size:"2xl",...s?{imageSrc:s}:{}}),e.jsx(O,{position:"absolute",bottom:-1,right:1,w:6,h:6,align:"center",justify:"center",borderRadius:"full",bg:o.orange[500],cursor:"pointer",onClick:u,_hover:{bg:o.orange[600]},transition:"background 0.15s","aria-label":"Upload profile photo",children:e.jsx(C,{as:re,boxSize:4,color:"white"})}),e.jsx("input",{ref:n,type:"file",accept:"image/*",style:{display:"none"},onChange:x})]})},T="#2D3748",ge="#F7FAFC",V="#A0AEC0",A=({label:a,value:s,icon:m,onEdit:n})=>e.jsxs(j,{children:[e.jsx(v,{gap:.5,mb:2,align:"center",children:e.jsx(b,{fontSize:"sm",fontWeight:"medium",color:T,children:a})}),e.jsxs(O,{align:"center",gap:3,minW:0,borderRadius:"lg",px:3,py:3,bg:ge,border:"1px solid",borderColor:o.gray[200],children:[e.jsx(C,{as:m,boxSize:4,color:V,flexShrink:0}),e.jsx(b,{fontSize:"sm",color:s?T:V,flex:1,minW:0,wordBreak:"break-word",children:s||"N/A"}),n&&e.jsx(de,{"aria-label":"Edit field",size:"xs",variant:"ghost",color:o.orange[500],_hover:{bg:o.orange[50]},onClick:n,type:"button",children:e.jsx(te,{})})]})]}),he=({editingField:a,fieldValue:s,fieldError:m,isSubmitting:n,pendingEmail:u,fullName:x,email:c,phone:r,gender:t,onStartEdit:d,onFieldValueChange:p,onSave:y,onCancel:l})=>e.jsxs(e.Fragment,{children:[e.jsx(L,{as:"h2",fontSize:"lg",fontWeight:"semibold",color:o.text.primary,mb:4,children:"Personal Information"}),e.jsxs(me,{templateColumns:{base:"1fr",md:"repeat(2, 1fr)"},gap:4,children:[a==="email"||a==="emailOtp"?e.jsx(xe,{label:a==="emailOtp"?"Email Verification Code":"Email Address",icon:I,value:s,onChange:p,onSave:y,onCancel:l,isSubmitting:n,error:m,placeholder:a==="emailOtp"?"Enter 6-digit code":"Enter your email",...a==="emailOtp"?{helperText:`Enter the OTP sent to ${u}.`}:{},saveButtonText:a==="emailOtp"?"Verify Email":"Save",cancelButtonText:a==="emailOtp"?"Back":"Cancel"}):e.jsx(A,{label:"Email Address",value:c,icon:I,onEdit:()=>d("email")}),e.jsx(A,{label:"Full Name",value:x,icon:B}),e.jsx(A,{label:"Phone Number",value:r,icon:ne}),e.jsx(A,{label:"Gender",value:Y.find(S=>S.value===t)?.label??(t||"N/A"),icon:B})]})]}),be=({userInitial:a,displayName:s,email:m,kycApproved:n,avatarFile:u,isSubmitting:x=!1,avatarSrc:c,onAvatarChange:r,onSaveAvatar:t,onCancelAvatar:d})=>e.jsxs(O,{align:{base:"flex-start",md:"center"},justify:"space-between",direction:{base:"column",md:"row"},gap:4,mb:6,w:"100%",minW:0,children:[e.jsxs(v,{gap:4,align:"center",minW:0,maxW:"100%",children:[e.jsx(fe,{initial:a,...c?{imageSrc:c}:{},onImageChange:r}),e.jsxs(j,{minW:0,flex:1,children:[e.jsx(b,{fontSize:"lg",fontWeight:"semibold",color:o.text.primary,children:s}),e.jsx(b,{fontSize:"sm",color:"#718096",wordBreak:"break-word",children:m}),n?e.jsx(v,{gap:2,mt:2,children:e.jsxs(U,{borderRadius:"full",px:2.5,py:1,fontSize:"xs",display:"flex",alignItems:"center",gap:1.5,bg:o.success[50],color:o.success[500],border:"1px solid",borderColor:o.success[500],fontWeight:"medium",children:[e.jsx(C,{as:le,boxSize:3.5}),"Verified"]})}):e.jsx(v,{gap:2,mt:2,children:e.jsxs(U,{borderRadius:"full",px:2.5,py:1,fontSize:"xs",display:"flex",alignItems:"center",gap:1.5,bg:o.warning[50],color:o.warning[500],border:"1px solid",borderColor:o.warning[500],fontWeight:"medium",children:[e.jsx(C,{as:se,boxSize:3.5}),"Not Verified"]})})]})]}),u&&e.jsxs(v,{gap:2,w:{base:"full",md:"auto"},justify:{base:"flex-start",md:"flex-end"},flexShrink:0,children:[e.jsx(w,{buttonType:"ghost",text:"Cancel",size:"sm",borderRadius:"full",onClick:d,type:"button"}),e.jsx(w,{buttonType:"primary",text:"Save Photo",size:"sm",borderRadius:"full",onClick:t,loading:x,type:"button"})]})]}),Ae=()=>{const a=K(),{displayName:s,userInitial:m}=Z(),{updateProfileAsync:n,isUpdating:u}=ee(),{verifyEmailOtpAsync:x,isVerifyingOtp:c}=ae(),[r,t]=h.useState(null),[d,p]=h.useState(""),[y,l]=h.useState(void 0),[S,E]=h.useState(""),[P,z]=h.useState(null),[_,R]=h.useState(void 0),N=_??a?.profileImageUrl??void 0,g=h.useMemo(()=>{const i=a?.kyc,f=i?[i.firstName,i.middleName,i.lastName].filter(

1Boolean).join(" ").trim():"",k=(i?.gender??"").toLowerCase();return{email:a?.email??"",phone:a?.phoneNumber??"",fullName:f,gender:k}},[a]),D=i=>{t(i),p(g[i]),l(void 0)},G=()=>{if(r==="emailOtp"){t("email"),p(S),l(void 0);return}t(null),p(""),E(""),l(void 0)},$=async()=>{if(r==="email"){const i=oe(d);if(i){l(i);return}const f=W(d);if(f===W(g.email)){t(null),p(""),E(""),l(void 0);return}const k=new FormData;k.append("email",f);try{await n(k),E(f),t("emailOtp"),p(""),l(void 0)}catch(Q){l(F(Q)??"Could not request email verification code. Please try again.")}return}if(r==="emailOtp"){const i=ie(d);if(i){l(i);return}try{await x({otp:d.trim()}),t(null),p(""),E(""),l(void 0)}catch(f){l(F(f)??"Verification failed. Please check the code and try again.")}}},M=(i,f)=>{z(i),R(f)},q=async()=>{if(!P)return;const i=new FormData;i.append("profileImage",P);try{await n(i),z(null),R(void 0)}catch{}},J=()=>{z(null),R(void 0)};return e.jsx(j,{minH:"100%",children:e.jsxs(pe,{gap:6,children:[e.jsxs(j,{children:[e.jsx(L,{fontSize:{base:"2xl",md:"28px"},fontWeight:"bold",color:o.text.label,children:"Profile"}),e.jsx(b,{fontSize:"md",color:o.text.info,mt:1,children:"Manage your personal information and account details"})]}),e.jsxs(j,{background:`linear-gradient(145deg, white 55%, ${o.orange[50]} 100%)`,borderRadius:"2xl",border:"1px solid",borderColor:o.border.secondary,p:{base:4,sm:6,md:8},children:[e.jsx(be,{userInitial:m,displayName:s,email:g.email||g.phone,kycApproved:a?.kycApproved??!1,avatarFile:P,isSubmitting:u,...N?{avatarSrc:N}:{},onAvatarChange:M,onSaveAvatar:q,onCancelAvatar:J}),e.jsx(he,{editingField:r,fieldValue:d,fieldError:y,isSubmitting:u||c,pendingEmail:S,email:g.email,fullName:g.fullName,phone:g.phone,gender:g.gender,onStartEdit:D,onFieldValueChange:p,onSave:$,onCancel:G})]})]})})};export{Ae as default};