Skip to content

show +N indicator for hidden organizations on hover - #191

Open
jikrana1 wants to merge 1 commit into
AOSSIE-Org:mainfrom
jikrana1:feature/overview-org-avatar-indicator
Open

show +N indicator for hidden organizations on hover#191
jikrana1 wants to merge 1 commit into
AOSSIE-Org:mainfrom
jikrana1:feature/overview-org-avatar-indicator

Conversation

@jikrana1

@jikrana1 jikrana1 commented Aug 23, 2026

Copy link
Copy Markdown
Contributor

Addressed Issues:

Fixes #190

Recordings:

OrgExplorer.GitHub.Organization.Analytics.Repository.Insights.and.2.more.pages.-.Profile.1.-.Microsoft.Edge.2026-08-23.13-36-12.-.Trim.mp4

Additional Notes:

Added a "+N" indicator in the Overview identity bar to show how many organizations are hidden when more than 3 are searched together.

Changes:

  • Added showAllOrgs state to track hover expansion
  • Each avatar is wrapped in a container with animated width (0 to 36px) so hidden avatars take up no space in the layout, avoiding
    gaps
  • Hovering over the avatar group smoothly reveals all organization avatars via a CSS width transition; moving the mouse away collapses back to 3 avatars + the "+N" badge
  • The "+N" badge itself is also width-animated, so it fades away cleanly when expanded, without leaving a gap
  • Added cursor: pointer on the avatar group when more than 3 organizations are present, to signal it's interactive
  • The badge only renders when orgs.length > 3, so single or few-org searches are unaffected

Tested locally with 4-5 organizations searched together — hover expand/collapse works smoothly with no layout shift or gaps.

Checklist

  • My code follows the project's code style and conventions
  • I have made corresponding changes to the documentation
  • My changes generate no new warnings or errors
  • I have joined the Discord server and I will share a link to this PR with the project maintainers there
  • I have read the Contributing Guidelines

@github-actions github-actions Bot added enhancement New feature or request frontend Frontend changes javascript JavaScript/TypeScript changes size/M 51-200 lines changed first-time-contributor First time contributor and removed size/M 51-200 lines changed labels Aug 23, 2026
@gitcordapp

gitcordapp Bot commented Aug 23, 2026

Copy link
Copy Markdown

Link your account with Gitcord

Thanks for opening this PR, @jikrana1!

To receive Discord notifications and contributor tracking for this organization:

  1. Join Discord: https://discord.gg/hjUhu33uAn
  2. In Discord, run /link jikrana1
  3. Paste the verification code into your GitHub bio (or a public gist)
  4. Click Verify in Discord (or run /verify-link jikrana1)

Once linked, Gitcord can notify you about reviews, merges, and more.

Posted by Gitcord

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request first-time-contributor First time contributor frontend Frontend changes javascript JavaScript/TypeScript changes size/M 51-200 lines changed

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[FEATURE]: Show "+N" indicator for hidden organizations in Overview identity bar

1 participant