diff --git a/src/frontend/src/features/rooms/livekit/api/lowerHandParticipants.ts b/src/frontend/src/features/rooms/livekit/api/lowerHandParticipants.ts new file mode 100644 index 00000000..2568b261 --- /dev/null +++ b/src/frontend/src/features/rooms/livekit/api/lowerHandParticipants.ts @@ -0,0 +1,18 @@ +import { Participant } from 'livekit-client' +import { useLowerHandParticipant } from '@/features/rooms/livekit/api/lowerHandParticipant' + +export const useLowerHandParticipants = () => { + const { lowerHandParticipant } = useLowerHandParticipant() + + const lowerHandParticipants = (participants: Array) => { + try { + const promises = participants.map((participant) => + lowerHandParticipant(participant) + ) + return Promise.all(promises) + } catch (error) { + throw new Error('An error occurred while lowering hands.') + } + } + return { lowerHandParticipants } +} diff --git a/src/frontend/src/features/rooms/livekit/components/controls/Participants/LowerAllHandsButton.tsx b/src/frontend/src/features/rooms/livekit/components/controls/Participants/LowerAllHandsButton.tsx new file mode 100644 index 00000000..79a4ba1a --- /dev/null +++ b/src/frontend/src/features/rooms/livekit/components/controls/Participants/LowerAllHandsButton.tsx @@ -0,0 +1,26 @@ +import { Button } from '@/primitives' +import { useLowerHandParticipants } from '@/features/rooms/livekit/api/lowerHandParticipants' +import { useTranslation } from 'react-i18next' +import { Participant } from 'livekit-client' + +type LowerAllHandsButtonProps = { + participants: Array +} + +export const LowerAllHandsButton = ({ + participants, +}: LowerAllHandsButtonProps) => { + const { lowerHandParticipants } = useLowerHandParticipants() + const { t } = useTranslation('rooms') + return ( + + ) +} diff --git a/src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantsCollapsableList.tsx b/src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantsCollapsableList.tsx index 66373772..46699875 100644 --- a/src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantsCollapsableList.tsx +++ b/src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantsCollapsableList.tsx @@ -50,12 +50,14 @@ type ParticipantsCollapsableListProps = { heading: string participants: Array renderParticipant: (participant: Participant) => JSX.Element + action?: () => JSX.Element } export const ParticipantsCollapsableList = ({ heading, participants, renderParticipant, + action, }: ParticipantsCollapsableListProps) => { const { t } = useTranslation('rooms') const [isOpen, setIsOpen] = useState(true) @@ -98,6 +100,7 @@ export const ParticipantsCollapsableList = ({ {isOpen && ( + {action && action()} {participants.map((participant) => renderParticipant(participant))} )} diff --git a/src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantsList.tsx b/src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantsList.tsx index 16ca082b..02e90f1d 100644 --- a/src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantsList.tsx +++ b/src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantsList.tsx @@ -11,6 +11,7 @@ import { allParticipantRoomEvents } from '@/features/rooms/livekit/constants/eve import { ParticipantListItem } from '@/features/rooms/livekit/components/controls/Participants/ParticipantListItem' import { ParticipantsCollapsableList } from '@/features/rooms/livekit/components/controls/Participants/ParticipantsCollapsableList' import { HandRaisedListItem } from '@/features/rooms/livekit/components/controls/Participants/HandRaisedListItem' +import { LowerAllHandsButton } from '@/features/rooms/livekit/components/controls/Participants/LowerAllHandsButton' // TODO: Optimize rendering performance, especially for longer participant lists, even though they are generally short. export const ParticipantsList = () => { @@ -101,6 +102,9 @@ export const ParticipantsList = () => { renderParticipant={(participant) => ( )} + action={() => ( + + )} /> )} diff --git a/src/frontend/src/locales/de/rooms.json b/src/frontend/src/locales/de/rooms.json index 63fb9487..f9d85d01 100644 --- a/src/frontend/src/locales/de/rooms.json +++ b/src/frontend/src/locales/de/rooms.json @@ -68,6 +68,7 @@ "cancel": "" }, "raisedHands": "", - "lowerParticipantHand": "" + "lowerParticipantHand": "", + "lowerParticipantsHand": "" } } diff --git a/src/frontend/src/locales/en/rooms.json b/src/frontend/src/locales/en/rooms.json index f8bc9039..633a3baf 100644 --- a/src/frontend/src/locales/en/rooms.json +++ b/src/frontend/src/locales/en/rooms.json @@ -68,6 +68,7 @@ "cancel": "Cancel" }, "raisedHands": "Raised hands", - "lowerParticipantHand": "Lower {{name}}'s hand" + "lowerParticipantHand": "Lower {{name}}'s hand", + "lowerParticipantsHand": "Lower all hands" } } diff --git a/src/frontend/src/locales/fr/rooms.json b/src/frontend/src/locales/fr/rooms.json index 27b79e00..29008235 100644 --- a/src/frontend/src/locales/fr/rooms.json +++ b/src/frontend/src/locales/fr/rooms.json @@ -68,6 +68,7 @@ "cancel": "Annuler" }, "raisedHands": "Mains levées", - "lowerParticipantHand": "Baisser la main de {{name}}" + "lowerParticipantHand": "Baisser la main de {{name}}", + "lowerParticipantsHand": "Baisser la main de tous les participants" } }