diff --git a/src/frontend/src/features/rooms/livekit/prefabs/VideoConference.tsx b/src/frontend/src/features/rooms/livekit/prefabs/VideoConference.tsx index c0ca4420..954f0857 100644 --- a/src/frontend/src/features/rooms/livekit/prefabs/VideoConference.tsx +++ b/src/frontend/src/features/rooms/livekit/prefabs/VideoConference.tsx @@ -1,6 +1,6 @@ import { isWeb } from '@livekit/components-core' import { Track } from 'livekit-client' -import React, { useCallback, useState } from 'react' +import React, { useState } from 'react' import { ConnectionStateToast, RoomAudioRenderer, @@ -13,9 +13,6 @@ import { ScreenShareErrorModal } from '../components/ScreenShareErrorModal' import { ConnectionObserver } from '../components/ConnectionObserver' import { useRoomPageTitle } from '../hooks/useRoomPageTitle' import { useNoiseReduction } from '../hooks/useNoiseReduction' -import { useRegisterKeyboardShortcut } from '@/features/shortcuts/useRegisterKeyboardShortcut' -import { useSettingsDialog } from '@/features/settings' -import { SettingsDialogExtendedKey } from '@/features/settings/type' import { useVideoResolutionSubscription } from '../hooks/useVideoResolutionSubscription' import { useSyncLiveKitMetadata } from '../hooks/useSyncLiveKitMetadata' import { SettingsDialogProvider } from '@/features/settings/components/SettingsDialogProvider' @@ -54,19 +51,9 @@ export interface VideoConferenceProps extends React.HTMLAttributes { - toggleSettingsDialog(SettingsDialogExtendedKey.SHORTCUTS) - }, [toggleSettingsDialog]), - }) - useNoiseReduction() const { isOpen: isPictureInPictureOpen } = usePictureInPicture() diff --git a/src/frontend/src/features/settings/components/SettingsDialogProvider.tsx b/src/frontend/src/features/settings/components/SettingsDialogProvider.tsx index e034d305..9b9a8769 100644 --- a/src/frontend/src/features/settings/components/SettingsDialogProvider.tsx +++ b/src/frontend/src/features/settings/components/SettingsDialogProvider.tsx @@ -1,10 +1,25 @@ import { SettingsDialogExtended } from './SettingsDialogExtended' import { useSnapshot } from 'valtio' import { settingsStore } from '@/stores/settings' +import { + SettingsDialogExtendedKey, + useSettingsDialog, +} from '@/features/settings' +import { useRegisterKeyboardShortcut } from '@/features/shortcuts/useRegisterKeyboardShortcut' +import { useCallback } from 'react' export const SettingsDialogProvider = () => { const { areSettingsOpen, defaultSelectedTab } = useSnapshot(settingsStore) + const { toggleSettingsDialog } = useSettingsDialog() + + useRegisterKeyboardShortcut({ + id: 'open-shortcuts', + handler: useCallback(() => { + toggleSettingsDialog(SettingsDialogExtendedKey.SHORTCUTS) + }, [toggleSettingsDialog]), + }) + return (