mirrors/cinny
1
0
Fork 0
mirror of https://github.com/cinnyapp/cinny.git synced 2025-02-23 05:33:07 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

fix sidebar style with no spaces

Browse source
This commit is contained in:
Ajay Bura 2024-04-19 14:54:00 +05:30
parent 551fb87ba5
commit bcaa783efb
2 changed files with 46 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/app/pages/client/ClientNavigation.tsx
View file

@ -21,10 +21,7 @@ export function ClientNavigation() {
<HomeTab />
<DirectTab />
</SidebarStack>
<SidebarStackSeparator />
<SidebarStack>
<SpaceTabs />
</SidebarStack>
<SpaceTabs />
<SidebarStackSeparator />
<SidebarStack>
<ExploreTab />

82
src/app/pages/client/sidebar/SpaceTabs.tsx
View file

@ -7,7 +7,7 @@ import { useMatrixClient } from '../../../hooks/useMatrixClient';
import { roomToParentsAtom } from '../../../state/room/roomToParents';
import { allRoomsAtom } from '../../../state/room-list/roomList';
import { getSpaceLobbyPath, joinPathComponent } from '../../pathUtils';
import { SidebarAvatar } from '../../../components/sidebar';
import { SidebarAvatar, SidebarStack, SidebarStackSeparator } from '../../../components/sidebar';
import { RoomUnreadProvider } from '../../../components/RoomUnreadProvider';
import colorMXID from '../../../../util/colorMXID';
import { useSelectedSpace } from '../../../hooks/router/useSelectedSpace';
@ -38,42 +38,50 @@ export function SpaceTabs() {
navigate(getSpaceLobbyPath(getCanonicalAliasOrRoomId(mx, targetSpaceId)));
};
return orphanSpaces.map((orphanSpaceId) => {
const space = mx.getRoom(orphanSpaceId);
if (!space) return null;
if (orphanSpaces.length === 0) return null;
return (
<>
<SidebarStackSeparator />
<SidebarStack>
{orphanSpaces.map((orphanSpaceId) => {
const space = mx.getRoom(orphanSpaceId);
if (!space) return null;
const avatarUrl = space.getAvatarUrl(mx.baseUrl, 96, 96, 'crop');
const avatarUrl = space.getAvatarUrl(mx.baseUrl, 96, 96, 'crop');
return (
<RoomUnreadProvider key={orphanSpaceId} roomId={orphanSpaceId}>
{(unread) => (
<SidebarAvatar
key={orphanSpaceId}
dataId={orphanSpaceId}
onClick={handleSpaceClick}
active={selectedSpaceId === orphanSpaceId}
hasCount={unread && unread.total > 0}
tooltip={space.name}
notificationBadge={() =>
unread && <UnreadBadge highlight={unread.highlight > 0} count={unread.total} />
}
avatarChildren={
avatarUrl ? (
<AvatarImage src={avatarUrl} alt={space.name} />
) : (
<AvatarFallback
style={{
backgroundColor: colorMXID(orphanSpaceId),
color: 'white',
}}
>
<Text size="T500">{space.name[0]}</Text>
</AvatarFallback>
)
}
/>
)}
</RoomUnreadProvider>
);
});
return (
<RoomUnreadProvider key={orphanSpaceId} roomId={orphanSpaceId}>
{(unread) => (
<SidebarAvatar
key={orphanSpaceId}
dataId={orphanSpaceId}
onClick={handleSpaceClick}
active={selectedSpaceId === orphanSpaceId}
hasCount={unread && unread.total > 0}
tooltip={space.name}
notificationBadge={() =>
unread && <UnreadBadge highlight={unread.highlight > 0} count={unread.total} />
}
avatarChildren={
avatarUrl ? (
<AvatarImage src={avatarUrl} alt={space.name} />
) : (
<AvatarFallback
style={{
backgroundColor: colorMXID(orphanSpaceId),
color: 'white',
}}
>
<Text size="T500">{space.name[0]}</Text>
</AvatarFallback>
)
}
/>
)}
</RoomUnreadProvider>
);
})}
</SidebarStack>
</>
);
}