zero-fucks-given/docs/core/account-settings/frontend.md

Account Settings Frontend

The frontend module implements the current admin profile settings page.

Source: apps/admin/src/core/AccountSettings/

Directory Structure

AccountSettings/
  config/        Routes, messages, translations.
  pages/         Profile route page.
  view/
    forms/       Profile form and form fields.
    layouts/     Account layout.

Routes

Frontend route config:

config/routing.tsx

Mounted module path:

/account/*

Route	Page	Purpose
/account/profile	ProfilePage	Current admin profile settings.

The index route redirects to /account/profile.

Profile Page

Main file:

pages/Profile/index.tsx

Responsibilities:

• Read the current user from useAuth().
• Submit profile updates through updateUser.
• Map backend validation errors into form fields.
• Render assigned roles.

Form

Profile form files:

view/forms/ProfileForm/Component.tsx
view/forms/ProfileForm/form.ts
view/forms/ProfileForm/fields/PasswordField.tsx
view/forms/ProfileForm/fields/AvatarCropperField.tsx

Password behavior:

• Password fields are hidden until toggled open.
• Password is optional.
• If provided, password must be at least 8 characters.
• If provided, confirmation must match.

Avatar behavior:

• The field supports local crop/preview UI.
• The form currently stages avatar data in the form value.
• Profile update payload strips avatar before calling updateUser.

Auth Dependency

Translations

Translations are module-local:

config/messages.ts
config/translation/en.json
config/translation/uk.json

Use only ACCOUNT.* keys inside this module.

Common Change Guide

Change	Start Here
Add a profile field	ProfileForm/form.ts, ProfileForm/Component.tsx, backend profile validator
Change password validation	ProfileForm/form.ts
Change avatar UI	ProfileForm/fields/AvatarCropperField.tsx
Change profile save behavior	pages/Profile/index.tsx and AuthProvider updateUser
Change translations	config/translation/en.json and config/translation/uk.json