Prepare for Element Call integration (#9224)

* Improve accessibility and testability of Tooltip

Adding a role to Tooltip was motivated by React Testing Library's
reliance on accessibility-related attributes to locate elements.

* Make the ReadyWatchingStore constructor safer

The ReadyWatchingStore constructor previously had a chance to
immediately call onReady, which was dangerous because it was potentially
calling the derived class's onReady at a point when the derived class
hadn't even finished construction yet. In normal usage, I guess this
never was a problem, but it was causing some of the tests I was writing
to crash. This is solved by separating out the onReady call into a start
method.

* Rename 1:1 call components to 'LegacyCall'

to reflect the fact that they're slated for removal, and to not clash
with the new Call code.

* Refactor VideoChannelStore into Call and CallStore

Call is an abstract class that currently only has a Jitsi
implementation, but this will make it easy to later add an Element Call
implementation.

* Remove WidgetReady, ClientReady, and ForceHangupCall hacks

These are no longer used by the new Jitsi call implementation, and can
be removed.

* yarn i18n

* Delete call map entries instead of inserting nulls

* Allow multiple active calls and consolidate call listeners

* Fix a race condition when creating a video room

* Un-hardcode the media device fallback labels

* Apply misc code review fixes

* yarn i18n

* Disconnect from calls more politely on logout

* Fix some strict mode errors

* Fix another updateRoom race condition

src/hooks/useCall.ts

@@ -0,0 +1,46 @@
+/*
+Copyright 2022 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { useState, useCallback } from "react";
+
+import type { RoomMember } from "matrix-js-sdk/src/models/room-member";
+import type { Call, ConnectionState } from "../models/Call";
+import { useTypedEventEmitterState } from "./useEventEmitter";
+import { CallEvent } from "../models/Call";
+import { CallStore, CallStoreEvent } from "../stores/CallStore";
+import { useEventEmitter } from "./useEventEmitter";
+
+export const useCall = (roomId: string): Call | null => {
+    const [call, setCall] = useState(() => CallStore.instance.get(roomId));
+    useEventEmitter(CallStore.instance, CallStoreEvent.Call, (call: Call | null, forRoomId: string) => {
+        if (forRoomId === roomId) setCall(call);
+    });
+    return call;
+};
+
+export const useConnectionState = (call: Call): ConnectionState =>
+    useTypedEventEmitterState(
+        call,
+        CallEvent.ConnectionState,
+        useCallback(state => state ?? call.connectionState, [call]),
+    );
+
+export const useParticipants = (call: Call): Set<RoomMember> =>
+    useTypedEventEmitterState(
+        call,
+        CallEvent.Participants,
+        useCallback(state => state ?? call.participants, [call]),
+    );