fix(settings): use one member avatar with profile photos everywhere

[waleedlatif1]

Summary

• One member avatar everywhere: emcn Avatar gains name/src props (a discriminated union with composed children) — <Avatar size='xs' name={…} src={…} aria-hidden /> renders the person's photo, or their initial on the neutral disc, and a photo that fails to load falls back to the initial; no app-level wrapper
• AvatarFallback sizes its glyph to the enclosing avatar (CVA, via context), so no caller overrides the font size; size-* classes and the --border token; empty names never produce an unlabelled role="img", and the status dot follows aria-hidden
• Replaces five variants with it: the settings MemberAvatar and its duplicate OwnerAvatar (resource owner cells, owner filters), the 36px getUserColor avatar in the shared permissions member row (credential members, skill editors), the 32px colored avatar in the transfer-ownership dialog, and the 24px avatar in the credential-group people list
• Photos now show where they were dropped: credential members select user.image (explicit and workspace-admin rows), skill editors pass the image the API already returned; the skills contract's userImage is tightened to nullable since both producers always set it
• Avatars are aria-hidden — the name is always beside them
• Updated the settings-pages rule that said to keep two avatar components; per-person colors stay only on live collaboration (presence, cursors)

Type of Change

• Bug fix

Testing

• Verified in the running app on Members, Teammates and Insights (photo and initial fallback, light and dark)
• New tests: emcn Avatar in a real DOM — a loaded photo renders, a failed photo falls back to the initial, labelling and aria-hidden, per-size glyph; credential members carry images for explicit and derived rows
• 366 emcn tests and 7,514 app tests across the affected areas, lint, type-check, check:audits, docs-manifest, block registry green; /cleanup passes applied

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[vercel]

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

Project	Deployment	Actions	Updated
docs	Ready	Preview	Sep 24, 2026 3:37am UTC

[greptile-apps]

Confidence Score: 5/5

The PR appears safe to merge; no actionable new defects or outstanding previous findings remain.

Summary

The PR standardizes member and owner presentation on EMCN’s Avatar, carries profile-image data through credential and skill editor models, and adds DOM coverage for image fallback and accessibility behavior. Since the previous review, it also restores accessible status announcements for composed avatars and exports the fallback CVA variants.

• Replaces duplicated avatar implementations across settings, permissions, ownership, and usage surfaces.
• Adds image propagation for explicit and workspace-admin credential members.
• Adds loaded-image, failed-image, sizing, labelling, hidden-avatar, and status accessibility tests.
• All previous findings are resolved in the current code.

Diagram

%%{init: {'theme': 'neutral'}}%%
flowchart LR
  MemberData[Member data] --> AvatarProps[name and optional src]
  AvatarProps --> Image{Photo loads?}
  Image -->|Yes| Photo[Profile photo]
  Image -->|No| Fallback[Initial fallback]
  AvatarProps --> Accessibility{aria-hidden?}
  Accessibility -->|No| Label[Accessible person label]
  Accessibility -->|Yes| Silent[Decorative avatar]
  Composed[Composed avatar with status] --> Status[Accessible status dot]

Loading

_{Reviews (4) · Last reviewed commit: "fix(emcn): keep a composed avatar's stat..."}

[cubic-dev-ai]

No issues found across 25 files

Confidence score: 5/5

• Automated review surfaced no issues in the provided summaries.
• No files require special attention.

_{Re-trigger cubic}

[waleedlatif1]

@greptile

[waleedlatif1]

@cubic-dev-ai review this PR

[cubic-dev-ai]

@cubic-dev-ai review this PR

@waleedlatif1 I have started the AI code review. It will take a few minutes to complete.

[cubic-dev-ai]

All reported issues were addressed across 28 files

<sub>Reply with feedback, questions, or to request a fix.

Fix all with cubic | Re-trigger cubic</sub>

[waleedlatif1]

@greptile

[waleedlatif1]

@cubic-dev-ai review this PR

[cubic-dev-ai]

@cubic-dev-ai review this PR

@waleedlatif1 I have started the AI code review. It will take a few minutes to complete.

[cubic-dev-ai]

No issues found across 28 files

Confidence score: 5/5

• Automated review surfaced no issues in the provided summaries.
• No files require special attention.

_{Re-trigger cubic}

[waleedlatif1]

@greptile

[waleedlatif1]

@cubic-dev-ai review this PR

[cubic-dev-ai]

@cubic-dev-ai review this PR

@waleedlatif1 I have started the AI code review. It will take a few minutes to complete.

[cubic-dev-ai]

No issues found across 28 files

Confidence score: 5/5

• Automated review surfaced no issues in the provided summaries.
• No files require special attention.

_{Re-trigger cubic}