Show a lobby screen in video rooms (#8287)

* Show a lobby screen in video rooms

* Add connecting state

* Test VideoRoomView

* Test VideoLobby

* Get the local video stream with useAsyncMemo

* Clean up code review nits

* Explicitly state what !important is overriding

* Use spacing variables

* Wait for video channel messaging

* Update join button copy

* Show frame on both the lobby and widget

* Force dark theme for video lobby

* Wait for the widget to be ready

* Make VideoChannelStore constructor private

* Allow video lobby to shrink

* Add invite button to video room header

* Show connected members on lobby screen

* Make avatars in video lobby clickable

* Increase video channel store timeout

* Fix Jitsi Meet getting wedged on startup in Chrome and Safari

* Revert "Fix Jitsi Meet getting wedged on startup in Chrome and Safari"

This reverts commit 9f77b8c227c1a5bffa5d91b0c48bf3bbc44d4cec.

* Disable device buttons while connecting

* Factor RoomFacePile into a separate file

* Fix i18n lint

* Fix switching video channels while connected

* Properly limit number of connected members in face pile

* Fix CSS lint
This commit is contained in:
Robin 2022-04-20 11:03:33 -04:00 committed by GitHub
parent 9a065581e5
commit 6e86a14cc9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
30 changed files with 1338 additions and 267 deletions

View file

@ -15,21 +15,34 @@ limitations under the License.
*/
import { EventEmitter } from "events";
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
import VideoChannelStore, { VideoChannelEvent } from "../../src/stores/VideoChannelStore";
import { mkEvent } from "./test-utils";
import { VIDEO_CHANNEL_MEMBER } from "../../src/utils/VideoChannelUtils";
import VideoChannelStore, { VideoChannelEvent, IJitsiParticipant } from "../../src/stores/VideoChannelStore";
class StubVideoChannelStore extends EventEmitter {
private _roomId: string;
public get roomId(): string { return this._roomId; }
private _connected: boolean;
public get connected(): boolean { return this._connected; }
public get participants(): IJitsiParticipant[] { return []; }
public connect = (roomId: string) => {
public startConnect = (roomId: string) => {
this._roomId = roomId;
this.emit(VideoChannelEvent.Connect);
this.emit(VideoChannelEvent.StartConnect, roomId);
};
public disconnect = () => {
public connect = jest.fn((roomId: string) => {
this._roomId = roomId;
this._connected = true;
this.emit(VideoChannelEvent.Connect, roomId);
});
public disconnect = jest.fn(() => {
const roomId = this._roomId;
this._roomId = null;
this.emit(VideoChannelEvent.Disconnect);
};
this._connected = false;
this.emit(VideoChannelEvent.Disconnect, roomId);
});
}
export const stubVideoChannelStore = (): StubVideoChannelStore => {
@ -37,3 +50,12 @@ export const stubVideoChannelStore = (): StubVideoChannelStore => {
jest.spyOn(VideoChannelStore, "instance", "get").mockReturnValue(store as unknown as VideoChannelStore);
return store;
};
export const mkVideoChannelMember = (userId: string, devices: string[]): MatrixEvent => mkEvent({
event: true,
type: VIDEO_CHANNEL_MEMBER,
room: "!1:example.org",
user: userId,
skey: userId,
content: { devices },
});