From 70365c891bfd49dfc99fa8ca172debde3956557a Mon Sep 17 00:00:00 2001 From: Timo <16718859+toger5@users.noreply.github.com> Date: Thu, 7 Mar 2024 16:38:53 +0100 Subject: [PATCH] Call guest access link creation to join calls as a non registered user via the EC SPA (#12259) * Add externall call link button if in public call room Signed-off-by: Timo K * Allow configuring a spa homeserver url. Signed-off-by: Timo K * temp Signed-off-by: Timo K * remove homeserver url Signed-off-by: Timo K * Add custom title to share dialog. So that we can use it as a "share call" dialog. Signed-off-by: Timo K * - rename config options - only show link button if a guest url is provided - share dialog custom Title - rename call share labels Signed-off-by: Timo K * rename to title_link Signed-off-by: Timo K * add tests for ShareDialog Signed-off-by: Timo K * add tests for share call button Signed-off-by: Timo K * review Signed-off-by: Timo K * remove comment Signed-off-by: Timo K * Update src/components/views/dialogs/ShareDialog.tsx Co-authored-by: David Baker --------- Signed-off-by: Timo K Co-authored-by: David Baker --- src/IConfigOptions.ts | 1 + src/components/views/dialogs/ShareDialog.tsx | 34 ++++- src/components/views/rooms/RoomHeader.tsx | 30 +++- src/hooks/room/useRoomCall.ts | 43 +++++- src/i18n/strings/en_EN.json | 4 + .../views/dialogs/ShareDialog-test.tsx | 130 ++++++++++++++++++ .../views/rooms/RoomHeader-test.tsx | 93 +++++++++++++ 7 files changed, 323 insertions(+), 12 deletions(-) create mode 100644 test/components/views/dialogs/ShareDialog-test.tsx diff --git a/src/IConfigOptions.ts b/src/IConfigOptions.ts index 501d8a3bd6..4dc537aab0 100644 --- a/src/IConfigOptions.ts +++ b/src/IConfigOptions.ts @@ -119,6 +119,7 @@ export interface IConfigOptions { }; element_call: { url?: string; + guest_spa_url?: string; use_exclusively?: boolean; participant_limit?: number; brand?: string; diff --git a/src/components/views/dialogs/ShareDialog.tsx b/src/components/views/dialogs/ShareDialog.tsx index aba35e70e2..9e6ee7fc8a 100644 --- a/src/components/views/dialogs/ShareDialog.tsx +++ b/src/components/views/dialogs/ShareDialog.tsx @@ -62,11 +62,28 @@ const socials = [ ]; interface BaseProps { + /** + * A function that is called when the dialog is dismissed + */ onFinished(): void; + /** + * An optional string to use as the dialog title. + * If not provided, an appropriate title for the target type will be used. + */ + customTitle?: string; + /** + * An optional string to use as the dialog subtitle + */ + subtitle?: string; } interface Props extends BaseProps { - target: Room | User | RoomMember; + /** + * The target to link to. + * This can be a Room, User, RoomMember, or MatrixEvent or an already computed URL. + * A matrix.to link will be generated out of it if it's not already a url. + */ + target: Room | User | RoomMember | URL; permalinkCreator?: RoomPermalinkCreator; } @@ -109,7 +126,9 @@ export default class ShareDialog extends React.PureComponent 0) { @@ -146,9 +167,9 @@ export default class ShareDialog extends React.PureComponent + {this.props.subtitle &&

{this.props.subtitle}

}
matrixToUrl}> diff --git a/src/components/views/rooms/RoomHeader.tsx b/src/components/views/rooms/RoomHeader.tsx index 6d1ea9f8eb..8ca26ebcde 100644 --- a/src/components/views/rooms/RoomHeader.tsx +++ b/src/components/views/rooms/RoomHeader.tsx @@ -18,6 +18,7 @@ import React, { useCallback, useEffect, useMemo, useState } from "react"; import { Body as BodyText, Button, IconButton, Menu, MenuItem, Tooltip } from "@vector-im/compound-web"; import { Icon as VideoCallIcon } from "@vector-im/compound-design-tokens/icons/video-call-solid.svg"; import { Icon as VoiceCallIcon } from "@vector-im/compound-design-tokens/icons/voice-call.svg"; +import { Icon as ExternalLinkIcon } from "@vector-im/compound-design-tokens/icons/link.svg"; import { Icon as CloseCallIcon } from "@vector-im/compound-design-tokens/icons/close.svg"; import { Icon as ThreadsIcon } from "@vector-im/compound-design-tokens/icons/threads-solid.svg"; import { Icon as NotificationsIcon } from "@vector-im/compound-design-tokens/icons/notifications-solid.svg"; @@ -26,6 +27,7 @@ import { Icon as ErrorIcon } from "@vector-im/compound-design-tokens/icons/error import { Icon as PublicIcon } from "@vector-im/compound-design-tokens/icons/public.svg"; import { EventType, JoinRule, type Room } from "matrix-js-sdk/src/matrix"; import { ViewRoomOpts } from "@matrix-org/react-sdk-module-api/lib/lifecycles/RoomViewLifecycle"; +import { logger } from "matrix-js-sdk/src/logger"; import { useRoomName } from "../../../hooks/useRoomName"; import { RightPanelPhases } from "../../../stores/right-panel/RightPanelStorePhases"; @@ -54,6 +56,8 @@ import { VideoRoomChatButton } from "./RoomHeader/VideoRoomChatButton"; import { RoomKnocksBar } from "./RoomKnocksBar"; import { isVideoRoom } from "../../../utils/video-rooms"; import { notificationLevelToIndicator } from "../../../utils/notifications"; +import Modal from "../../../Modal"; +import ShareDialog from "../dialogs/ShareDialog"; export default function RoomHeader({ room, @@ -78,6 +82,8 @@ export default function RoomHeader({ videoCallClick, toggleCallMaximized: toggleCall, isViewingCall, + generateCallLink, + canGenerateCallLink, isConnectedToCall, hasActiveCallSession, callOptions, @@ -118,6 +124,20 @@ export default function RoomHeader({ const videoClick = useCallback((ev) => videoCallClick(ev, callOptions[0]), [callOptions, videoCallClick]); + const shareClick = useCallback(() => { + try { + // generateCallLink throws if the permissions are not met + const target = generateCallLink(); + Modal.createDialog(ShareDialog, { + target, + customTitle: _t("share|share_call"), + subtitle: _t("share|share_call_subtitle"), + }); + } catch (e) { + logger.error("Could not generate call link.", e); + } + }, [generateCallLink]); + const toggleCallButton = ( @@ -125,7 +145,13 @@ export default function RoomHeader({ ); - + const createExternalLinkButton = ( + + + + + + ); const joinCallButton = (