mirrors/cinny
1
0
Fork 0
mirror of https://github.com/cinnyapp/cinny.git synced 2025-09-14 14:52:26 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update RoomView.tsx to accomodate restructuring of Room, RoomView and CallView

Browse source
This commit is contained in:
Gimle Larpes 2025-07-31 20:52:01 +02:00
parent fb9ca31a43
commit e504a9ef4c
1 changed files with 64 additions and 52 deletions
Download patch file Download diff file Expand all files Collapse all files

22
src/app/features/room/RoomView.tsx
View file

@ -1,5 +1,5 @@
import React, { useCallback, useRef } from 'react'; import React, { useCallback, useRef } from 'react';
import { Box, Text, config } from 'folds'; // Assuming 'folds' is a UI library import { Box, Text, config, toRem } from 'folds';
import { EventType, Room } from 'matrix-js-sdk'; import { EventType, Room } from 'matrix-js-sdk';
import { ReactEditor } from 'slate-react'; import { ReactEditor } from 'slate-react';
import { isKeyHotkey } from 'is-hotkey'; import { isKeyHotkey } from 'is-hotkey';
@ -15,7 +15,6 @@ import { RoomTombstone } from './RoomTombstone';
import { RoomInput } from './RoomInput'; import { RoomInput } from './RoomInput';
import { RoomViewFollowing, RoomViewFollowingPlaceholder } from './RoomViewFollowing'; import { RoomViewFollowing, RoomViewFollowingPlaceholder } from './RoomViewFollowing';
import { Page } from '../../components/page'; import { Page } from '../../components/page';
import { RoomViewHeader } from './RoomViewHeader';
import { useKeyDown } from '../../hooks/useKeyDown'; import { useKeyDown } from '../../hooks/useKeyDown';
import { editableActiveElement } from '../../utils/dom'; import { editableActiveElement } from '../../utils/dom';
import navigation from '../../../client/state/navigation'; import navigation from '../../../client/state/navigation';
@ -23,6 +22,8 @@ import { settingsAtom } from '../../state/settings';
import { useSetting } from '../../state/hooks/settings'; import { useSetting } from '../../state/hooks/settings';
import { useAccessibleTagColors, usePowerLevelTags } from '../../hooks/usePowerLevelTags'; import { useAccessibleTagColors, usePowerLevelTags } from '../../hooks/usePowerLevelTags';
import { useTheme } from '../../hooks/useTheme'; import { useTheme } from '../../hooks/useTheme';
import { useCallState } from '../../pages/client/call/CallProvider';
import { ScreenSize, useScreenSizeContext } from '../../hooks/useScreenSize';
const FN_KEYS_REGEX = /^F\d+$/; const FN_KEYS_REGEX = /^F\d+$/;
@ -64,6 +65,8 @@ export function RoomView({ room, eventId }: { room: Room; eventId?: string }) {
const roomInputRef = useRef<HTMLDivElement>(null); const roomInputRef = useRef<HTMLDivElement>(null);
const roomViewRef = useRef<HTMLDivElement>(null); const roomViewRef = useRef<HTMLDivElement>(null);
const [hideActivity] = useSetting(settingsAtom, 'hideActivity'); const [hideActivity] = useSetting(settingsAtom, 'hideActivity');
const screenSize = useScreenSizeContext();
const { isChatOpen } = useCallState();
const { roomId } = room; const { roomId } = room;
const editor = useEditor(); const editor = useEditor();
const mx = useMatrixClient(); const mx = useMatrixClient();
@ -98,9 +101,16 @@ export function RoomView({ room, eventId }: { room: Room; eventId?: string }) {
); );
return ( return (
<Page ref={roomViewRef}> (!room.isCallRoom() || isChatOpen) && (
{!room.isCallRoom() && <RoomViewHeader />} <Page
<Box grow="Yes" direction="Column" style={{ flex: 1, overflow: 'hidden', minHeight: 0 }}> ref={roomViewRef}
style={
room.isCallRoom() && screenSize === ScreenSize.Desktop
? { maxWidth: toRem(399), minWidth: toRem(399) }
: {}
}
>
<Box grow="Yes" direction="Column">
<RoomTimeline <RoomTimeline
key={roomId} key={roomId}
room={room} room={room}
@ -122,6 +132,7 @@ export function RoomView({ room, eventId }: { room: Room; eventId?: string }) {
replacementRoomId={tombstoneEvent.getContent().replacement_room} replacementRoomId={tombstoneEvent.getContent().replacement_room}
/> />
) : ( ) : (
/* eslint-disable-next-line react/jsx-no-useless-fragment */
<> <>
{canMessage ? ( {canMessage ? (
<RoomInput <RoomInput
@ -148,5 +159,6 @@ export function RoomView({ room, eventId }: { room: Room; eventId?: string }) {
{hideActivity ? <RoomViewFollowingPlaceholder /> : <RoomViewFollowing room={room} />} {hideActivity ? <RoomViewFollowingPlaceholder /> : <RoomViewFollowing room={room} />}
</Box> </Box>
</Page> </Page>
)
); );
} }