Jannis Braun
49e9047005
Fixes a render bug where a federated user (e.g. axel@nova) appeared with the federation globe icon and a broken avatar when viewed on his own home instance. Root cause: `populateFromReady` is first-wins by federatedId and discards the entire skipped DM payload — including its `members` array — so when a sibling instance's ready arrived first, the home instance's view of every shared user was dropped on the floor. Adds a render-only `userViews` cache that mirrors the `dmAlternatives` philosophy: information from skipped ready payloads is preserved for rendering. Every wire surface that delivers a User upserts into the cache regardless of dedup outcome; render sites read through a Zustand selector hook to surface the home view when one is loaded. The DM channel ingestion race is left untouched — the existing no-flapping invariant on origin reconnect is intentional and load-bearing for failover. Layered changes: - `identity.ts`: `normalizeOriginToHost`, `canonicalUserKey`, `isDeliveryFromHome`, `isFederationGlobeApplicable` — single helpers for origin/host normalization and the home/stub tier decision. - `spaceStore.ts`: `userViews` Map, `UserViewEntry` type, `upsertUserView` action with the home-wins preference rule, prune by `deliveredBy` in `removeInstanceSpaces` (mirrors `dmAlternatives` cleanup), `reset` clears. - `userViewLookup.ts`: `useCanonicalUserView` (Zustand selector hook for React) + `getCanonicalUserView` (sync getter for non-React paths). Render reactivity is structural via the selector, not coincidence on legacy update paths. - `populateFromReady` upsert pass runs BEFORE the federatedId dedup so members of skipped DMs still reach the cache. - WS handlers (dm_message_*, message_*, user_updated, member_joined, friend_request_*, dm_channel_created, dm_member_added) and REST hydrators (socialStore, discoverStore, mutuals) feed the cache with their delivering origin. - Render-site routing through `useCanonicalUserView` at every audited user-rendering site (sidebar, header, search, message bubble, reply chips, profile popout/modal, group settings, voice tiles, mention chips, member lists, friends, invites). Self-rendering sites compose alongside via existing `isSelf`/`resolveDisplayIdentity`. - Globe predicate hoisted to `isFederationGlobeApplicable` and applied at three sites, gating on `domain !== window.location.host` so we never show the globe for users whose home IS our own. Tests: 31 new unit tests across `identity`, `userViews` store, and `userViewLookup`. Full suite 276/276. Docs: `client-federation.md` §3 gains a "User View Cache" section parallel to "DM Origin Failover"; `dm-system.md` notes the new store action and WS handler upserts. Bug 3 (federation profile-sync gap — orbit's stale profile data on nova-Axel after a clear/color-change on nova never propagated) remains open. The user-view cache routes around it for the common case (home instance is connected), but the underlying S2S relay gap is its own diagnosis and follows in a separate branch.
66 lines
2.2 KiB
TypeScript
66 lines
2.2 KiB
TypeScript
import React from 'react';
|
|
import type { User } from '@backspace/shared';
|
|
import { useSpaceStore } from '../../stores/spaceStore';
|
|
import { useUIStore } from '../../stores/uiStore';
|
|
import { useCanonicalUserView } from '../../utils/userViewLookup';
|
|
|
|
interface MentionBadgeProps {
|
|
userId: string;
|
|
}
|
|
|
|
export const MentionBadge = React.memo(function MentionBadge({ userId }: MentionBadgeProps) {
|
|
const members = useSpaceStore((s) => s.members);
|
|
const spaces = useSpaceStore((s) => s.spaces);
|
|
const currentSpaceId = useSpaceStore((s) => s.currentSpaceId);
|
|
const openUserProfile = useUIStore((s) => s.openUserProfile);
|
|
|
|
const member = members.find((m) => m.userId === userId);
|
|
const space = spaces.find((s) => s.id === currentSpaceId);
|
|
const ownerId = space?.ownerId;
|
|
|
|
const _FALLBACK_USER = { id: '', username: '', createdAt: 0, isAdmin: false, replicatedInstances: [] } as unknown as User;
|
|
const canonicalMemberUser = useCanonicalUserView(member?.user ?? _FALLBACK_USER);
|
|
const memberUser = member ? canonicalMemberUser : null;
|
|
|
|
let displayName: string;
|
|
let color: string;
|
|
|
|
if (member && memberUser) {
|
|
displayName = memberUser.displayName ?? memberUser.username;
|
|
if (member.roles && member.roles.length > 0) {
|
|
const sorted = [...member.roles].sort((a, b) => b.position - a.position);
|
|
color = sorted[0]!.color;
|
|
} else if (ownerId && userId === ownerId) {
|
|
color = '#fda4af';
|
|
} else {
|
|
color = '#7c6cf6'; // accent-primary default
|
|
}
|
|
} else {
|
|
displayName = 'Unknown User';
|
|
color = '#a0a0aa'; // text-secondary fallback
|
|
}
|
|
|
|
const handleClick = (e: React.MouseEvent) => {
|
|
if (!member || !memberUser) return;
|
|
e.stopPropagation();
|
|
const rect = e.currentTarget.getBoundingClientRect();
|
|
openUserProfile(memberUser, {
|
|
top: Math.min(rect.top, window.innerHeight - 450),
|
|
left: rect.right + 8,
|
|
});
|
|
};
|
|
|
|
// Build inline styles: role-colored text with tinted background
|
|
const bgColor = color + '1a'; // ~10% opacity hex
|
|
|
|
return (
|
|
<span
|
|
onClick={handleClick}
|
|
className="inline-flex items-center rounded-[3px] px-[2px] font-medium cursor-pointer transition-colors hover:brightness-125"
|
|
style={{ color, backgroundColor: bgColor }}
|
|
>
|
|
@{displayName}
|
|
</span>
|
|
);
|
|
});
|