[Human App Frontend] Redesign Profile

[KirillKirill]

Issue tracking

Context behind the change

How has this been tested?

Release plan

Potential risks; What to monitor; Rollback plan

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
human-app	Ready	Preview, Comment	Jul 27, 2026 3:15pm

4 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
faucet-frontend	Ignored	Preview	Jul 27, 2026 3:15pm
faucet-server	Ignored	Preview	Jul 27, 2026 3:15pm
human-dashboard-frontend	Skipped		Jul 27, 2026 3:15pm
staking-dashboard	Skipped		Jul 27, 2026 3:15pm

[Copilot]

Pull request overview

This PR updates the Human App frontend’s protected-area layout and worker Profile UI to support a redesigned “Account/Profile” experience, including new desktop/mobile navigation surfaces and updated theme tokens.

Changes:

• Redesign worker Profile page UI (account header, verified status, wallet display + copy, logout/reset password actions).
• Replace the previous protected layout patterns (drawer navigation + page header) with a new layout including a desktop aside bar and a mobile bottom tray.
• Update supporting theme/i18n assets (new border strength token, updated strings, add/remove SVG icons).

Reviewed changes

Copilot reviewed 31 out of 46 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
packages/apps/human-app/frontend/src/shared/styles/typography.ts	Remove redundant mobile breakpoint override for a typography variant.
packages/apps/human-app/frontend/src/shared/styles/dark-color-palette.ts	Add border.strong token for dark mode.
packages/apps/human-app/frontend/src/shared/styles/color-palette.ts	Add border.strong token for light mode.
packages/apps/human-app/frontend/src/shared/i18n/en.json	Update profile strings (“Profile” → “Account”) and add new account-related labels.
packages/apps/human-app/frontend/src/shared/consts.ts	Introduce MOBILE_BOTTOM_TRAY_HEIGHT constant for fixed mobile tray spacing.
packages/apps/human-app/frontend/src/shared/components/ui/icons.tsx	Remove unused icon components and add LogoutIcon.
packages/apps/human-app/frontend/src/router/routes.tsx	Update route definitions to remove page header props and remove operator connect-wallet route.
packages/apps/human-app/frontend/src/router/router.tsx	Simplify ProtectedLayout usage; remove drawer navigation wiring and header props.
packages/apps/human-app/frontend/src/router/components/layout/protected/top-menu-items-list.tsx	Deleted (part of drawer navigation removal).
packages/apps/human-app/frontend/src/router/components/layout/protected/page-header.tsx	Deleted (page-header pattern removed).
packages/apps/human-app/frontend/src/router/components/layout/protected/navbar.tsx	Simplify mobile navbar UI (logo + theme switch); drawer toggle UI commented out.
packages/apps/human-app/frontend/src/router/components/layout/protected/layout.tsx	New protected layout structure; adds desktop aside bar + mobile bottom tray support.
packages/apps/human-app/frontend/src/router/components/layout/protected/index.ts	Stop exporting removed drawer navigation module.
packages/apps/human-app/frontend/src/router/components/layout/protected/drawer-navigation.tsx	Deleted (drawer navigation removed).
packages/apps/human-app/frontend/src/router/components/layout/protected/desktop-aside-bar.tsx	Added desktop aside bar with logo, theme switch, help action, and profile summary.
packages/apps/human-app/frontend/src/router/components/layout/protected/bottom-menu-items-list.tsx	Deleted (part of drawer navigation removal).
packages/apps/human-app/frontend/src/router/components/layout/helpers/is-drawer-item.ts	Deleted (drawer navigation helper removed).
packages/apps/human-app/frontend/src/router/components/layout/helpers/index.ts	Deleted (no remaining helpers).
packages/apps/human-app/frontend/src/router/components/footer.tsx	Adjust footer spacing/borders for new protected layout styling.
packages/apps/human-app/frontend/src/router/components/drawer-menu-items/index.ts	Stop exporting removed operator menu items.
packages/apps/human-app/frontend/src/router/components/drawer-menu-items/drawer-menu-items-worker.tsx	Simplify worker drawer menu items (top items only) after drawer removal.
packages/apps/human-app/frontend/src/router/components/drawer-menu-items/drawer-menu-items-operator.tsx	Deleted (operator drawer items removed with drawer).
packages/apps/human-app/frontend/src/modules/worker/send-reset-link/send-reset-link.page.tsx	Restyle page to new card layout; switch error display to top notification.
packages/apps/human-app/frontend/src/modules/worker/send-reset-link/send-reset-link-success.page.tsx	Restyle page to new card layout; switch error display to top notification.
packages/apps/human-app/frontend/src/modules/worker/reset-password/reset-password.page.tsx	Restyle page to new card layout; switch error display to top notification.
packages/apps/human-app/frontend/src/modules/worker/reset-password/reset-password-success.page.tsx	Restyle success page and adjust sign-out effect behavior.
packages/apps/human-app/frontend/src/modules/worker/profile/views/profile.page.tsx	Implement redesigned Account/Profile UI, including copy wallet address + logout/reset password actions.
packages/apps/human-app/frontend/src/modules/worker/profile/components/profile-data.tsx	Redesign ProfileData into compact/expanded variants and link-to-profile behavior.
packages/apps/human-app/frontend/src/modules/worker/profile/components/profile-bottom-tray.tsx	Add fixed mobile bottom tray with profile summary + help action.
packages/apps/human-app/frontend/src/modules/signup/worker/views/sign-up-worker.page.tsx	Add component="h3" to align heading semantics/styling.
packages/apps/human-app/frontend/src/modules/signin/worker/sign-in.page.tsx	Add component="h3" to align heading semantics/styling.
packages/apps/human-app/frontend/src/assets/icons/work.svg	Deleted unused icon asset.
packages/apps/human-app/frontend/src/assets/icons/work-secondary.svg	Deleted unused icon asset.
packages/apps/human-app/frontend/src/assets/icons/work-header.svg	Deleted unused icon asset.
packages/apps/human-app/frontend/src/assets/icons/user-secondary.svg	Deleted unused icon asset.
packages/apps/human-app/frontend/src/assets/icons/user-outlined.svg	Deleted unused icon asset.
packages/apps/human-app/frontend/src/assets/icons/user-filled.svg	Deleted unused icon asset.
packages/apps/human-app/frontend/src/assets/icons/profile-icon.svg	Deleted unused icon asset.
packages/apps/human-app/frontend/src/assets/icons/logout.svg	Added logout icon asset.
packages/apps/human-app/frontend/src/assets/icons/hand.svg	Deleted unused icon asset.
packages/apps/human-app/frontend/src/assets/icons/checkmark-icon.svg	Update checkmark icon SVG to new design.
packages/apps/human-app/frontend/src/assets/icons-dark-mode/work.svg	Deleted unused dark-mode icon asset.
packages/apps/human-app/frontend/src/assets/icons-dark-mode/work-header.svg	Deleted unused dark-mode icon asset.
packages/apps/human-app/frontend/src/assets/icons-dark-mode/user-outlined.svg	Deleted unused dark-mode icon asset.
packages/apps/human-app/frontend/src/assets/icons-dark-mode/profile-icon.svg	Deleted unused dark-mode icon asset.
packages/apps/human-app/frontend/src/assets/icons-dark-mode/hand.svg	Deleted unused dark-mode icon asset.

Comments suppressed due to low confidence (2)

packages/apps/human-app/frontend/src/modules/worker/profile/views/profile.page.tsx:46

• navigator.clipboard.writeText(...) returns a Promise; calling it without awaiting/catching can cause unhandled rejections, and the UI currently shows “Copied” even if the copy fails. Consider updating state only on success and handling failures.

  const handleCopyClick = (e: MouseEvent<HTMLButtonElement>) => {
    if (isCopied) return;

    e.stopPropagation();
    navigator.clipboard.writeText(user.wallet_address ?? '');

packages/apps/human-app/frontend/src/router/components/layout/protected/layout.tsx:96

• DesktopAsideBar renders worker profile UI (ProfileData). Since ProtectedLayout is also used for operator routes, this aside bar will show up on operator pages on desktop. Gate it to worker routes only (matching the bottom-tray logic).

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

Pull request overview

Copilot reviewed 26 out of 41 changed files in this pull request and generated 2 comments.

Comments suppressed due to low confidence (1)

packages/apps/human-app/frontend/src/router/components/layout/protected/layout.tsx:57

• ProtectedLayout is also used for web3ProtectedRoutes (see router.tsx), but it always renders worker-only UI (DesktopAsideBar / ProfileBottomTray) that ultimately calls useAuthenticatedUser(). On web3/operator routes that context is not provided, so this will throw at runtime and break operator pages. Gate worker-only UI to worker routes (e.g., pathname.startsWith('/worker')).