Files
cinny/src/app/features/forum/ForumAwareSpaceLayout.tsx

50 lines
1.5 KiB
TypeScript

import React, { useMemo } from 'react';
import { PageRoot } from '../../components/page';
import { AnimatedOutlet } from '../../components/AnimatedOutlet';
import { MobileFriendlyPageNav } from '../../pages/MobileFriendly';
import { SPACE_PATH } from '../../pages/paths';
import { Space } from '../../pages/client/space/Space';
import { useMatrixClient } from '../../hooks/useMatrixClient';
import { useSelectedRoom } from '../../hooks/router/useSelectedRoom';
import { useSpace } from '../../hooks/useSpace';
import { isForumContainer, shouldShowForumLobby } from '../../utils/room';
import { ForumBoardProvider } from './ForumBoardContext';
/**
* Space sidebar + outlet. Forum spaces render ForumFeedSidebar in Space.tsx.
*/
export function ForumAwareSpaceLayout() {
const mx = useMatrixClient();
const space = useSpace();
const selectedRoomId = useSelectedRoom();
const scope = useMemo(() => {
const room = selectedRoomId ? mx.getRoom(selectedRoomId) : null;
const topicRoomId =
room && room.roomId !== space.roomId && !isForumContainer(room) ? room.roomId : undefined;
return { forumSpaceId: space.roomId, topicRoomId };
}, [mx, selectedRoomId, space.roomId]);
const layout = (
<PageRoot
nav={
<MobileFriendlyPageNav path={SPACE_PATH}>
<Space />
</MobileFriendlyPageNav>
}
>
<AnimatedOutlet />
</PageRoot>
);
if (!shouldShowForumLobby(space)) {
return layout;
}
return (
<ForumBoardProvider forumSpace={space} scope={scope}>
{layout}
</ForumBoardProvider>
);
}