diff --git a/app/custom/VideoConferenceClientImpl.tsx b/app/custom/VideoConferenceClientImpl.tsx
index baa6872..b00fa17 100644
--- a/app/custom/VideoConferenceClientImpl.tsx
+++ b/app/custom/VideoConferenceClientImpl.tsx
@@ -13,6 +13,7 @@ import {
import { DebugMode } from '@/lib/Debug';
import { useEffect, useMemo } from 'react';
import { decodePassphrase } from '@/lib/client-utils';
+import { KeyboardShortcuts } from '@/lib/KeyboardShortcuts';
import { SettingsMenu } from '@/lib/SettingsMenu';
export function VideoConferenceClientImpl(props: {
@@ -69,6 +70,7 @@ export function VideoConferenceClientImpl(props: {
return (
+
+
(
diff --git a/lib/KeyboardShortcuts.tsx b/lib/KeyboardShortcuts.tsx
new file mode 100644
index 0000000..5a0c659
--- /dev/null
+++ b/lib/KeyboardShortcuts.tsx
@@ -0,0 +1,31 @@
+'use client';
+
+import React from 'react';
+import { Track } from 'livekit-client';
+import { useTrackToggle } from '@livekit/components-react';
+
+export function KeyboardShortcuts() {
+ const { toggle: toggleMic } = useTrackToggle({ source: Track.Source.Microphone });
+ const { toggle: toggleCamera } = useTrackToggle({ source: Track.Source.Camera });
+
+ React.useEffect(() => {
+ function handleShortcut(event: KeyboardEvent) {
+ // Toggle microphone: Cmd/Ctrl-Shift-A
+ if (toggleMic && event.key === 'A' && (event.ctrlKey || event.metaKey)) {
+ event.preventDefault();
+ toggleMic();
+ }
+
+ // Toggle camera: Cmd/Ctrl-Shift-V
+ if (event.key === 'V' && (event.ctrlKey || event.metaKey)) {
+ event.preventDefault();
+ toggleCamera();
+ }
+ }
+
+ window.addEventListener('keydown', handleShortcut);
+ return () => window.removeEventListener('keydown', handleShortcut);
+ }, [toggleMic, toggleCamera]);
+
+ return null;
+}
diff --git a/package.json b/package.json
index 07084fe..b032c61 100644
--- a/package.json
+++ b/package.json
@@ -6,7 +6,10 @@
"dev": "next dev",
"build": "next build",
"start": "next start",
- "lint": "next lint"
+ "lint": "next lint",
+ "lint:fix": "next lint --fix",
+ "format:check": "prettier --check \"**/*.{ts,tsx,md,json}\"",
+ "format:write": "prettier --write \"**/*.{ts,tsx,md,json}\""
},
"dependencies": {
"@datadog/browser-logs": "^5.23.3",