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

add more navigation items in room, direct and space tab

Browse source
This commit is contained in:
Ajay Bura 2024-02-07 11:41:37 +05:30
parent caf67b9889
commit 2c3318e36f
4 changed files with 113 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/app/pages/client/direct/Direct.tsx
View file

@ -80,7 +80,25 @@ export function Direct() {
<DirectEmpty />
) : (
<ClientDrawerContentLayout>
<Box direction="Column" gap="400">
<Box direction="Column" gap="300">
<NavCategory>
<NavItem variant="Background" radii="400">
<NavLink to="TODO:">
<NavItemContent size="T300">
<Box as="span" grow="Yes" alignItems="Center" gap="200">
<Avatar size="200" radii="400">
<Icon src={Icons.Plus} size="100" />
</Avatar>
<Box as="span" grow="Yes">
<Text as="span" size="Inherit" truncate>
Create Chat
</Text>
</Box>
</Box>
</NavItemContent>
</NavLink>
</NavItem>
</NavCategory>
<NavCategory>
<NavCategoryHeader>
<Text size="O400">People</Text>

52
src/app/pages/client/home/Home.tsx
View file

@ -87,7 +87,57 @@ export function Home() {
<HomeEmpty />
) : (
<ClientDrawerContentLayout>
<Box direction="Column" gap="400">
<Box direction="Column" gap="300">
<NavCategory>
<NavItem variant="Background" radii="400">
<NavLink to="TODO:">
<NavItemContent size="T300">
<Box as="span" grow="Yes" alignItems="Center" gap="200">
<Avatar size="200" radii="400">
<Icon src={Icons.Plus} size="100" />
</Avatar>
<Box as="span" grow="Yes">
<Text as="span" size="Inherit" truncate>
Create Room
</Text>
</Box>
</Box>
</NavItemContent>
</NavLink>
</NavItem>
<NavItem variant="Background" radii="400">
<NavLink to="TODO:">
<NavItemContent size="T300">
<Box as="span" grow="Yes" alignItems="Center" gap="200">
<Avatar size="200" radii="400">
<Icon src={Icons.Link} size="100" />
</Avatar>
<Box as="span" grow="Yes">
<Text as="span" size="Inherit" truncate>
Join with Address
</Text>
</Box>
</Box>
</NavItemContent>
</NavLink>
</NavItem>
<NavItem variant="Background" radii="400">
<NavLink to="TODO:">
<NavItemContent size="T300">
<Box as="span" grow="Yes" alignItems="Center" gap="200">
<Avatar size="200" radii="400">
<Icon src={Icons.Search} size="100" />
</Avatar>
<Box as="span" grow="Yes">
<Text as="span" size="Inherit" truncate>
Message Search
</Text>
</Box>
</Box>
</NavItemContent>
</NavLink>
</NavItem>
</NavCategory>
<NavCategory>
<NavCategoryHeader>
<Text size="O400">Rooms</Text>

46
src/app/pages/client/space/Space.tsx
View file

@ -1,7 +1,7 @@
import React, { useRef } from 'react';
import { Outlet } from 'react-router-dom';
import { useAtomValue } from 'jotai';
import { Avatar, Box, Text } from 'folds';
import { Avatar, Box, Icon, Icons, Text } from 'folds';
import { Room } from 'matrix-js-sdk';
import { ClientContentLayout } from '../ClientContentLayout';
import { ClientDrawerLayout } from '../ClientDrawerLayout';
@ -110,7 +110,41 @@ export function Space({ space }: { space: Room }) {
</Box>
</ClientDrawerHeaderLayout>
<ClientDrawerContentLayout scrollRef={scrollRef}>
<Box direction="Column" gap="400">
<Box direction="Column" gap="300">
<NavCategory>
<NavItem variant="Background" radii="400">
<NavLink to="TODO:">
<NavItemContent size="T300">
<Box as="span" grow="Yes" alignItems="Center" gap="200">
<Avatar size="200" radii="400">
<Icon src={Icons.Flag} size="100" />
</Avatar>
<Box as="span" grow="Yes">
<Text as="span" size="Inherit" truncate>
Lobby
</Text>
</Box>
</Box>
</NavItemContent>
</NavLink>
</NavItem>
<NavItem variant="Background" radii="400">
<NavLink to="TODO:">
<NavItemContent size="T300">
<Box as="span" grow="Yes" alignItems="Center" gap="200">
<Avatar size="200" radii="400">
<Icon src={Icons.Search} size="100" />
</Avatar>
<Box as="span" grow="Yes">
<Text as="span" size="Inherit" truncate>
Message Search
</Text>
</Box>
</Box>
</NavItemContent>
</NavLink>
</NavItem>
</NavCategory>
<SpaceChildRoomsProvider spaceId={space.roomId} roomToParents={roomToParents}>
{(childRooms) =>
childRooms.length > 0 && (
@ -124,10 +158,14 @@ export function Space({ space }: { space: Room }) {
}
</SpaceChildRoomsProvider>
{childSpaces.sort(factoryRoomIdByAtoZ(mx)).map((childSpaceId) => (
<SpaceChildRoomsProvider spaceId={childSpaceId} roomToParents={roomToParents}>
<SpaceChildRoomsProvider
key={childSpaceId}
spaceId={childSpaceId}
roomToParents={roomToParents}
>
{(childRooms) =>
childRooms.length > 0 && (
<NavCategory key={childSpaceId}>
<NavCategory>
<NavCategoryHeader>
<Text size="O400">{mx.getRoom(childSpaceId)?.name}</Text>
</NavCategoryHeader>

1
src/app/pages/paths.ts
View file

@ -17,6 +17,7 @@ export const REGISTER_PATH = '/register/:server?/';
export const RESET_PASSWORD_PATH = '/reset-password/:server?/';
export const _CREATE_PATH = 'create/';
export const _JOIN_PATH = 'join/';
export const _LOBBY_PATH = 'lobby/';
export const _SEARCH_PATH = 'search/';
export const _ROOM_PATH = ':roomIdOrAlias/:eventId?/';