diff --git a/src/frontend/src/features/rooms/livekit/hooks/useSidePanel.ts b/src/frontend/src/features/rooms/livekit/hooks/useSidePanel.ts
index 689cf830..831a7049 100644
--- a/src/frontend/src/features/rooms/livekit/hooks/useSidePanel.ts
+++ b/src/frontend/src/features/rooms/livekit/hooks/useSidePanel.ts
@@ -110,6 +110,15 @@ export const useSidePanel = () => {
     layoutStore.activePanelId = PanelId.TOOLS
   }
 
+  const closeSidePanel = () => {
+    if (isSubPanelOpen) {
+      layoutStore.activeSubPanelId = null
+      layoutStore.activePanelId = null
+      return
+    }
+    layoutStore.activePanelId = null
+  }
+
   useEffect(() => {
     const handleKeyDown = () => {
       lastInteractionRef.current = 'keyboard'
@@ -160,6 +169,7 @@ export const useSidePanel = () => {
     toggleInfo,
     openTranscript,
     openScreenRecording,
+    closeSidePanel,
     isSubPanelOpen,
     isChatOpen,
     isParticipantsOpen,
diff --git a/src/frontend/src/features/rooms/livekit/hooks/useSidePanelTriggerRef.ts b/src/frontend/src/features/rooms/livekit/hooks/useSidePanelTriggerRef.ts
new file mode 100644
index 00000000..dd5cc405
--- /dev/null
+++ b/src/frontend/src/features/rooms/livekit/hooks/useSidePanelTriggerRef.ts
@@ -0,0 +1,14 @@
+import { useCallback } from 'react'
+import type { SidePanelTriggerKey } from '../types/sidePanelTypes'
+import { useSidePanelTriggers } from './useSidePanelTriggers'
+
+export const useSidePanelTriggerRef = (key: SidePanelTriggerKey) => {
+  const { setTrigger } = useSidePanelTriggers()
+  return useCallback(
+    (el: HTMLElement | null) => {
+      setTrigger(key, el)
+    },
+    [key, setTrigger]
+  )
+}
+