♻️(frontend) generalize recording availability hook for all types

Extend recording availability and access hook to work with all recording
types instead of being transcript-specific. Create flexible implementation
that determines availability and permissions for screen recordings and
future recording formats.

src/frontend/src/features/rooms/livekit/components/Tools.tsx

@@ -6,8 +6,9 @@ import { CRISP_HELP_ARTICLE_MORE_TOOLS } from '@/utils/constants'
 import { ReactNode } from 'react'
 import { Transcript } from './Transcript'
 import { RiFileTextFill } from '@remixicon/react'
-import { useIsTranscriptEnabled } from '../hooks/useIsTranscriptEnabled'
 import { useSidePanel } from '../hooks/useSidePanel'
+import { useIsRecordingModeEnabled } from '../hooks/useIsRecordingModeEnabled'
+import { RecordingMode } from '@/features/rooms/api/startRecording'
 
 export interface ToolsButtonProps {
   icon: ReactNode
@@ -70,7 +71,9 @@ const ToolButton = ({
 export const Tools = () => {
   const { openTranscript, isTranscriptOpen } = useSidePanel()
   const { t } = useTranslation('rooms', { keyPrefix: 'moreTools' })
-  const isTranscriptEnabled = useIsTranscriptEnabled()
+  const isTranscriptEnabled = useIsRecordingModeEnabled(
+    RecordingMode.Transcript
+  )
 
   if (isTranscriptOpen && isTranscriptEnabled) {
     return <Transcript />

src/frontend/src/features/rooms/livekit/components/Transcript.tsx

@@ -16,7 +16,7 @@ import { NotificationPayload } from '@/features/notifications/NotificationPayloa
 import { NotificationType } from '@/features/notifications/NotificationType'
 import { useSnapshot } from 'valtio/index'
 import { RecordingStatus, recordingStore } from '@/stores/recording'
-import { useHasTranscriptAccess } from '../hooks/useHasTranscriptAccess'
+import { useHasRecordingAccess } from '../hooks/useHasScreenRecordingAccess'
 import {
   BETA_USERS_FORM_URL,
   CRISP_HELP_ARTICLE_TRANSCRIPT,
@@ -26,7 +26,10 @@ export const Transcript = () => {
   const [isLoading, setIsLoading] = useState(false)
   const { t } = useTranslation('rooms', { keyPrefix: 'transcript' })
 
-  const hasTranscriptAccess = useHasTranscriptAccess()
+  const hasTranscriptAccess = useHasRecordingAccess(
+    RecordingMode.Transcript,
+    'transcription-summary'
+  )
   const roomId = useRoomId()
 
   const { mutateAsync: startRecordingRoom } = useStartRecording()

src/frontend/src/features/rooms/livekit/hooks/useHasScreenRecordingAccess.ts

@@ -1,17 +1,21 @@
 import { useFeatureFlagEnabled } from 'posthog-js/react'
 import { useIsAnalyticsEnabled } from '@/features/analytics/hooks/useIsAnalyticsEnabled'
-import { useIsTranscriptEnabled } from './useIsTranscriptEnabled'
+import { RecordingMode } from '@/features/rooms/api/startRecording'
+import { useIsRecordingModeEnabled } from './useIsRecordingModeEnabled'
 import { useIsAdminOrOwner } from './useIsAdminOrOwner'
 
-export const useHasTranscriptAccess = () => {
-  const featureEnabled = useFeatureFlagEnabled('transcription-summary')
+export const useHasRecordingAccess = (
+  mode: RecordingMode,
+  featureFlag: string
+) => {
+  const featureEnabled = useFeatureFlagEnabled(featureFlag)
   const isAnalyticsEnabled = useIsAnalyticsEnabled()
-  const isTranscriptEnabled = useIsTranscriptEnabled()
+  const isRecordingModeEnabled = useIsRecordingModeEnabled(mode)
   const isAdminOrOwner = useIsAdminOrOwner()
 
   return (
     (featureEnabled || !isAnalyticsEnabled) &&
     isAdminOrOwner &&
-    isTranscriptEnabled
+    isRecordingModeEnabled
   )
 }

src/frontend/src/features/rooms/livekit/hooks/useIsRecordingModeEnabled.ts

@@ -1,11 +1,11 @@
 import { RecordingMode } from '@/features/rooms/api/startRecording'
 import { useConfig } from '@/api/useConfig'
 
-export const useIsTranscriptEnabled = () => {
+export const useIsRecordingModeEnabled = (mode: RecordingMode) => {
   const { data } = useConfig()
 
   return (
     data?.recording?.is_enabled &&
-    data?.recording?.available_modes?.includes(RecordingMode.Transcript)
+    data?.recording?.available_modes?.includes(mode)
   )
 }