Matrix/element-call-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-call.git synced 2026-02-26 05:17:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

Modernize how we use React contexts (#3359)

Browse Source 
* Replace useContext with use

The docs recommend the use hook because it is simpler and allows itself to be called conditionally.

* Simplify our context providers

React 19 lets you omit the '.Provider' bit.
This commit is contained in:
Robin
2025-06-24 04:48:35 -04:00
committed by GitHub
parent a507bcde90
commit 3ffb118dc7
11 changed files with 48 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/room/GroupCallView.test.tsx
View File

@@ -149,7 +149,7 @@ function createGroupCallView(
const { getByText } = render(
<BrowserRouter>
<TooltipProvider>
<MediaDevicesContext.Provider value={mockMediaDevices({})}>
<MediaDevicesContext value={mockMediaDevices({})}>
<ProcessorProvider>
<GroupCallView
client={client}
@@ -164,7 +164,7 @@ function createGroupCallView(
widget={widget}
/>
</ProcessorProvider>
</MediaDevicesContext.Provider>
</MediaDevicesContext>
</TooltipProvider>
</BrowserRouter>,
);

8
src/room/InCallView.test.tsx
View File

@@ -149,13 +149,13 @@ function createInCallView(): RenderResult & {
rtcSession.joined = true;
const renderResult = render(
<BrowserRouter>
<MediaDevicesContext.Provider value={mockMediaDevices({})}>
<MediaDevicesContext value={mockMediaDevices({})}>
<ReactionsSenderProvider
vm={vm}
rtcSession={rtcSession as unknown as MatrixRTCSession}
>
<TooltipProvider>
<RoomContext.Provider value={livekitRoom}>
<RoomContext value={livekitRoom}>
<InCallView
client={client}
hideHeader={true}
@@ -182,10 +182,10 @@ function createInCallView(): RenderResult & {
connState={ConnectionState.Connected}
onShareClick={null}
/>
</RoomContext.Provider>
</RoomContext>
</TooltipProvider>
</ReactionsSenderProvider>
</MediaDevicesContext.Provider>
</MediaDevicesContext>
</BrowserRouter>,
);
return {

4
src/room/InCallView.tsx
View File

@@ -172,7 +172,7 @@ export const ActiveCall: FC<ActiveCallProps> = (props) => {
if (livekitRoom === undefined || vm === null) return null;
return (
<RoomContext.Provider value={livekitRoom}>
<RoomContext value={livekitRoom}>
<ReactionsSenderProvider vm={vm} rtcSession={props.rtcSession}>
<InCallView
{...props}
@@ -181,7 +181,7 @@ export const ActiveCall: FC<ActiveCallProps> = (props) => {
connState={connState}
/>
</ReactionsSenderProvider>
</RoomContext.Provider>
</RoomContext>
);
};

24
src/room/MuteStates.test.tsx
View File

@@ -124,14 +124,14 @@ describe("useMuteStates", () => {
render(
<MemoryRouter>
<MediaDevicesContext.Provider
<MediaDevicesContext
value={mockMediaDevices({
microphone: false,
camera: false,
})}
>
<TestComponent />
</MediaDevicesContext.Provider>
</MediaDevicesContext>
</MemoryRouter>,
);
expect(screen.getByTestId("audio-enabled").textContent).toBe("false");
@@ -143,9 +143,9 @@ describe("useMuteStates", () => {
render(
<MemoryRouter>
<MediaDevicesContext.Provider value={mockMediaDevices()}>
<MediaDevicesContext value={mockMediaDevices()}>
<TestComponent />
</MediaDevicesContext.Provider>
</MediaDevicesContext>
</MemoryRouter>,
);
expect(screen.getByTestId("audio-enabled").textContent).toBe("true");
@@ -159,9 +159,9 @@ describe("useMuteStates", () => {
render(
<MemoryRouter>
<MediaDevicesContext.Provider value={mockMediaDevices()}>
<MediaDevicesContext value={mockMediaDevices()}>
<TestComponent isJoined />
</MediaDevicesContext.Provider>
</MediaDevicesContext>
</MemoryRouter>,
);
expect(screen.getByTestId("audio-enabled").textContent).toBe("false");
@@ -178,9 +178,9 @@ describe("useMuteStates", () => {
render(
<MemoryRouter>
<MediaDevicesContext.Provider value={mockMediaDevices()}>
<MediaDevicesContext value={mockMediaDevices()}>
<TestComponent />
</MediaDevicesContext.Provider>
</MediaDevicesContext>
</MemoryRouter>,
);
expect(screen.getByTestId("audio-enabled").textContent).toBe("false");
@@ -192,9 +192,9 @@ describe("useMuteStates", () => {
render(
<MemoryRouter initialEntries={["/room/?skipLobby=true"]}>
<MediaDevicesContext.Provider value={mockMediaDevices()}>
<MediaDevicesContext value={mockMediaDevices()}>
<TestComponent />
</MediaDevicesContext.Provider>
</MediaDevicesContext>
</MemoryRouter>,
);
expect(screen.getByTestId("audio-enabled").textContent).toBe("false");
@@ -224,13 +224,13 @@ describe("useMuteStates", () => {
return (
<MemoryRouter>
<MediaDevicesContext.Provider value={devices}>
<MediaDevicesContext value={devices}>
<TestComponent />
<button onClick={onConnectDevicesClick}>Connect devices</button>
<button onClick={onDisconnectDevicesClick}>
Disconnect devices
</button>
</MediaDevicesContext.Provider>
</MediaDevicesContext>
</MemoryRouter>
);
};