PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Extract place call logic to its own file (#11494)

Browse source 
* Extract place call logic to its own file

* Simplify makeCall by not using useCallback

* lint fix
This commit is contained in:
Germain 2023-08-31 14:27:15 +01:00 committed by GitHub
parent c7b0850ffe
commit 77a468f8e8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 65 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
src/components/views/rooms/RoomHeader.tsx
View file

@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React, { useCallback, useEffect, useMemo, useState } from "react";
import React, { useEffect, useMemo, useState } from "react";
import { Body as BodyText, IconButton, Tooltip } from "@vector-im/compound-web";
import { Icon as VideoCallIcon } from "@vector-im/compound-design-tokens/icons/video-call.svg";
import { Icon as VoiceCallIcon } from "@vector-im/compound-design-tokens/icons/voice-call.svg";
@ -37,15 +37,12 @@ import { _t, getCurrentLanguage } from "../../../languageHandler";
import { Flex } from "../../utils/Flex";
import { Box } from "../../utils/Box";
import { useRoomCallStatus } from "../../../hooks/room/useRoomCallStatus";
import LegacyCallHandler from "../../../LegacyCallHandler";
import defaultDispatcher from "../../../dispatcher/dispatcher";
import { ViewRoomPayload } from "../../../dispatcher/payloads/ViewRoomPayload";
import { Action } from "../../../dispatcher/actions";
import { useRoomThreadNotifications } from "../../../hooks/room/useRoomThreadNotifications";
import { NotificationColor } from "../../../stores/notifications/NotificationColor";
import { useGlobalNotificationState } from "../../../hooks/useGlobalNotificationState";
import SdkConfig from "../../../SdkConfig";
import { useFeatureEnabled } from "../../../hooks/useSettings";
import { placeCall } from "../../../utils/room/placeCall";
import { useEncryptionStatus } from "../../../hooks/useEncryptionStatus";
import { E2EStatus } from "../../../utils/ShieldUtils";
import FacePile from "../elements/FacePile";
@ -94,34 +91,6 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element {
return SdkConfig.get("element_call").use_exclusively && groupCallsEnabled;
}, [groupCallsEnabled]);
const placeCall = useCallback(
async (callType: CallType, platformCallType: typeof voiceCallType) => {
switch (platformCallType) {
case "legacy_or_jitsi":
await LegacyCallHandler.instance.placeCall(room.roomId, callType);
break;
// TODO: Remove the jitsi_or_element_call case and
// use the commented code below
case "element_call":
case "jitsi_or_element_call":
defaultDispatcher.dispatch<ViewRoomPayload>({
action: Action.ViewRoom,
room_id: room.roomId,
view_call: true,
metricsTrigger: undefined,
});
break;
// case "jitsi_or_element_call":
// TODO: Open dropdown menu to choice between
// EC and Jitsi. Waiting on Compound's dropdown
// component
// break;
}
},
[room.roomId],
);
const threadNotifications = useRoomThreadNotifications(room);
const globalNotificationState = useGlobalNotificationState();
@ -193,8 +162,8 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element {
<IconButton
disabled={!!voiceCallDisabledReason}
title={!voiceCallDisabledReason ? _t("Voice call") : voiceCallDisabledReason!}
onClick={async () => {
placeCall(CallType.Voice, voiceCallType);
onClick={() => {
placeCall(room, CallType.Voice, voiceCallType);
}}
>
<VoiceCallIcon />
@ -204,7 +173,7 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element {
disabled={!!videoCallDisabledReason}
title={!videoCallDisabledReason ? _t("Video call") : videoCallDisabledReason!}
onClick={() => {
placeCall(CallType.Video, videoCallType);
placeCall(room, CallType.Video, videoCallType);
}}
>
<VideoCallIcon />

10
src/hooks/room/useRoomCallStatus.ts
View file

@ -28,7 +28,7 @@ import { _t } from "../../languageHandler";
import { useRoomMemberCount } from "../useRoomMembers";
import { ElementCall } from "../../models/Call";
type CallType = "element_call" | "jitsi_or_element_call" | "legacy_or_jitsi";
export type PlatformCallType = "element_call" | "jitsi_or_element_call" | "legacy_or_jitsi";
const DEFAULT_DISABLED_REASON = null;
const DEFAULT_CALL_TYPE = "jitsi_or_element_call";
@ -42,14 +42,14 @@ export const useRoomCallStatus = (
room: Room,
): {
voiceCallDisabledReason: string | null;
voiceCallType: CallType;
voiceCallType: PlatformCallType;
videoCallDisabledReason: string | null;
videoCallType: CallType;
videoCallType: PlatformCallType;
} => {
const [voiceCallDisabledReason, setVoiceCallDisabledReason] = useState<string | null>(DEFAULT_DISABLED_REASON);
const [videoCallDisabledReason, setVideoCallDisabledReason] = useState<string | null>(DEFAULT_DISABLED_REASON);
const [voiceCallType, setVoiceCallType] = useState<CallType>(DEFAULT_CALL_TYPE);
const [videoCallType, setVideoCallType] = useState<CallType>(DEFAULT_CALL_TYPE);
const [voiceCallType, setVoiceCallType] = useState<PlatformCallType>(DEFAULT_CALL_TYPE);
const [videoCallType, setVideoCallType] = useState<PlatformCallType>(DEFAULT_CALL_TYPE);
const groupCallsEnabled = useFeatureEnabled("feature_group_calls");
const useElementCallExclusively = useMemo(() => {

55
src/utils/room/placeCall.ts Normal file
View file

@ -0,0 +1,55 @@
/*
Copyright 2023 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 { CallType } from "matrix-js-sdk/src/webrtc/call";
import { Room } from "matrix-js-sdk/src/matrix";
import LegacyCallHandler from "../../LegacyCallHandler";
import { PlatformCallType } from "../../hooks/room/useRoomCallStatus";
import defaultDispatcher from "../../dispatcher/dispatcher";
import { ViewRoomPayload } from "../../dispatcher/payloads/ViewRoomPayload";
import { Action } from "../../dispatcher/actions";
/**
* Helper to place a call in a room that works with all the legacy modes
* @param room the room to place the call in
* @param callType the type of call
* @param platformCallType the platform to pass the call on
*/
export const placeCall = async (room: Room, callType: CallType, platformCallType: PlatformCallType): Promise<void> => {
switch (platformCallType) {
case "legacy_or_jitsi":
await LegacyCallHandler.instance.placeCall(room.roomId, callType);
break;
// TODO: Remove the jitsi_or_element_call case and
// use the commented code below
case "element_call":
case "jitsi_or_element_call":
defaultDispatcher.dispatch<ViewRoomPayload>({
action: Action.ViewRoom,
room_id: room.roomId,
view_call: true,
metricsTrigger: undefined,
});
break;
// case "jitsi_or_element_call":
// TODO: Open dropdown menu to choice between
// EC and Jitsi. Waiting on Compound's dropdown
// component
// break;
}
};