diff --git a/src/frontend/src/features/rooms/livekit/components/controls/SelectToggleDevice.tsx b/src/frontend/src/features/rooms/livekit/components/controls/SelectToggleDevice.tsx
index 09bf0cc..c7bb0e6 100644
--- a/src/frontend/src/features/rooms/livekit/components/controls/SelectToggleDevice.tsx
+++ b/src/frontend/src/features/rooms/livekit/components/controls/SelectToggleDevice.tsx
@@ -32,6 +32,7 @@ export type SelectToggleDeviceConfig = {
iconOn: RemixiconComponentType
iconOff: RemixiconComponentType
shortcut?: Shortcut
+ longPress?: Shortcut
}
type SelectToggleDeviceConfigMap = {
@@ -47,6 +48,9 @@ const selectToggleDeviceConfig: SelectToggleDeviceConfigMap = {
key: 'd',
ctrlKey: true,
},
+ longPress: {
+ key: 'Space',
+ },
},
[Track.Source.Camera]: {
kind: 'videoinput',
diff --git a/src/frontend/src/features/rooms/livekit/components/controls/ToggleDevice.tsx b/src/frontend/src/features/rooms/livekit/components/controls/ToggleDevice.tsx
index c8fcc28..b3cde88 100644
--- a/src/frontend/src/features/rooms/livekit/components/controls/ToggleDevice.tsx
+++ b/src/frontend/src/features/rooms/livekit/components/controls/ToggleDevice.tsx
@@ -1,9 +1,12 @@
import { ToggleButton } from '@/primitives'
import { useRegisterKeyboardShortcut } from '@/features/shortcuts/useRegisterKeyboardShortcut'
-import { useMemo } from 'react'
+import { useMemo, useState } from 'react'
import { appendShortcutLabel } from '@/features/shortcuts/utils'
import { useTranslation } from 'react-i18next'
import { SelectToggleDeviceConfig } from './SelectToggleDevice'
+import useLongPress from '@/features/shortcuts/useLongPress'
+import { ActiveSpeaker } from '@/features/rooms/components/ActiveSpeaker'
+import { useIsSpeaking, useLocalParticipant } from '@livekit/components-react'
export type ToggleDeviceProps = {
enabled: boolean
@@ -18,9 +21,23 @@ export const ToggleDevice = ({
}: ToggleDeviceProps) => {
const { t } = useTranslation('rooms', { keyPrefix: 'join' })
- const { kind, shortcut, iconOn, iconOff } = config
+ const { kind, shortcut, iconOn, iconOff, longPress } = config
+
+ const [pushToTalk, setPushToTalk] = useState(false)
+
+ const onKeyDown = () => {
+ if (pushToTalk || enabled) return
+ toggle()
+ setPushToTalk(true)
+ }
+ const onKeyUp = () => {
+ if (!pushToTalk) return
+ toggle()
+ setPushToTalk(false)
+ }
useRegisterKeyboardShortcut({ shortcut, handler: toggle })
+ useLongPress({ keyCode: longPress?.key, onKeyDown, onKeyUp })
const toggleLabel = useMemo(() => {
const label = t(enabled ? 'disable' : 'enable', {
@@ -31,6 +48,13 @@ export const ToggleDevice = ({
const Icon = enabled ? iconOn : iconOff
+ const { localParticipant } = useLocalParticipant()
+ const isSpeaking = useIsSpeaking(localParticipant)
+
+ if (kind === 'audioinput' && pushToTalk) {
+ return
+ }
+
return (