LotusGuild/cinny
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(room-preview): make the preview card actually populate + richer
CI / Build & Quality Checks (push) Successful in 10m53s
Details
CI / Trigger Desktop Build (push) Successful in 14s
Details

Browse Source 
Two review agents found the preview card degrades to 'id + logo + Join' for real
reasons. Fixes:

- **via was dropped at the summary fetch** (root cause). RoomSummaryLoader now
  accepts + forwards `via` to getRoomSummary (and keys the query on it);
  JoinBeforeNavigate passes viaServers; the lobby Preview chip carries data-via and
  Lobby.handleOpenRoom appends it to the navigated URL. Without this, previews of
  rooms the HS isn't already in came back sparse/404.
- **No loading/error state** -> RoomSummaryLoader now surfaces {loading,error};
  JoinBeforeNavigate shows a Spinner while loading instead of the degraded card.
- **Room id leaked as name AND topic AND header** -> stop using the raw `!id` as
  the topic fallback (show 'No description'); name falls back to canonical_alias
  then alias-localpart; the page header shows the summary name.
- **Richer, membership-aware card**: forward canonical_alias (shown under the name),
  world_readable ('Readable' badge), and membership -> the button now shows Accept
  invite / Requested / Banned correctly instead of a Join that lies; a 'hero' layout
  for the single-preview page (primary Join button, unclamped topic). Removed dead
  `|| undefined ||`.

IRoomSummary re-adds canonical_alias (the SDK type Omit<>s it though MSC3266
returns it). 738 tests pass, build clean.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Jared Vititoe
2026-07-07 14:46:21 -04:00
parent 7fd3164b1f
commit 0c6003fb87
5 changed files with 157 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/features/join-before-navigate/JoinBeforeNavigate.tsx
+62 -47
View File
@@ -1,5 +1,5 @@
import React from 'react';
import { Box, Icon, IconButton, Icons, Scroll, Text, toRem } from 'folds';
import { Box, Icon, IconButton, Icons, Scroll, Spinner, Text, toRem } from 'folds';
import { useAtomValue } from 'jotai';
import { RoomCard } from '../../components/room-card';
import { RoomTopicViewer } from '../../components/room-topic-viewer';
@@ -32,53 +32,68 @@ export function JoinBeforeNavigate({
return (
<Page>
<PageHeader balance>
<Box grow="Yes" gap="200">
<Box shrink="No">
{screenSize === ScreenSize.Mobile && (
<BackRouteHandler>
{(onBack) => (
<IconButton onClick={onBack} aria-label="Back">
<Icon src={Icons.ArrowLeft} />
</IconButton>
)}
</BackRouteHandler>
)}
</Box>
<Box grow="Yes" justifyContent="Center" alignItems="Center" gap="200">
<Text size="H3" truncate>
{roomIdOrAlias}
</Text>
</Box>
</Box>
</PageHeader>
<Box grow="Yes">
<Scroll hideTrack visibility="Hover" size="0">
<Box style={{ height: '100%' }} grow="Yes" alignItems="Center" justifyContent="Center">
<RoomSummaryLoader roomIdOrAlias={roomIdOrAlias}>
{(summary) => (
<RoomCard
style={{ maxWidth: toRem(364), width: '100%' }}
roomIdOrAlias={roomIdOrAlias}
allRooms={allRooms}
avatarUrl={summary?.avatar_url}
name={summary?.name}
topic={summary?.topic}
memberCount={summary?.num_joined_members}
roomType={summary?.room_type}
joinRule={summary?.join_rule}
encrypted={!!summary?.['im.nheko.summary.encryption']}
viaServers={viaServers}
renderTopicViewer={(name, topic, requestClose) => (
<RoomTopicViewer name={name} topic={topic} requestClose={requestClose} />
<RoomSummaryLoader roomIdOrAlias={roomIdOrAlias} via={viaServers}>
{(summary, state) => (
<>
<PageHeader balance>
<Box grow="Yes" gap="200">
<Box shrink="No">
{screenSize === ScreenSize.Mobile && (
<BackRouteHandler>
{(onBack) => (
<IconButton onClick={onBack} aria-label="Back">
<Icon src={Icons.ArrowLeft} />
</IconButton>
)}
</BackRouteHandler>
)}
onView={handleView}
/>
)}
</RoomSummaryLoader>
</Box>
</Scroll>
</Box>
</Box>
<Box grow="Yes" justifyContent="Center" alignItems="Center" gap="200">
<Text size="H3" truncate>
{summary?.name || summary?.canonical_alias || roomIdOrAlias}
</Text>
</Box>
</Box>
</PageHeader>
<Box grow="Yes">
<Scroll hideTrack visibility="Hover" size="0">
<Box
style={{ height: '100%' }}
grow="Yes"
alignItems="Center"
justifyContent="Center"
>
{state.loading && !summary ? (
<Spinner size="600" variant="Secondary" />
) : (
<RoomCard
hero
style={{ maxWidth: toRem(420), width: '100%' }}
roomIdOrAlias={roomIdOrAlias}
allRooms={allRooms}
avatarUrl={summary?.avatar_url}
name={summary?.name}
canonicalAlias={summary?.canonical_alias}
topic={summary?.topic}
memberCount={summary?.num_joined_members}
roomType={summary?.room_type}
joinRule={summary?.join_rule}
encrypted={!!summary?.['im.nheko.summary.encryption']}
worldReadable={summary?.world_readable}
membership={summary?.membership}
viaServers={viaServers}
renderTopicViewer={(name, topic, requestClose) => (
<RoomTopicViewer name={name} topic={topic} requestClose={requestClose} />
)}
onView={handleView}
/>
)}
</Box>
</Scroll>
</Box>
</>
)}
</RoomSummaryLoader>
</Page>
);
}