diff --git a/_locales/en/messages.json b/_locales/en/messages.json index b629bfaf1..ae6fa061f 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -3563,9 +3563,17 @@ "description": "Shown in a group call lobby when call ringing is enabled, then the user disables ringing using the Ringing toggle button." }, "icu:CallControls__RaiseHandsToast--you": { - "messageformat": "Your hand is raised.", + "messageformat": "You raised a hand.", "description": "Shown in a call when the user raises their hand." }, + "icu:CallControls__RaiseHandsToast--you-and-one": { + "messageformat": "You and {otherName} raised a hand.", + "description": "Shown in a call when the user and one other person raise their hands." + }, + "icu:CallControls__RaiseHandsToast--you-and-more": { + "messageformat": "You, {otherName}, and {overflowCount, plural, one {#} other {#}} more raised a hand.", + "description": "Shown in a call when the user and 2 or more other persons raise their hands." + }, "icu:CallControls__RaiseHandsToast--one": { "messageformat": "{name} raised a hand.", "description": "Shown in a call when someone else raises their hand." diff --git a/ts/components/CallScreen.tsx b/ts/components/CallScreen.tsx index 7ab1d4fc1..9532f12a1 100644 --- a/ts/components/CallScreen.tsx +++ b/ts/components/CallScreen.tsx @@ -3,7 +3,7 @@ import type { ReactNode } from 'react'; import React, { useState, useRef, useEffect, useCallback } from 'react'; -import { isEqual, noop, sortBy } from 'lodash'; +import { isEqual, noop } from 'lodash'; import classNames from 'classnames'; import type { VideoFrameSource } from '@signalapp/ringrtc'; import type { @@ -553,24 +553,34 @@ export function CallScreen({ } const renderRaisedHandsToast = React.useCallback( - (hands: Array) => { - // Sort "You" to the front. - const names = sortBy(hands, demuxId => - demuxId === localDemuxId ? 0 : 1 - ).map(demuxId => - demuxId === localDemuxId - ? i18n('icu:you') - : conversationsByDemuxId.get(demuxId)?.title - ); + (demuxIds: Array) => { + const names: Array = []; + let isYourHandRaised = false; + for (const demuxId of demuxIds) { + if (demuxId === localDemuxId) { + isYourHandRaised = true; + continue; + } + + const handConversation = conversationsByDemuxId.get(demuxId); + if (!handConversation) { + continue; + } + + names.push(handConversation.title); + } + + const count = names.length; + const name = names[0] ?? ''; + const otherName = names[1] ?? ''; let message: string; let buttonOverride: JSX.Element | undefined; - const count = names.length; switch (count) { case 0: return undefined; case 1: - if (names[0] === i18n('icu:you')) { + if (isYourHandRaised) { message = i18n('icu:CallControls__RaiseHandsToast--you'); buttonOverride = (