wip add useUsernameParam to allow passing username through query params

src/frontend/src/features/rooms/components/Conference.tsx

@@ -17,6 +17,7 @@ import posthog from 'posthog-js'
 import { css } from '@/styled-system/css'
 import { LocalUserChoices } from '../routes/Room'
 import { BackgroundProcessorFactory } from '../livekit/components/blur'
+import { useUsernameParam } from '@/features/rooms/hooks/useUsernameParam.ts'
 
 export const Conference = ({
   roomId,
@@ -29,6 +30,8 @@ export const Conference = ({
   mode?: 'join' | 'create'
   initialRoomData?: ApiRoom
 }) => {
+  const username = useUsernameParam()
+
   useEffect(() => {
     posthog.capture('visit-room', { slug: roomId })
   }, [roomId])
@@ -56,7 +59,7 @@ export const Conference = ({
     queryFn: () =>
       fetchRoom({
         roomId: roomId as string,
-        username: userConfig.username,
+        username: username != null ? username : userConfig.username,
       }).catch((error) => {
         if (error.statusCode == '404') {
           createRoom({ slug: roomId, username: userConfig.username })

src/frontend/src/features/rooms/hooks/useSkipPreJoinParam.ts

@@ -0,0 +1,7 @@
+import { useSearch } from 'wouter'
+
+export const useSkipPreJoinParam = () => {
+  const search = useSearch()
+  const params = new URLSearchParams(search)
+  return params.get('skipPreJoin') === 'True'
+}

src/frontend/src/features/rooms/hooks/useUsernameParam.ts

@@ -0,0 +1,7 @@
+import { useSearch } from 'wouter'
+
+export const useUsernameParam = () => {
+  const search = useSearch()
+  const params = new URLSearchParams(search)
+  return params.get('username')
+}

src/frontend/src/features/rooms/livekit/components/controls/ChatToggle.tsx

@@ -6,6 +6,7 @@ import { ToggleButton } from '@/primitives'
 import { chatStore } from '@/stores/chat'
 import { useSidePanel } from '../../hooks/useSidePanel'
 import { ToggleButtonProps } from '@/primitives/ToggleButton'
+import { useRegisterKeyboardShortcut } from '@/features/shortcuts/useRegisterKeyboardShortcut'
 
 export const ChatToggle = ({
   onPress,
@@ -18,6 +19,12 @@ export const ChatToggle = ({
   const { isChatOpen, toggleChat } = useSidePanel()
   const tooltipLabel = isChatOpen ? 'open' : 'closed'
 
+  const shortcut = {
+    key: 'c',
+    ctrlKey: true,
+  }
+  useRegisterKeyboardShortcut({ shortcut, handler: toggleChat })
+
   return (
     <div
       className={css({

src/frontend/src/features/rooms/livekit/components/controls/HandToggle.tsx

@@ -9,6 +9,7 @@ import {
   closeLowerHandToasts,
   showLowerHandToast,
 } from '@/features/notifications/utils'
+import { useRegisterKeyboardShortcut } from '@/features/shortcuts/useRegisterKeyboardShortcut'
 
 const SPEAKING_DETECTION_DELAY = 3000
 
@@ -24,6 +25,12 @@ export const HandToggle = () => {
   const speakingTimerRef = useRef<NodeJS.Timeout | null>(null)
   const [hasShownToast, setHasShownToast] = useState(false)
 
+  const shortcut = {
+    key: 'h',
+    ctrlKey: true,
+  }
+  useRegisterKeyboardShortcut({ shortcut, handler: toggleRaisedHand })
+
   const resetToastState = () => {
     setHasShownToast(false)
   }

src/frontend/src/features/rooms/routes/Room.tsx

@@ -14,6 +14,7 @@ import {
   isRoomValid,
   normalizeRoomId,
 } from '@/features/rooms/utils/isRoomValid'
+import { useSkipPreJoinParam } from '@/features/rooms/hooks/useSkipPreJoinParam.ts'
 
 export type LocalUserChoices = LocalUserChoicesLK & {
   processorSerialized?: ProcessorSerialized
@@ -28,7 +29,9 @@ export const Room = () => {
   const [location, setLocation] = useLocation()
   const initialRoomData = history.state?.initialRoomData
   const mode = isLoggedIn && history.state?.create ? 'create' : 'join'
-  const skipJoinScreen = isLoggedIn && mode === 'create'
+
+  const skipPreJoin = useSkipPreJoinParam()
+  const skipJoinScreen = (isLoggedIn && mode === 'create') || skipPreJoin
 
   useKeyboardShortcuts()