← All frames · Frame (e)

States that are contract, not decoration

The cases the implementation must handle in the menu itself: loading, no organizations, a failed org fetch, a language that fails to load, and the mobile drawer where the whole menu has to fit a phone.

Menu opened before data arrives
Ada Rivera

The account section renders immediately — it reads local state, not the network. Only the organization list can be pending, so only it skeletons.

Account belongs to no organization
No organizations yet.

Reachable while workspace provisioning is still catching up. The section does not collapse to nothing — it names the state and offers the way out.

Organization fetch failed
Couldn't load organizations.

The rest of the menu — accounts, language, sign out — stays usable. A failed org fetch must not take the whole identity surface down with it.

Language bundle failed to load
Couldn't switch to العربية. Still showing English.

The selection reverts to the language actually in effect. A control that shows a language the UI is not rendering in is a lie.

Mobile — the menu becomes a sheet
FuzeFront
3
AR
Ada Rivera

Below the mobile breakpoint the panel is full-width and scrolls internally, and every row keeps a 44px touch target. Consolidating three top-bar controls into the avatar is what makes the bar fit a phone at all.

Test hooks: [data-case] · [data-section='organizations'][data-state='loading'|'empty'|'error'] · [data-section='language'][data-state='error'] · [data-action='retry'] · [data-variant='sheet'].
Frame (e) — cross-cutting states ← Back to index
Review · app-scopes-user-menu approve or reject each flow ↓
user-menupendingApproveReject
accountspendingApproveReject
install-scopependingApproveReject
notificationspendingApproveReject