Adjust to using a provider so we don't load powerlevels in our callcontainer

This commit is contained in:
GigiaJ 2025-04-20 14:39:11 -04:00
parent 1a3b10e32d
commit 9a3fc59ef0
2 changed files with 41 additions and 17 deletions

View file

@ -20,6 +20,7 @@ import { useSelectedRoom } from '../../hooks/router/useSelectedRoom';
import { useClientConfig } from '../../hooks/useClientConfig'; import { useClientConfig } from '../../hooks/useClientConfig';
import { RoomView } from '../../features/room/RoomView'; import { RoomView } from '../../features/room/RoomView';
import { useParams } from 'react-router-dom'; import { useParams } from 'react-router-dom';
import { PowerLevelsContainer } from './PowerLevelsContainer';
interface PersistentCallContainerProps { interface PersistentCallContainerProps {
isVisible: boolean; isVisible: boolean;
@ -31,8 +32,12 @@ export function PersistentCallContainer({ isVisible }: PersistentCallContainerPr
const mx = useMatrixClient(); const mx = useMatrixClient();
const roomId = useSelectedRoom(); const roomId = useSelectedRoom();
const clientConfig = useClientConfig(); const clientConfig = useClientConfig();
// Make a new TSX element for usePowerLevels that falls in line with how they are using it for RoomView
// That way we avoid this lobby issue. We should still be able to plant that new element
// In the same blocks we have?
// If not we need to find some dummy ID to place as the default behavior.
// But the ideal is to avoid this check unless it CAN be applicable
const room = mx.getRoom(roomId); const room = mx.getRoom(roomId);
const powerLevels = usePowerLevels(room ?? null);
logger.info(room); logger.info(room);
@ -153,8 +158,7 @@ export function PersistentCallContainer({ isVisible }: PersistentCallContainerPr
overflowY: 'auto', overflowY: 'auto',
}} }}
> >
<RouteSpaceProvider> <PowerLevelsContainer>
<SpaceRouteRoomProvider>
<PageRoot <PageRoot
nav={ nav={
<MobileFriendlyPageNav path={SPACE_PATH}> <MobileFriendlyPageNav path={SPACE_PATH}>
@ -162,8 +166,7 @@ export function PersistentCallContainer({ isVisible }: PersistentCallContainerPr
</MobileFriendlyPageNav> </MobileFriendlyPageNav>
} }
/> />
</SpaceRouteRoomProvider> </PowerLevelsContainer>
</RouteSpaceProvider>
</Box> </Box>
)} )}
@ -173,13 +176,9 @@ export function PersistentCallContainer({ isVisible }: PersistentCallContainerPr
> >
{activeCallRoomId && roomId && ( {activeCallRoomId && roomId && (
<Box direction="Column" style={{ width: '100%' }}> <Box direction="Column" style={{ width: '100%' }}>
<PowerLevelsContextProvider value={powerLevels}> <PowerLevelsContainer>
<RouteSpaceProvider>
<SpaceRouteRoomProvider>
<RoomViewHeader /> <RoomViewHeader />
</SpaceRouteRoomProvider> </PowerLevelsContainer>
</RouteSpaceProvider>
</PowerLevelsContextProvider>
</Box> </Box>
)} )}
<Box grow="Yes" style={{ position: 'relative' }}> <Box grow="Yes" style={{ position: 'relative' }}>
@ -202,13 +201,9 @@ export function PersistentCallContainer({ isVisible }: PersistentCallContainerPr
</Box> </Box>
<Box direction="Column" style={{ position: 'relative' }}> <Box direction="Column" style={{ position: 'relative' }}>
{activeCallRoomId && roomId !== null && ( {activeCallRoomId && roomId !== null && (
<PowerLevelsContextProvider value={powerLevels}> <PowerLevelsContainer>
<RouteSpaceProvider>
<SpaceRouteRoomProvider>
<RoomView room={room} eventId={eventId} /> <RoomView room={room} eventId={eventId} />
</SpaceRouteRoomProvider> </PowerLevelsContainer>
</RouteSpaceProvider>
</PowerLevelsContextProvider>
)} )}
</Box> </Box>
</Box> </Box>

View file

@ -0,0 +1,29 @@
import React, { ReactNode } from "react";
import { useSelectedRoom } from "../../hooks/router/useSelectedRoom";
import { useMatrixClient } from "../../hooks/useMatrixClient";
import { PowerLevelsContextProvider, usePowerLevels } from "../../hooks/usePowerLevels";
import { RouteSpaceProvider, SpaceRouteRoomProvider } from "../client/space";
type PowerLevelsContainerProps = {
children: ReactNode;
};
export function PowerLevelsContainer({ children }: PowerLevelsContainerProps) {
const mx = useMatrixClient();
const roomId = useSelectedRoom();
const room = mx.getRoom(roomId);
const powerLevels = usePowerLevels(room ?? null);
return (
<PowerLevelsContextProvider value={powerLevels}>
<RouteSpaceProvider>
<SpaceRouteRoomProvider>
{ children }
</SpaceRouteRoomProvider>
</RouteSpaceProvider>
</PowerLevelsContextProvider>
);
}