diff --git a/src/renderer/components/team/MemberBadge.tsx b/src/renderer/components/team/MemberBadge.tsx index 7031ce99..a45dfc4c 100644 --- a/src/renderer/components/team/MemberBadge.tsx +++ b/src/renderer/components/team/MemberBadge.tsx @@ -17,6 +17,8 @@ import { import { MemberHoverCard } from './members/MemberHoverCard'; +import type { ResolvedTeamMember } from '@shared/types'; + interface MemberBadgeProps { name: string; color?: string; @@ -31,6 +33,8 @@ interface MemberBadgeProps { disableHoverCard?: boolean; } +const EMPTY_TEAM_MEMBERS: readonly ResolvedTeamMember[] = []; + /** * Reusable member avatar + colored name badge. * Avatar is rendered OUTSIDE the badge, to the left. @@ -49,10 +53,13 @@ export const MemberBadge = memo( }: MemberBadgeProps): React.JSX.Element => { const colors = getTeamColorSet(color ?? ''); const { isLight } = useTheme(); - const selectedTeamName = useStore((s) => s.selectedTeamName); - const effectiveTeamName = teamName ?? selectedTeamName; + const effectiveAvatarTeamName = useStore((s) => + hideAvatar ? null : (teamName ?? s.selectedTeamName) + ); const teamMembers = useStore((s) => - effectiveTeamName ? selectResolvedMembersForTeamName(s, effectiveTeamName) : [] + effectiveAvatarTeamName + ? selectResolvedMembersForTeamName(s, effectiveAvatarTeamName) + : EMPTY_TEAM_MEMBERS ); const avatarMap = useMemo(() => buildMemberAvatarMap(teamMembers), [teamMembers]); const avatarSize = size === 'md' ? 32 : size === 'sm' ? 24 : 18;