prepare to feed this to child elements for visibility handling

This commit is contained in:
Gigiaj
2025-05-08 17:56:49 -05:00
parent 824be5bdc2
commit 9e919ea761

View File

@@ -28,7 +28,16 @@ interface PersistentCallContainerProps {
viewedRoomId: string; viewedRoomId: string;
} }
export function PersistentCallContainer({ isVisible, viewedRoomId }: PersistentCallContainerProps) { export function PersistentCallContainer({
isVisible,
viewedRoomId,
iframeRef,
widgetApiRef,
smallWidgetRef,
backupIframeRef,
backupWidgetApiRef,
backupSmallWidgetRef,
}: PersistentCallContainerProps) {
const { const {
activeCallRoomId, activeCallRoomId,
isChatOpen, isChatOpen,
@@ -51,14 +60,6 @@ export function PersistentCallContainer({ isVisible, viewedRoomId }: PersistentC
logger.info(room); logger.info(room);
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 setupWidget = (widgetApiRef, smallWidgetRef, iframeRef, skipLobby) => { const setupWidget = (widgetApiRef, smallWidgetRef, iframeRef, skipLobby) => {
const cleanupRoomId = smallWidgetRef.current?.roomId; const cleanupRoomId = smallWidgetRef.current?.roomId;
logger.debug(`PersistentCallContainer effect running. activeCallRoomId: ${activeCallRoomId}`); logger.debug(`PersistentCallContainer effect running. activeCallRoomId: ${activeCallRoomId}`);
@@ -171,46 +172,17 @@ export function PersistentCallContainer({ isVisible, viewedRoomId }: PersistentC
}; };
return ( return (
<Page style={containerStyle}> <Box direction="Row" grow="Yes" style={{ height: '0%', width: '0%' }}>
<Box direction="Row" grow="Yes" style={{ height: '100%', width: '100%' }}>
{activeCallRoomId && roomId && room !== null && (
<Box
shrink="No"
style={{
height: '100%',
overflowY: 'auto',
}}
>
<PowerLevelsContainer>
<PageRoot
nav={
<MobileFriendlyPageNav path={SPACE_PATH}>
<Space />
</MobileFriendlyPageNav>
}
/>
</PowerLevelsContainer>
</Box>
)}
<Box <Box
direction="Column" direction="Column"
style={{ style={{
position: 'relative', position: 'relative',
overflow: 'hidden',
zIndex: 0, zIndex: 0,
display: isMobile && isChatOpen ? 'none' : 'flex', display: isMobile && isChatOpen ? 'none' : 'flex',
width: isMobile && isChatOpen ? '0%' : '100%', width: isMobile && isChatOpen ? '0%' : '100%',
height: isMobile && isChatOpen ? '0%' : '100%', height: isMobile && isChatOpen ? '0%' : '100%',
}} }}
> >
{activeCallRoomId && roomId && room !== null && (
<Box direction="Column" style={{ width: '100%' }}>
<PowerLevelsContainer>
<RoomViewHeader />
</PowerLevelsContainer>
</Box>
)}
<Box <Box
grow="Yes" grow="Yes"
style={{ style={{
@@ -252,14 +224,6 @@ export function PersistentCallContainer({ isVisible, viewedRoomId }: PersistentC
/> />
</Box> </Box>
</Box> </Box>
<Box grow="Yes" direction="Column" style={{ position: 'relative' }}>
{isChatOpen && activeCallRoomId && roomId && room !== null && (
<PowerLevelsContainer>
<RoomView room={room} eventId={eventId} />
</PowerLevelsContainer>
)}
</Box> </Box>
</Box>
</Page>
); );
} }