diff --git a/src/frontend/src/features/rooms/livekit/components/controls/HandToggle.tsx b/src/frontend/src/features/rooms/livekit/components/controls/HandToggle.tsx new file mode 100644 index 00000000..92bd3cb5 --- /dev/null +++ b/src/frontend/src/features/rooms/livekit/components/controls/HandToggle.tsx @@ -0,0 +1,46 @@ +import { useTranslation } from 'react-i18next' +import { RiHand } from '@remixicon/react' +import { ToggleButton } from '@/primitives' +import { css } from '@/styled-system/css' +import { + useLocalParticipant, + useParticipantInfo, +} from '@livekit/components-react' + +export const HandToggle = () => { + const { t } = useTranslation('rooms') + + const localParticipant = useLocalParticipant().localParticipant + const { metadata } = useParticipantInfo({ participant: localParticipant }) + + const parsedMetadata = JSON.parse(metadata || '{}') + + const sendRaise = () => { + parsedMetadata.raised = !parsedMetadata.raised + localParticipant.setMetadata(JSON.stringify(parsedMetadata)) + } + + const label = parsedMetadata.raised + ? t('controls.hand.lower') + : t('controls.hand.raise') + + return ( +
+ sendRaise()} + > + + +
+ ) +} diff --git a/src/frontend/src/features/rooms/livekit/prefabs/ControlBar.tsx b/src/frontend/src/features/rooms/livekit/prefabs/ControlBar.tsx index 6361eef8..6fe0b89d 100644 --- a/src/frontend/src/features/rooms/livekit/prefabs/ControlBar.tsx +++ b/src/frontend/src/features/rooms/livekit/prefabs/ControlBar.tsx @@ -19,6 +19,7 @@ import { useTranslation } from 'react-i18next' import { OptionsButton } from '../components/controls/Options/OptionsButton' import { ParticipantsToggle } from '@/features/rooms/livekit/components/controls/Participants/ParticipantsToggle' import { ChatToggle } from '@/features/rooms/livekit/components/controls/ChatToggle' +import { HandToggle } from '@/features/rooms/livekit/components/controls/HandToggle' /** @public */ export type ControlBarControls = { @@ -183,6 +184,7 @@ export function ControlBar({ )} )} + diff --git a/src/frontend/src/locales/de/rooms.json b/src/frontend/src/locales/de/rooms.json index 7e6a3b1b..40a49cfc 100644 --- a/src/frontend/src/locales/de/rooms.json +++ b/src/frontend/src/locales/de/rooms.json @@ -32,6 +32,10 @@ "open": "", "closed": "" }, + "hand": { + "raise": "", + "lower": "" + }, "leave": "", "participants": { "open": "", diff --git a/src/frontend/src/locales/en/rooms.json b/src/frontend/src/locales/en/rooms.json index 42f44adb..ab668143 100644 --- a/src/frontend/src/locales/en/rooms.json +++ b/src/frontend/src/locales/en/rooms.json @@ -32,6 +32,10 @@ "open": "Close the chat", "closed": "Open the chat" }, + "hand": { + "raise": "Raise hand", + "lower": "Lower hand" + }, "leave": "Leave", "participants": { "open": "Hide everyone", diff --git a/src/frontend/src/locales/fr/rooms.json b/src/frontend/src/locales/fr/rooms.json index 14a44e67..0e719b68 100644 --- a/src/frontend/src/locales/fr/rooms.json +++ b/src/frontend/src/locales/fr/rooms.json @@ -32,6 +32,10 @@ "open": "Masquer le chat", "closed": "Afficher le chat" }, + "hand": { + "raise": "Lever la main", + "lower": "Baisser la main" + }, "leave": "Quitter", "participants": { "open": "Masquer les participants",