Revert to original code as we've moved calling to be more inline with design

This commit is contained in:
Gigiaj 2025-05-09 11:16:13 -05:00
parent 807c90e2f5
commit 4293538dc3

View file

@ -1,63 +1,15 @@
import React, { ReactNode, useMemo, useRef } from 'react';
import React, { ReactNode } from 'react';
import { Box } from 'folds';
import { Outlet, useParams } from 'react-router-dom';
import { useCallState } from './CallProvider';
import { PersistentCallContainer } from '../call/PersistentCallContainer';
import { useMatrixClient } from '../../hooks/useMatrixClient';
import { ClientWidgetApi } from 'matrix-widget-api';
import { SmallWidget } from '../../features/room/SmallWidget';
type ClientLayoutProps = {
nav: ReactNode;
children: ReactNode;
};
export function ClientLayout({ nav }: ClientLayoutProps) {
const { activeCallRoomId } = useCallState();
const iframeRef = useRef<HTMLIFrameElement | null>(null);
const widgetApiRef = useRef<ClientWidgetApi | null>(null);
const smallWidgetRef = useRef<SmallWidget | null>(null);
const backupIframeRef = useRef<HTMLIFrameElement | null>(null);
const backupWidgetApiRef = useRef<ClientWidgetApi | null>(null);
const backupSmallWidgetRef = useRef<SmallWidget | null>(null);
const { roomIdOrAlias: viewedRoomId } = useParams();
const mx = useMatrixClient();
const isCall = mx.getRoom(viewedRoomId)?.isCallRoom();
export function ClientLayout({ nav, children }: ClientLayoutProps) {
return (
<Box grow="Yes" direction="Row" style={{ height: '100vh', width: '100vw', overflow: 'hidden' }}>
<Box shrink="No" className="nav-container-styles">
{nav}
</Box>
<Box grow="Yes" direction="Column" style={{ position: 'relative', overflowY: 'auto' }}>
<Box grow="Yes" style={{ position: 'relative' }}>
<PersistentCallContainer
isVisible={false}
viewedRoomId={viewedRoomId}
iframeRef={iframeRef}
widgetApiRef={widgetApiRef}
smallWidgetRef={smallWidgetRef}
backupIframeRef={backupIframeRef}
backupWidgetApiRef={backupWidgetApiRef}
backupSmallWidgetRef={backupSmallWidgetRef}
/>
<Box
grow="Yes"
style={{
flexDirection: 'column',
width: '100%',
height: '100%',
}}
className="outlet-wrapper"
>
<Outlet
context={{
iframeRef,
backupIframeRef,
}}
/>
</Box>
</Box>
</Box>
<Box grow="Yes">
<Box shrink="No">{nav}</Box>
<Box grow="Yes">{children}</Box>
</Box>
);
}