Share call link via signal while in call

_locales/en/messages.json

@@ -3690,6 +3690,10 @@
     "messageformat": "Copy call link",
     "description": "Menu item in the in-call info popup for call link calls. The action is to add the call link to the clipboard."
   },
+  "icu:CallingAdhocCallInfo__ShareViaSignal": {
+    "messageformat": "Share call link via Signal",
+    "description": "Menu item in the in-call info popup for call link calls. Clicking the item opens the sharing dialog where you can send the call link to your Signal contacts or groups."
+  },
   "icu:CallingAdhocCallInfo__RemoveClient": {
     "messageformat": "Remove this person from the call",
     "description": "Button in the in-call info popup for call link calls showing all participants. The action is to remove the participant from the call."

ts/components/CallManager.stories.tsx

@@ -113,6 +113,7 @@ const createProps = (storyProps: Partial<PropsType> = {}): PropsType => ({
   setPresenting: action('toggle-presenting'),
   setRendererCanvas: action('set-renderer-canvas'),
   setOutgoingRing: action('set-outgoing-ring'),
+  showShareCallLinkViaSignal: action('show-share-call-link-via-signal'),
   startCall: action('start-call'),
   stopRingtone: action('stop-ringtone'),
   switchToPresentationView: action('switch-to-presentation-view'),

ts/components/CallManager.tsx

@@ -126,6 +126,10 @@ export type PropsType = {
   setOutgoingRing: (_: boolean) => void;
   setPresenting: (_?: PresentedSource) => void;
   setRendererCanvas: (_: SetRendererCanvasType) => void;
+  showShareCallLinkViaSignal: (
+    callLink: CallLinkType,
+    i18n: LocalizerType
+  ) => void;
   stopRingtone: () => unknown;
   switchToPresentationView: () => void;
   switchFromPresentationView: () => void;
@@ -184,6 +188,7 @@ function ActiveCallManager({
   setPresenting,
   setRendererCanvas,
   setOutgoingRing,
+  showShareCallLinkViaSignal,
   startCall,
   switchToPresentationView,
   switchFromPresentationView,
@@ -267,6 +272,15 @@ function ActiveCallManager({
     }
   }, [callLink]);
 
+  const handleShareCallLinkViaSignal = useCallback(() => {
+    if (!callLink) {
+      log.error('Missing call link');
+      return;
+    }
+
+    showShareCallLinkViaSignal(callLink, i18n);
+  }, [callLink, i18n, showShareCallLinkViaSignal]);
+
   let isCallFull: boolean;
   let showCallLobby: boolean;
   let groupMembers:
@@ -379,6 +393,7 @@ function ActiveCallManager({
               participants={peekedParticipants}
               onClose={toggleParticipants}
               onCopyCallLink={onCopyCallLink}
+              onShareCallLinkViaSignal={handleShareCallLinkViaSignal}
               removeClient={removeClient}
             />
           ) : (
@@ -472,6 +487,7 @@ function ActiveCallManager({
             participants={groupCallParticipantsForParticipantsList}
             onClose={toggleParticipants}
             onCopyCallLink={onCopyCallLink}
+            onShareCallLinkViaSignal={handleShareCallLinkViaSignal}
             removeClient={removeClient}
           />
         ) : (
@@ -527,6 +543,7 @@ export function CallManager({
   setOutgoingRing,
   setPresenting,
   setRendererCanvas,
+  showShareCallLinkViaSignal,
   startCall,
   stopRingtone,
   switchFromPresentationView,
@@ -616,6 +633,7 @@ export function CallManager({
           setOutgoingRing={setOutgoingRing}
           setPresenting={setPresenting}
           setRendererCanvas={setRendererCanvas}
+          showShareCallLinkViaSignal={showShareCallLinkViaSignal}
           startCall={startCall}
           switchFromPresentationView={switchFromPresentationView}
           switchToPresentationView={switchToPresentationView}

ts/components/CallingAdhocCallInfo.stories.tsx

@@ -66,6 +66,7 @@ const createProps = (overrideProps: Partial<PropsType> = {}): PropsType => ({
   participants: overrideProps.participants || [],
   onClose: action('on-close'),
   onCopyCallLink: action('on-copy-call-link'),
+  onShareCallLinkViaSignal: action('on-share-call-link-via-signal'),
   removeClient: overrideProps.removeClient || action('remove-client'),
 });
 

ts/components/CallingAdhocCallInfo.tsx

@@ -39,6 +39,7 @@ export type PropsType = {
   readonly participants: Array<ParticipantType>;
   readonly onClose: () => void;
   readonly onCopyCallLink: () => void;
+  readonly onShareCallLinkViaSignal: () => void;
   readonly removeClient: ((payload: RemoveClientType) => void) | null;
 };
 
@@ -142,6 +143,7 @@ export function CallingAdhocCallInfo({
   participants,
   onClose,
   onCopyCallLink,
+  onShareCallLinkViaSignal,
   removeClient,
 }: PropsType): JSX.Element | null {
   const [isUnknownContactDialogVisible, setIsUnknownContactDialogVisible] =
@@ -150,6 +152,10 @@ export function CallingAdhocCallInfo({
     () => setIsUnknownContactDialogVisible(false),
     [setIsUnknownContactDialogVisible]
   );
+  const onClickShareCallLinkViaSignal = React.useCallback(() => {
+    onClose();
+    onShareCallLinkViaSignal();
+  }, [onClose, onShareCallLinkViaSignal]);
 
   const [knownParticipants, unknownParticipants] = React.useMemo<
     [Array<ParticipantType>, Array<ParticipantType>]
@@ -323,6 +329,16 @@ export function CallingAdhocCallInfo({
                 {i18n('icu:CallingAdhocCallInfo__CopyLink')}
               </span>
             </button>
+            <button
+              className="CallingAdhocCallInfo__MenuItem"
+              onClick={onClickShareCallLinkViaSignal}
+              type="button"
+            >
+              <span className="CallingAdhocCallInfo__MenuItemIcon CallingAdhocCallInfo__MenuItemIcon--share-via-signal" />
+              <span className="CallingAdhocCallInfo__MenuItemText">
+                {i18n('icu:CallingAdhocCallInfo__ShareViaSignal')}
+              </span>
+            </button>
           </div>
         </div>
       </ModalHost>

ts/components/ForwardMessagesModal.stories.tsx

@@ -52,6 +52,7 @@ const useProps = (overrideProps: Partial<PropsType> = {}): PropsType => ({
   doForwardMessages: action('doForwardMessages'),
   getPreferredBadge: () => undefined,
   i18n,
+  isInFullScreenCall: false,
   linkPreviewForSource: () => undefined,
   onClose: action('onClose'),
   onChange: action('onChange'),

ts/components/ForwardMessagesModal.tsx

@@ -43,6 +43,7 @@ import {
   type MessageForwardDraft,
 } from '../types/ForwardDraft';
 import { missingCaseError } from '../util/missingCaseError';
+import { Theme } from '../util/theme';
 
 export enum ForwardMessagesModalType {
   Forward,
@@ -58,6 +59,7 @@ export type DataPropsType = {
   drafts: ReadonlyArray<MessageForwardDraft>;
   getPreferredBadge: PreferredBadgeSelectorType;
   i18n: LocalizerType;
+  isInFullScreenCall: boolean;
 
   linkPreviewForSource: (
     source: LinkPreviewSourceType
@@ -90,6 +92,7 @@ export function ForwardMessagesModal({
   linkPreviewForSource,
   getPreferredBadge,
   i18n,
+  isInFullScreenCall,
   onClose,
   onChange,
   removeLinkPreview,
@@ -309,6 +312,8 @@ export function ForwardMessagesModal({
     throw missingCaseError(type);
   }
 
+  const modalTheme = isInFullScreenCall ? Theme.Dark : undefined;
+
   return (
     <>
       {cannotMessage && (
@@ -329,7 +334,8 @@ export function ForwardMessagesModal({
         onBackButtonClick={isEditingMessage ? handleBackOrClose : undefined}
         moduleClassName="module-ForwardMessageModal"
         title={title}
-        useFocusTrap={false}
+        theme={modalTheme}
+        useFocusTrap={isInFullScreenCall}
         padded={false}
         modalFooter={footer}
         noMouseClose

ts/state/smart/CallManager.tsx

@@ -55,6 +55,7 @@ import { SmartCallingDeviceSelection } from './CallingDeviceSelection';
 import { renderEmojiPicker } from './renderEmojiPicker';
 import { renderReactionPicker } from './renderReactionPicker';
 import { isSharingPhoneNumberWithEverybody as getIsSharingPhoneNumberWithEverybody } from '../../util/phoneNumberSharingMode';
+import { useGlobalModalActions } from '../ducks/globalModals';
 
 function renderDeviceSelection(): JSX.Element {
   return <SmartCallingDeviceSelection />;
@@ -454,6 +455,7 @@ export const SmartCallManager = memo(function SmartCallManager() {
     toggleSettings,
   } = useCallingActions();
   const { pauseVoiceNotePlayer } = useAudioPlayerActions();
+  const { showShareCallLinkViaSignal } = useGlobalModalActions();
 
   return (
     <CallManager
@@ -499,6 +501,7 @@ export const SmartCallManager = memo(function SmartCallManager() {
       setOutgoingRing={setOutgoingRing}
       setPresenting={setPresenting}
       setRendererCanvas={setRendererCanvas}
+      showShareCallLinkViaSignal={showShareCallLinkViaSignal}
       startCall={startCall}
       stopRingtone={stopRingtone}
       switchFromPresentationView={switchFromPresentationView}

ts/state/smart/ForwardMessagesModal.tsx

@@ -11,6 +11,7 @@ import * as Errors from '../../types/errors';
 import { getAllComposableConversations } from '../selectors/conversations';
 import { getIntl, getTheme, getRegionCode } from '../selectors/user';
 import { getLinkPreview } from '../selectors/linkPreviews';
+import { isInFullScreenCall as getIsInFullScreenCall } from '../selectors/calling';
 import { getPreferredBadgeSelector } from '../selectors/badges';
 import { maybeForwardMessages } from '../../util/maybeForwardMessages';
 import {
@@ -57,17 +58,19 @@ function SmartForwardMessagesModalInner({
 }: {
   forwardMessagesProps: ForwardMessagesPropsType;
 }): JSX.Element | null {
+  const { type } = forwardMessagesProps;
+
   const candidateConversations = useSelector(getAllComposableConversations);
   const getPreferredBadge = useSelector(getPreferredBadgeSelector);
   const i18n = useSelector(getIntl);
   const linkPreviewForSource = useSelector(getLinkPreview);
   const regionCode = useSelector(getRegionCode);
   const theme = useSelector(getTheme);
+  const isInFullScreenCall = useSelector(getIsInFullScreenCall);
 
   const { removeLinkPreview } = useLinkPreviewActions();
   const { toggleForwardMessagesModal } = useGlobalModalActions();
   const { showToast } = useToastActions();
-  const { type } = forwardMessagesProps;
 
   const [drafts, setDrafts] = useState<ReadonlyArray<MessageForwardDraft>>(
     () => {
@@ -153,6 +156,7 @@ function SmartForwardMessagesModalInner({
       linkPreviewForSource={linkPreviewForSource}
       getPreferredBadge={getPreferredBadge}
       i18n={i18n}
+      isInFullScreenCall={isInFullScreenCall}
       onClose={closeModal}
       onChange={handleChange}
       regionCode={regionCode}