203cb5d5e5
- DESIGN_TOKENS.md: Complete rewrite to document --sumi-* token system - APP_SHELL.md: Update layout shell docs (glass bg, backdrop-blur, z-index) - DESIGN_DIRECTION.md: Update aesthetic direction to SUMI philosophy - .storybook/preview.tsx: Remove deleted CSS imports, update bg colors - eslint.config.js: Update color rule message from Kodo to SUMI tokens - tailwind.config.ts: Fix comment referencing deleted design-tokens.css Co-authored-by: Cursor <cursoragent@cursor.com>
3 lines
36 KiB
JavaScript
3 lines
36 KiB
JavaScript
import{a as n,j as e}from"./vendor-react-Dkpvlwai.js";import{d as ue,h as ke,g as Se,p as J,a as I,E as Q,C as z,b as W,c as $,f as X,e as H,B as N,D as _e,n as me,o as re,u as Ae,L as Ee,S as b,t as ne}from"./index-jE2AGx2y.js";import{u as oe}from"./users-_nyTUiUz.js";import{T as Te,a as De,b as O,c as B}from"./Tabs-DcqFJUlH.js";import{L as h,I as E}from"./input-CpxrTzwP.js";import{S as ee}from"./Select-Zbef75Fw.js";import{am as Fe,au as Re,a as he,an as se,T as le,av as Pe,aw as Le,ax as xe,L as ae,C as fe,A as qe,e as Ie,P as pe,ay as Ve,az as Ue,aA as ze,aB as Me}from"./vendor-icons-CbmLcMl-.js";import{C as w}from"./checkbox-zOPO199O.js";import{A as ge,a as je}from"./alert-DvTTzGyG.js";import{r as Y}from"./features-DIZYat5y.js";import{o as G,e as ie,s as Oe,b as v}from"./vendor-utils-CDFfoeXY.js";import"./vendor-CAoAb3tF.js";import"./vendor-router-4bycex72.js";import"./vendor-tanstack-BoI3DtL9.js";import"./dropdown-WuZUrg5z.js";const ve=n.forwardRef(({className:s,value:a,onValueChange:t,disabled:r,children:i,...c},d)=>{const o=[];n.Children.forEach(i,l=>{n.isValidElement(l)&&l.type===U&&!l.props.disabled&&o.push(l.props.value)});const x=l=>{if(o.length===0)return;const m=a?o.indexOf(a):-1;let u;switch(l.key){case"ArrowDown":case"ArrowRight":u=m===-1?0:(m+1)%o.length;break;case"ArrowUp":case"ArrowLeft":u=m===-1?o.length-1:(m-1+o.length)%o.length;break;default:return}l.preventDefault(),t?.(o[u]),l.currentTarget.querySelectorAll('input[type="radio"]')[u]?.focus()};return e.jsx("div",{ref:d,className:ue("grid gap-2",s),role:"radiogroup",onKeyDown:x,...c,children:n.Children.map(i,l=>{if(n.isValidElement(l)&&l.type===U){const m=l.props.value===a,u=l.props.value===o[0];return n.cloneElement(l,{checked:m,onCheckedChange:()=>t?.(l.props.value),disabled:r||l.props.disabled,tabIndex:m||a===void 0&&u?0:-1})}return l})})});ve.displayName="RadioGroup";const U=n.forwardRef(({className:s,value:a,checked:t,onCheckedChange:r,disabled:i,tabIndex:c,...d},o)=>e.jsxs("label",{role:"radio","aria-checked":!!t,className:ue("aspect-square h-4 w-4 rounded-full border border-border text-muted-foreground","ring-offset-background focus-within:outline-none focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2","disabled:cursor-not-allowed disabled:opacity-50","cursor-pointer relative inline-flex items-center justify-center",t&&"border-primary text-primary",s),children:[e.jsx("input",{ref:o,type:"radio",value:a,checked:t,onChange:r,disabled:i,tabIndex:c,className:"sr-only",...d}),t&&e.jsx(Fe,{className:"h-2.5 w-2.5 fill-current text-current"})]}));U.displayName="RadioGroupItem";const Be=[{value:"en",label:"English"},{value:"fr",label:"Français"},{value:"es",label:"Español"},{value:"de",label:"Deutsch"},{value:"it",label:"Italiano"},{value:"pt",label:"Português"},{value:"ru",label:"Русский"},{value:"ja",label:"日本語"},{value:"zh",label:"中文"},{value:"ko",label:"한국어"}],Ge=[{value:"UTC",label:"UTC"},{value:"Europe/Paris",label:"Europe/Paris"},{value:"America/New_York",label:"America/New_York"},{value:"America/Los_Angeles",label:"America/Los_Angeles"},{value:"Asia/Tokyo",label:"Asia/Tokyo"},{value:"Asia/Shanghai",label:"Asia/Shanghai"}];function He({preferences:s,onChange:a}){const t=c=>{a({...s,language:Array.isArray(c)?c[0]:c})},r=c=>{a({...s,timezone:Array.isArray(c)?c[0]:c})},i=c=>{a({...s,theme:c})};return e.jsx("div",{className:"space-y-6",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(h,{htmlFor:"language",children:"Langue"}),e.jsx(ee,{options:Be,value:s.language,onChange:t,placeholder:"Sélectionner une langue",name:"language"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(h,{htmlFor:"timezone",children:"Fuseau horaire"}),e.jsx(ee,{options:Ge,value:s.timezone,onChange:r,placeholder:"Sélectionner un fuseau horaire",name:"timezone"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(h,{children:"Thème"}),e.jsxs(ve,{value:s.theme,onValueChange:i,children:[e.jsxs("div",{className:"flex items-center space-x-2",children:[e.jsx(U,{value:"light",id:"theme-light"}),e.jsx(h,{htmlFor:"theme-light",className:"font-normal",children:"Clair"})]}),e.jsxs("div",{className:"flex items-center space-x-2",children:[e.jsx(U,{value:"dark",id:"theme-dark"}),e.jsx(h,{htmlFor:"theme-dark",className:"font-normal",children:"Sombre"})]}),e.jsxs("div",{className:"flex items-center space-x-2",children:[e.jsx(U,{value:"auto",id:"theme-auto"}),e.jsx(h,{htmlFor:"theme-auto",className:"font-normal",children:"Automatique"})]})]})]})]})})}function Ke({notifications:s,onChange:a}){const t=(r,i)=>{a({...s,[r]:i})};return e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-lg font-semibold mb-4",children:"Notifications par email"}),e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(h,{htmlFor:"email_notifications",children:"Notifications email"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Recevoir des notifications par email"})]}),e.jsx(w,{id:"email_notifications",checked:s.email_notifications,onCheckedChange:r=>t("email_notifications",r===!0)})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(h,{htmlFor:"push_notifications",children:"Notifications push"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Recevoir des notifications push"})]}),e.jsx(w,{id:"push_notifications",checked:s.push_notifications,onCheckedChange:r=>t("push_notifications",r===!0)})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(h,{htmlFor:"browser_notifications",children:"Notifications navigateur"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Recevoir des notifications dans le navigateur"})]}),e.jsx(w,{id:"browser_notifications",checked:s.browser_notifications,onCheckedChange:r=>t("browser_notifications",r===!0)})]})]})]}),e.jsxs("div",{children:[e.jsx("h3",{className:"text-lg font-semibold mb-4",children:"Notifications d'activité"}),e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(h,{htmlFor:"email_on_follow",children:"Email lors d'un follow"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Recevoir un email quand quelqu'un vous suit"})]}),e.jsx(w,{id:"email_on_follow",checked:s.email_on_follow,onCheckedChange:r=>t("email_on_follow",r===!0)})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(h,{htmlFor:"email_on_like",children:"Email lors d'un like"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Recevoir un email quand quelqu'un aime votre contenu"})]}),e.jsx(w,{id:"email_on_like",checked:s.email_on_like,onCheckedChange:r=>t("email_on_like",r===!0)})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(h,{htmlFor:"email_on_comment",children:"Email lors d'un commentaire"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Recevoir un email quand quelqu'un commente votre contenu"})]}),e.jsx(w,{id:"email_on_comment",checked:s.email_on_comment,onCheckedChange:r=>t("email_on_comment",r===!0)})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(h,{htmlFor:"email_on_message",children:"Email lors d'un message"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Recevoir un email quand vous recevez un message"})]}),e.jsx(w,{id:"email_on_message",checked:s.email_on_message,onCheckedChange:r=>t("email_on_message",r===!0)})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(h,{htmlFor:"email_on_mention",children:"Email lors d'une mention"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Recevoir un email quand quelqu'un vous mentionne"})]}),e.jsx(w,{id:"email_on_mention",checked:s.email_on_mention,onCheckedChange:r=>t("email_on_mention",r===!0)})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(h,{htmlFor:"email_marketing",children:"Email marketing"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Recevoir des emails promotionnels et des actualités"})]}),e.jsx(w,{id:"email_marketing",checked:s.email_marketing,onCheckedChange:r=>t("email_marketing",r===!0)})]})]})]})]})}function Ye({privacy:s,onChange:a}){const t=(r,i)=>{a({...s,[r]:i})};return e.jsx("div",{className:"space-y-6",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(h,{htmlFor:"allow_search_indexing",children:"Autoriser l'indexation par les moteurs de recherche"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Permettre aux moteurs de recherche d'indexer votre profil"})]}),e.jsx(w,{id:"allow_search_indexing",checked:s.allow_search_indexing,onCheckedChange:r=>t("allow_search_indexing",r===!0)})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(h,{htmlFor:"show_activity",children:"Afficher l'activité"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Permettre aux autres utilisateurs de voir votre activité"})]}),e.jsx(w,{id:"show_activity",checked:s.show_activity,onCheckedChange:r=>t("show_activity",r===!0)})]})]})})}const ce=3;function Qe(){const{logout:s}=ke(),a=Se(),[t,r]=n.useState(!1),[i,c]=n.useState(!1),[d,o]=n.useState(!1),[x,l]=n.useState(""),[m,u]=n.useState(""),[p,g]=n.useState(""),[y,j]=n.useState(""),[_,P]=n.useState(""),[C,L]=n.useState(""),[k,f]=n.useState(""),[T,S]=n.useState(null),[Z,A]=n.useState(null),[M,K]=n.useState(0),q=n.useRef(null),ye=n.useCallback(async D=>{if(D.preventDefault(),j(""),m!==p){j("New passwords do not match");return}if(m.length<12){j("Password must be at least 12 characters long");return}const F=async()=>{await I.put("/users/me/password",{current_password:x,new_password:m}),a.success("Password changed successfully"),l(""),u(""),g(""),A(null),K(0),q.current=null};q.current=F,r(!0);try{await F()}catch(V){const R=J(V);j(R.message),A(new Error(R.message))}finally{r(!1)}},[x,m,p,a]),be=n.useCallback(async()=>{if(S(null),A(null),k!=="DELETE"){S("Please type DELETE to confirm");return}try{c(!0),await I.delete("/users/me",{data:{password:_,reason:C,confirm_text:k}}),a.success("Account deletion requested. You will be logged out."),setTimeout(()=>{s(),window.location.href="/login"},2e3)}catch(D){const F=J(D);A(new Error(F.message))}finally{c(!1),o(!1)}},[_,C,k,a,s]),we=n.useCallback(async()=>{const D=async()=>{const F=await I.get("/users/me/export",{responseType:"blob"}),V=window.URL.createObjectURL(new Blob([F.data])),R=document.createElement("a");R.href=V,R.setAttribute("download",`veza-data-export-${new Date().toISOString()}.json`),document.body.appendChild(R),R.click(),R.remove(),window.URL.revokeObjectURL(V),a.success("Data export started"),A(null),K(0),q.current=null};q.current=D;try{await D()}catch(F){const V=J(F);A(new Error(V.message))}},[a]),Ne=n.useCallback(async()=>{if(!(!q.current||M>=ce)){K(D=>D+1);try{await q.current()}catch{}}},[M]),Ce=n.useCallback(()=>{A(null),K(0),q.current=null},[]);return{mutationError:Z,retryCount:M,maxRetry:ce,handleRetry:Ne,dismissError:Ce,isChangingPassword:t,currentPassword:x,setCurrentPassword:l,newPassword:m,setNewPassword:u,confirmPassword:p,setConfirmPassword:g,passwordError:y,handleChangePassword:ye,isDeleteDialogOpen:d,setIsDeleteDialogOpen:o,isDeletingAccount:i,deletePassword:_,setDeletePassword:P,deleteReason:C,setDeleteReason:L,deleteConfirmText:k,setDeleteConfirmText:f,deleteValidationError:T,setDeleteValidationError:S,handleDeleteAccount:be,handleExportData:we}}function We({error:s,retryCount:a,maxRetry:t,onRetry:r,onDismiss:i}){return e.jsx(Q,{error:s,variant:"banner",severity:"error",context:{action:"updating account settings",resource:"account"},onRetry:a<t?r:void 0,onDismiss:i})}function $e({currentPassword:s,setCurrentPassword:a,newPassword:t,setNewPassword:r,confirmPassword:i,setConfirmPassword:c,passwordError:d,isChangingPassword:o,onSubmit:x}){return e.jsxs(z,{children:[e.jsxs(W,{children:[e.jsxs($,{className:"flex items-center gap-2",children:[e.jsx(Re,{className:"h-5 w-5"}),"Change Password"]}),e.jsx(X,{children:"Update your password to keep your account secure"})]}),e.jsx(H,{children:e.jsxs("form",{onSubmit:x,className:"space-y-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(h,{htmlFor:"current-password",children:"Current Password"}),e.jsx(E,{id:"current-password",type:"password",value:s,onChange:l=>a(l.target.value),required:!0})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(h,{htmlFor:"new-password",children:"New Password"}),e.jsx(E,{id:"new-password",type:"password",value:t,onChange:l=>r(l.target.value),required:!0,minLength:12}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Password must be at least 12 characters long"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(h,{htmlFor:"confirm-password",children:"Confirm New Password"}),e.jsx(E,{id:"confirm-password",type:"password",value:i,onChange:l=>c(l.target.value),required:!0,minLength:12})]}),d&&e.jsxs(ge,{variant:"destructive",children:[e.jsx(he,{className:"h-4 w-4"}),e.jsx(je,{children:d})]}),e.jsx(N,{type:"submit",disabled:o,children:o?"Changing...":"Change Password"})]})})]})}function Xe({onExport:s}){return e.jsxs(z,{children:[e.jsxs(W,{children:[e.jsxs($,{className:"flex items-center gap-2",children:[e.jsx(se,{className:"h-5 w-5"}),"Data Export"]}),e.jsx(X,{children:"Download a copy of your data (GDPR)"})]}),e.jsx(H,{children:e.jsxs(N,{variant:"outline",onClick:s,children:[e.jsx(se,{className:"mr-2 h-4 w-4"}),"Export My Data"]})})]})}function Ze({isDeleteDialogOpen:s,setIsDeleteDialogOpen:a,isDeletingAccount:t,deletePassword:r,setDeletePassword:i,deleteReason:c,setDeleteReason:d,deleteConfirmText:o,setDeleteConfirmText:x,deleteValidationError:l,setDeleteValidationError:m,onDeleteAccount:u}){return e.jsxs(z,{className:"border-destructive",children:[e.jsxs(W,{children:[e.jsxs($,{className:"flex items-center gap-2 text-destructive",children:[e.jsx(le,{className:"h-5 w-5"}),"Delete Account"]}),e.jsx(X,{children:"Permanently delete your account and all associated data"})]}),e.jsxs(H,{children:[e.jsxs(ge,{variant:"destructive",children:[e.jsx(he,{className:"h-4 w-4"}),e.jsx(je,{children:"This action cannot be undone. All your data will be permanently deleted."})]}),e.jsx(_e,{open:s,onClose:()=>a(!1),title:"Are you absolutely sure?",variant:"alert",onConfirm:u,confirmLabel:t?"Deleting...":"Delete Account",cancelLabel:"Cancel",size:"lg",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx("p",{className:"text-sm text-muted-foreground",children:"This will permanently delete your account and all associated data. This action cannot be undone."}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(h,{htmlFor:"delete-password",children:"Enter your password"}),e.jsx(E,{id:"delete-password",type:"password",value:r,onChange:p=>i(p.target.value),required:!0})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(h,{htmlFor:"delete-reason",children:"Reason (optional)"}),e.jsx(E,{id:"delete-reason",value:c,onChange:p=>d(p.target.value),placeholder:"Why are you deleting your account?"})]}),l&&e.jsx(Q,{error:l,variant:"inline",severity:"error",size:"sm",dismissible:!1}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs(h,{htmlFor:"delete-confirm",children:["Type ",e.jsx("strong",{children:"DELETE"})," to confirm"]}),e.jsx(E,{id:"delete-confirm",value:o,onChange:p=>{x(p.target.value),m(null)},required:!0,placeholder:"DELETE"})]})]})}),e.jsxs(N,{variant:"destructive",className:"mt-4",onClick:()=>a(!0),children:[e.jsx(le,{className:"mr-2 h-4 w-4"}),"Delete Account"]})]})]})}class Je{async getStatus(){return Y("TWO_FACTOR_AUTH"),(await I.get("/auth/2fa/status")).data}async setup(){return Y("TWO_FACTOR_AUTH"),(await I.post("/auth/2fa/setup")).data}async verify(a,t){Y("TWO_FACTOR_AUTH"),await I.post("/auth/2fa/verify",{secret:a,code:t})}async disable(a){Y("TWO_FACTOR_AUTH"),await I.post("/auth/2fa/disable",{password:a})}}const te=new Je;function es({onBack:s}){return e.jsxs("div",{className:"mb-6 flex items-center gap-4",children:[e.jsx("button",{type:"button",onClick:s,className:"p-2 hover:bg-muted rounded-full text-muted-foreground hover:text-foreground transition-colors duration-[var(--sumi-duration-normal)]","aria-label":"Go back",children:e.jsx(Pe,{className:"w-5 h-5"})}),e.jsxs("div",{children:[e.jsx("h2",{className:"text-2xl font-bold text-foreground tracking-tight",children:"Enable Two-Factor Authentication"}),e.jsx("p",{className:"text-muted-foreground text-sm",children:"Protect your account with an extra layer of security."})]})]})}function ss({onChooseTotp:s,onChooseSms:a}){return e.jsxs("div",{className:"grid gap-4",children:[e.jsx("div",{role:"button",tabIndex:0,onClick:s,onKeyDown:t=>t.key==="Enter"&&s(),className:"p-6 border border-border rounded-xl bg-card hover:bg-muted/50 cursor-pointer transition-all duration-[var(--sumi-duration-normal)] hover:border-primary/50 group focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",children:e.jsxs("div",{className:"flex items-center gap-4 mb-2",children:[e.jsx("div",{className:"w-12 h-12 rounded-full bg-muted flex items-center justify-center group-hover:bg-muted/80",children:e.jsx(Le,{className:"w-6 h-6 text-muted-foreground"})}),e.jsxs("div",{children:[e.jsx("h3",{className:"text-lg font-bold text-foreground group-hover:text-foreground tracking-tight",children:"Authenticator App"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Use Google Authenticator, Authy, or 1Password. (Recommended)"})]})]})}),e.jsx("div",{role:"button",tabIndex:0,onClick:a,onKeyDown:t=>t.key==="Enter"&&a(),className:"p-6 border border-border rounded-xl bg-card opacity-50 cursor-not-allowed transition-all duration-[var(--sumi-duration-normal)] grayscale group focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",children:e.jsxs("div",{className:"flex items-center gap-4 mb-2",children:[e.jsx("div",{className:"w-12 h-12 rounded-full bg-warning/10 flex items-center justify-center",children:e.jsx(xe,{className:"w-6 h-6 text-warning"})}),e.jsxs("div",{children:[e.jsx("h3",{className:"text-lg font-bold text-foreground tracking-tight",children:"SMS / Text Message"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Receive a code via text message to your phone."})]})]})})]})}function as({method:s,loading:a,setupData:t,verificationCode:r,onVerificationCodeChange:i,onVerify:c,onCopySecret:d,onSendSmsPlaceholder:o}){const x=r.replace(/\D/g,"").slice(0,6);return s==="sms"?e.jsxs("div",{className:"bg-card p-8 rounded-xl border border-border text-center",children:[e.jsx(xe,{className:"w-16 h-16 text-warning mx-auto mb-4"}),e.jsx("h3",{className:"text-xl font-bold text-foreground mb-2 tracking-tight",children:"SMS Setup"}),e.jsx("p",{className:"text-muted-foreground mb-6",children:"Enter your phone number to receive a verification code."}),e.jsxs("div",{className:"flex gap-2 max-w-sm mx-auto",children:[e.jsx(E,{placeholder:"+1 (555) 000-0000"}),e.jsx(N,{variant:"primary",onClick:o,children:"SEND"})]}),e.jsxs("div",{className:"mt-8 border-t border-border pt-6 text-left",children:[e.jsx("h4",{className:"font-bold text-foreground mb-4 tracking-tight",children:"Enter Verification Code"}),e.jsxs("div",{className:"flex gap-4",children:[e.jsx(E,{placeholder:"000000",value:r,onChange:l=>i(l.target.value.replace(/\D/g,"").slice(0,6)),className:"font-mono text-center tracking-widest text-lg"}),e.jsx(N,{variant:"primary",onClick:c,disabled:x.length!==6,children:"VERIFY"})]})]})]}):e.jsxs("div",{className:"space-y-8 bg-card p-8 rounded-xl border border-border",children:[e.jsx("div",{className:"text-center",children:a&&!t?e.jsx("div",{className:"w-48 h-48 mx-auto flex items-center justify-center",children:e.jsx(ae,{className:"w-10 h-10 text-primary animate-spin"})}):e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"bg-card p-4 inline-block rounded-xl mb-4 shadow-glow-cyan/20",children:e.jsx("img",{src:t?.qr_code_url,alt:"QR Code",className:"w-48 h-48"})}),e.jsx("p",{className:"text-sm text-foreground mb-2",children:"Scan this QR code with your authenticator app."}),e.jsxs("p",{role:"button",tabIndex:0,className:"text-xs text-muted-foreground font-mono bg-muted py-1 px-3 rounded-full border border-border inline-block cursor-pointer hover:text-foreground transition-colors duration-[var(--sumi-duration-normal)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",onClick:d,onKeyDown:l=>l.key==="Enter"&&d(),children:["KEY: ",t?.secret]})]})}),e.jsxs("div",{className:"border-t border-border pt-6",children:[e.jsxs("h4",{className:"font-bold text-foreground mb-4 flex items-center gap-2 tracking-tight",children:[e.jsx(fe,{className:"w-4 h-4 text-primary"})," Verify Configuration"]}),e.jsxs("div",{className:"flex gap-4",children:[e.jsx(E,{placeholder:"Enter 6-digit code",value:r,onChange:l=>i(l.target.value.replace(/\D/g,"").slice(0,6)),className:"font-mono text-center tracking-[0.5em] text-lg border-primary/20 focus:border-primary"}),e.jsx(N,{variant:"primary",onClick:c,disabled:x.length!==6||a,className:"shadow-glow-cyan",children:a?e.jsx(ae,{className:"w-4 h-4 animate-spin"}):"VERIFY"})]})]})]})}function ts({setupData:s,onCopy:a,onDownload:t,onComplete:r}){return e.jsxs("div",{className:"space-y-6 bg-card p-8 rounded-xl border border-border shadow-2xl",children:[e.jsxs("div",{className:"flex items-center gap-4 text-success mb-2",children:[e.jsx(fe,{className:"w-8 h-8"}),e.jsx("h3",{className:"text-xl font-bold",children:"2FA Enabled Successfully"})]}),e.jsxs("div",{className:"bg-orange-500/10 border border-orange-500/30 p-4 rounded-lg flex gap-4",children:[e.jsx(qe,{className:"w-6 h-6 text-orange-500 flex-shrink-0"}),e.jsxs("div",{children:[e.jsx("h4",{className:"font-bold text-orange-500 text-sm mb-1",children:"Save these backup codes"}),e.jsx("p",{className:"text-xs text-foreground leading-relaxed",children:"If you lose your device, these codes are the only way to access your account. Store them in a password manager."})]})]}),e.jsx("div",{className:"grid grid-cols-2 gap-3 bg-muted/50 p-6 rounded-xl font-mono text-sm text-foreground text-center border border-border group",children:s?.recovery_codes.map(i=>e.jsx("div",{className:"py-2 tracking-widest border border-transparent hover:border-white/10 rounded transition-colors bg-white/2",children:i},i))}),e.jsxs("div",{className:"flex gap-4 pt-2",children:[e.jsx(N,{variant:"secondary",className:"flex-1",icon:e.jsx(Ie,{className:"w-4 h-4"}),onClick:a,children:"Copy"}),e.jsx(N,{variant:"secondary",className:"flex-1",icon:e.jsx(se,{className:"w-4 h-4"}),onClick:t,children:"Download"}),e.jsx(N,{variant:"primary",className:"flex-1 shadow-glow-cyan",onClick:r,children:"Complete"})]})]})}function rs(s,a){const{addToast:t}=me(),[r,i]=n.useState(1),[c,d]=n.useState("totp"),[o,x]=n.useState(""),[l,m]=n.useState(!1),[u,p]=n.useState(null),[g,y]=n.useState(null),j=n.useCallback(async()=>{m(!0),y(null);try{const f=await te.setup();p(f)}catch{t("Failed to initialize 2FA setup","error"),y("Failed to initialize 2FA setup"),s()}finally{m(!1)}},[t,s]);n.useEffect(()=>{r===2&&c==="totp"&&!u&&!g&&j()},[r,c,u,g,j]);const _=n.useCallback(async()=>{if(o.length<6||!u){t("Invalid code","error");return}m(!0),y(null);try{await te.verify(u.secret,o),i(3),t("2FA Verified Successfully","success")}catch{t("Verification failed. Please check the code.","error"),y("Verification failed")}finally{m(!1)}},[o,u,t]),P=n.useCallback(()=>{u?.recovery_codes&&(navigator.clipboard.writeText(u.recovery_codes.join(`
|
|
`)),t("Backup codes copied to clipboard"))},[u,t]),C=n.useCallback(()=>{if(!u?.recovery_codes)return;const f=document.createElement("a"),T=new Blob([u.recovery_codes.join(`
|
|
`)],{type:"text/plain"});f.href=URL.createObjectURL(T),f.download="veza-backup-codes.txt",document.body.appendChild(f),f.click(),t("Backup codes downloaded")},[u,t]),L=n.useCallback(()=>{d("totp"),i(2)},[]),k=n.useCallback(()=>{t("SMS method not yet available in this region","info")},[t]);return{step:r,setStep:i,method:c,verificationCode:o,setVerificationCode:x,loading:l,setupData:u,error:g,fetchSetupData:j,handleVerify:_,copyCodes:P,downloadCodes:C,goToStep2Totp:L,handleSmsUnavailable:k}}function ns({onBack:s,onComplete:a}){const{addToast:t}=me(),{step:r,method:i,verificationCode:c,setVerificationCode:d,loading:o,setupData:x,handleVerify:l,copyCodes:m,downloadCodes:u,goToStep2Totp:p,handleSmsUnavailable:g}=rs(s),y=()=>{x&&(navigator.clipboard.writeText(x.secret),t("Secret Key copied"))};return e.jsxs("div",{className:"animate-fadeIn max-w-2xl mx-auto",children:[e.jsx(es,{onBack:s}),r===1&&e.jsx(ss,{onChooseTotp:p,onChooseSms:g}),r===2&&e.jsx(as,{method:i,loading:o,setupData:x,verificationCode:c,onVerificationCodeChange:d,onVerify:l,onCopySecret:y,onSendSmsPlaceholder:()=>t("Code sent to your phone","info")}),r===3&&e.jsx(ts,{setupData:x,onCopy:m,onDownload:u,onComplete:a})]})}const os=()=>{const[s,a]=n.useState(null),[t,r]=n.useState(!0),[i,c]=n.useState(!1),d=async()=>{r(!0);try{const o=await te.getStatus();a(o.enabled)}catch(o){console.error("Failed to fetch 2FA status",o)}finally{r(!1)}};return n.useEffect(()=>{d()},[]),i?e.jsx(z,{className:"border-primary/20 bg-primary/5",children:e.jsx(H,{className:"pt-6",children:e.jsx(ns,{onBack:()=>c(!1),onComplete:()=>{c(!1),d()}})})}):e.jsxs(z,{children:[e.jsxs(W,{children:[e.jsxs($,{className:"flex items-center gap-2",children:[e.jsx(pe,{className:"h-5 w-5"}),"Two-Factor Authentication (2FA)"]}),e.jsx(X,{children:"Add an extra layer of security to your account"})]}),e.jsx(H,{children:t?e.jsxs("div",{className:"flex items-center gap-2 text-muted-foreground text-sm",children:[e.jsx(ae,{className:"h-4 w-4 animate-spin"})," Checking 2FA status..."]}):s?e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3 p-4 bg-success/10 border border-success/20 rounded-lg",children:[e.jsx(Ve,{className:"h-8 w-8 text-success"}),e.jsxs("div",{children:[e.jsx("h4",{className:"font-bold text-foreground",children:"2FA is enabled"}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Your account is protected by an additional security layer."})]})]}),e.jsx(N,{variant:"outline",className:"text-destructive hover:bg-destructive/10 hover:text-destructive border-destructive/20",onClick:()=>{confirm("Are you sure you want to disable 2FA? This will make your account less secure.")&&a(!1)},children:"Disable 2FA"})]}):e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3 p-4 bg-orange-500/5 border border-orange-500/10 rounded-lg",children:[e.jsx(Ue,{className:"h-8 w-8 text-orange-500"}),e.jsxs("div",{children:[e.jsx("h4",{className:"font-bold text-foreground",children:"2FA is not enabled"}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"We highly recommend enabling 2FA to protect your music and assets."})]})]}),e.jsx(N,{onClick:()=>c(!0),children:"Setup 2FA"})]})})]})};function ls(){const{mutationError:s,retryCount:a,maxRetry:t,handleRetry:r,dismissError:i,isChangingPassword:c,currentPassword:d,setCurrentPassword:o,newPassword:x,setNewPassword:l,confirmPassword:m,setConfirmPassword:u,passwordError:p,handleChangePassword:g,isDeleteDialogOpen:y,setIsDeleteDialogOpen:j,isDeletingAccount:_,deletePassword:P,setDeletePassword:C,deleteReason:L,setDeleteReason:k,deleteConfirmText:f,setDeleteConfirmText:T,deleteValidationError:S,setDeleteValidationError:Z,handleDeleteAccount:A,handleExportData:M}=Qe();return e.jsxs("div",{className:"space-y-6",children:[s&&e.jsx(We,{error:s,retryCount:a,maxRetry:t,onRetry:r,onDismiss:i}),e.jsx($e,{currentPassword:d,setCurrentPassword:o,newPassword:x,setNewPassword:l,confirmPassword:m,setConfirmPassword:u,passwordError:p,isChangingPassword:c,onSubmit:g}),e.jsx(os,{}),e.jsx(Xe,{onExport:M}),e.jsx(Ze,{isDeleteDialogOpen:y,setIsDeleteDialogOpen:j,isDeletingAccount:_,deletePassword:P,setDeletePassword:C,deleteReason:L,setDeleteReason:k,deleteConfirmText:f,setDeleteConfirmText:T,deleteValidationError:S,setDeleteValidationError:Z,onDeleteAccount:A})]})}const is=[{value:"low",label:"Low (64 kbps)"},{value:"medium",label:"Medium (128 kbps)"},{value:"high",label:"High (256 kbps)"},{value:"lossless",label:"Lossless (FLAC)"}];function cs({playback:s,onChange:a}){const t=d=>{const o=Array.isArray(d)?d[0]:d;a({...s,quality:o})},r=d=>{a({...s,volume:d[0]})},i=d=>{a({...s,crossfade:d[0]})},c=d=>{a({...s,autoplay:d})};return e.jsx("div",{className:"space-y-6",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(h,{htmlFor:"quality",children:"Audio Quality"}),e.jsx(ee,{options:is,value:s.quality,onChange:t,placeholder:"Select audio quality",name:"quality"}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Higher quality uses more bandwidth"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs(h,{htmlFor:"volume",children:["Default Volume: ",Math.round(s.volume*100),"%"]}),e.jsx(re,{id:"volume",min:0,max:1,step:.01,value:[s.volume],onValueChange:r,className:"w-full"}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Default volume when starting playback"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs(h,{htmlFor:"crossfade",children:["Crossfade: ",s.crossfade,"s"]}),e.jsx(re,{id:"crossfade",min:0,max:12,step:1,value:[s.crossfade],onValueChange:i,className:"w-full"}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Fade duration between tracks (0-12 seconds)"})]}),e.jsxs("div",{className:"flex items-center justify-between pt-4 border-t",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(h,{htmlFor:"autoplay",children:"Autoplay"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Automatically play next track in queue"})]}),e.jsx(w,{id:"autoplay",checked:s.autoplay,onCheckedChange:d=>c(d===!0)})]})]})})}function ds({settings:s,onChange:a}){const t=o=>{a({...s,preferences:o})},r=o=>{a({...s,notifications:o})},i=o=>{a({...s,privacy:o})},c=o=>{a({...s,playback:o})},d=s.playback||{quality:"high",volume:.8,crossfade:3,autoplay:!0};return e.jsxs(Te,{defaultValue:"account",className:"w-full",children:[e.jsxs(De,{className:"grid w-full grid-cols-5",children:[e.jsx(O,{value:"account",children:"Account"}),e.jsx(O,{value:"preferences",children:"Préférences"}),e.jsx(O,{value:"notifications",children:"Notifications"}),e.jsx(O,{value:"privacy",children:"Confidentialité"}),e.jsx(O,{value:"playback",children:"Playback"})]}),e.jsx(B,{value:"account",className:"mt-6",children:e.jsx(ls,{})}),e.jsx(B,{value:"preferences",className:"mt-6",children:e.jsx(He,{preferences:s.preferences,onChange:t})}),e.jsx(B,{value:"notifications",className:"mt-6",children:e.jsx(Ke,{notifications:s.notifications,onChange:r})}),e.jsx(B,{value:"privacy",className:"mt-6",children:e.jsx(Ye,{privacy:s.privacy,onChange:i})}),e.jsx(B,{value:"playback",className:"mt-6",children:e.jsx(cs,{playback:d,onChange:c})})]})}const us=["en","fr","es","de","it","pt","ru","ja","zh","ko"],ms=["light","dark","auto"],hs=G({notifications:G({email_notifications:v(),push_notifications:v(),browser_notifications:v(),email_on_follow:v(),email_on_like:v(),email_on_comment:v(),email_on_message:v(),email_on_mention:v(),email_marketing:v()}),privacy:G({allow_search_indexing:v(),show_activity:v()}),content:G({explicit_content:v(),autoplay:v()}),preferences:G({language:ie(us,{errorMap:()=>({message:"Langue non supportée. Utilisez un code ISO 639-1 valide."})}),timezone:Oe().refine(s=>{try{return Intl.DateTimeFormat(void 0,{timeZone:s}),!0}catch{return!1}},{message:"Fuseau horaire IANA invalide"}),theme:ie(ms,{errorMap:()=>({message:"Thème invalide. Valeurs autorisées: light, dark, auto"})})})});function xs(s){n.useEffect(()=>{if(!s)return;const a=t=>{t.preventDefault(),t.returnValue=""};return window.addEventListener("beforeunload",a),()=>window.removeEventListener("beforeunload",a)},[s])}function fs(){const[s,a]=n.useState(!1),t=n.useCallback(()=>a(!0),[]),r=n.useCallback(()=>a(!1),[]);return{isDirty:s,markDirty:t,markClean:r}}function de(){return e.jsxs("div",{className:"container mx-auto px-4 py-8 pb-24 max-w-5xl",children:[e.jsxs("div",{className:"mb-8 flex items-end justify-between",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(b,{className:"h-9 w-56"}),e.jsx(b,{className:"h-4 w-72"})]}),e.jsx(b,{className:"h-11 w-36 rounded-lg"})]}),e.jsxs("div",{className:"overflow-hidden rounded-xl border border-border bg-card/80 backdrop-blur-xl",children:[e.jsxs("div",{className:"p-6 border-b border-border bg-muted/20 flex items-center gap-2",children:[e.jsx(b,{variant:"circular",className:"h-5 w-5"}),e.jsx(b,{className:"h-5 w-40"})]}),e.jsxs("div",{className:"p-6 space-y-6",children:[e.jsx("div",{className:"flex gap-2",children:Array.from({length:4}).map((s,a)=>e.jsx(b,{className:"h-9 w-24 rounded-lg"},a))}),e.jsxs("div",{className:"flex items-center gap-4 py-4",children:[e.jsx(b,{variant:"circular",className:"h-16 w-16"}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(b,{className:"h-5 w-36"}),e.jsx(b,{className:"h-4 w-48"})]})]}),Array.from({length:3}).map((s,a)=>e.jsxs("div",{className:"space-y-3 rounded-xl border border-border bg-muted/20 p-6",children:[e.jsx(b,{className:"h-5 w-40"}),e.jsx(b,{className:"h-4 w-full"}),e.jsx(b,{className:"h-4 w-3/4"})]},a))]})]})]})}function Ds(){const{data:s}=Ae(),[a,t]=n.useState(null),[r,i]=n.useState(!0),[c,d]=n.useState(!1),[o,x]=n.useState(null),[l,m]=n.useState(null),[u,p]=n.useState(0),g=n.useRef(null),{isDirty:y,markDirty:j,markClean:_}=fs();xs(y);const P=n.useCallback(f=>{t(f),j()},[j]),C=async()=>{if(!s?.id){x(new Error("Authentication required for system access.")),i(!1);return}try{i(!0),x(null);const f=await oe.getSettings(s.id);t(f)}catch(f){x(new Error(f instanceof Error?f.message:"Failed to load system configuration."))}finally{i(!1)}};n.useEffect(()=>{C()},[s?.id]);const L=async()=>{if(!s?.id||!a)return;const f=hs.safeParse(a);if(!f.success){ne.error(`Configuration Error: ${f.error.errors.map(S=>S.message).join(", ")}`);return}const T=async()=>{await oe.updateSettings(s.id,a),ne.success("System configuration updated."),m(null),p(0),g.current=null,_()};g.current=T,d(!0);try{await T()}catch(S){m(new Error(S instanceof Error?S.message:"Save failed."))}finally{d(!1)}},k=async()=>{if(!(!g.current||u>=3)){p(f=>f+1),d(!0);try{await g.current()}catch{}finally{d(!1)}}};return r?e.jsx(de,{}):o&&!a?e.jsx("div",{className:"container mx-auto px-4 py-8 flex items-center justify-center min-h-layout-page",children:e.jsx(Q,{error:o,variant:"card",severity:"error",onRetry:C})}):a?e.jsxs("div",{className:"container mx-auto px-4 py-8 pb-24 max-w-5xl",children:[l&&e.jsx(Q,{error:l,variant:"banner",severity:"error",onRetry:u<3?k:void 0,onDismiss:()=>{m(null),p(0),g.current=null}}),e.jsxs("div",{className:"mb-8 flex items-end justify-between",children:[e.jsxs("div",{children:[e.jsx("h1",{className:"text-display font-heading text-foreground mb-2",children:"System Config"}),e.jsxs("p",{className:"text-muted-foreground flex items-center gap-2",children:[e.jsx(pe,{className:"w-4 h-4 text-primary"}),"Manage your neural link and interface preferences."]})]}),e.jsx(N,{onClick:L,disabled:c,className:"shadow-glow-cyan min-w-36",size:"lg",children:c?e.jsxs(e.Fragment,{children:[e.jsx(Ee,{className:"mr-2 h-4 w-4"})," Saving..."]}):e.jsxs(e.Fragment,{children:[e.jsx(ze,{className:"mr-2 h-4 w-4"})," Save Config"]})})]}),e.jsxs(z,{variant:"glass",className:"overflow-hidden border-border bg-card/80 backdrop-blur-xl",children:[e.jsxs("div",{className:"p-6 border-b border-border bg-muted/20 flex items-center gap-2",children:[e.jsx(Me,{className:"w-5 h-5 text-primary"}),e.jsx("h2",{className:"font-bold text-lg",children:"Global Preferences"})]}),e.jsx("div",{className:"p-6",children:e.jsx(ds,{settings:a,onChange:P})})]})]}):e.jsx(de,{})}export{Ds as SettingsPage};
|