♻️(frontend) extract recording api into a dedicated folder

Extract code elements related to recording into a dedicated folder.

src/frontend/src/api/useConfig.ts

@@ -1,7 +1,7 @@
 import { fetchApi } from './fetchApi'
 import { keys } from './queryKeys'
 import { useQuery } from '@tanstack/react-query'
-import { RecordingMode } from '@/features/rooms/api/startRecording'
+import { RecordingMode } from '@/features/recording'
 
 export interface ApiConfig {
   analytics?: {

src/frontend/src/features/recording/api/startRecording.ts

@@ -1,12 +1,8 @@
 import { useMutation, UseMutationOptions } from '@tanstack/react-query'
 import { fetchApi } from '@/api/fetchApi'
 import { ApiError } from '@/api/ApiError'
-import { ApiRoom } from './ApiRoom'
-
-export enum RecordingMode {
-  Transcript = 'transcript',
-  ScreenRecording = 'screen_recording',
-}
+import { ApiRoom } from '@/features/rooms/api/ApiRoom'
+import { RecordingMode } from '../types'
 
 export interface StartRecordingParams {
   id: string

src/frontend/src/features/recording/api/stopRecording.ts

@@ -1,7 +1,7 @@
 import { useMutation, UseMutationOptions } from '@tanstack/react-query'
 import { fetchApi } from '@/api/fetchApi'
 import { ApiError } from '@/api/ApiError'
-import { ApiRoom } from './ApiRoom'
+import { ApiRoom } from '@/features/rooms/api/ApiRoom'
 
 export interface StopRecordingParams {
   id: string

src/frontend/src/features/recording/hooks/useHasRecordingAccess.ts

@@ -1,6 +1,6 @@
 import { useFeatureFlagEnabled } from 'posthog-js/react'
 import { useIsAnalyticsEnabled } from '@/features/analytics/hooks/useIsAnalyticsEnabled'
-import { RecordingMode } from '@/features/rooms/api/startRecording'
+import { RecordingMode } from '../types'
 import { useIsRecordingModeEnabled } from './useIsRecordingModeEnabled'
 import { useIsAdminOrOwner } from '@/features/rooms/livekit/hooks/useIsAdminOrOwner'
 

src/frontend/src/features/recording/hooks/useIsRecordingModeEnabled.ts

@@ -1,4 +1,4 @@
-import { RecordingMode } from '@/features/rooms/api/startRecording'
+import { RecordingMode } from '../types'
 import { useConfig } from '@/api/useConfig'
 
 export const useIsRecordingModeEnabled = (mode: RecordingMode) => {

src/frontend/src/features/recording/index.ts

@@ -6,3 +6,6 @@ export {
 export { useIsRecordingTransitioning } from './hooks/useIsRecordingTransitioning'
 export { useHasRecordingAccess } from './hooks/useHasRecordingAccess'
 export { RecordingStateToast } from './components/RecordingStateToast'
+export { useStartRecording } from './api/startRecording'
+export { useStopRecording } from './api/stopRecording'
+export { RecordingMode } from './types'

src/frontend/src/features/recording/types.ts

@@ -0,0 +1,4 @@
+export enum RecordingMode {
+  Transcript = 'transcript',
+  ScreenRecording = 'screen_recording',
+}

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

@@ -7,8 +7,8 @@ import { useRoomContext } from '@livekit/components-react'
 import {
   RecordingMode,
   useStartRecording,
-} from '@/features/rooms/api/startRecording'
-import { useStopRecording } from '@/features/rooms/api/stopRecording'
+  useStopRecording,
+} from '@/features/recording'
 import { useEffect, useMemo, useState } from 'react'
 import { RoomEvent } from 'livekit-client'
 import { useTranslation } from 'react-i18next'

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

@@ -8,8 +8,7 @@ import { Transcript } from './Transcript'
 import { RiFileTextFill, RiLiveFill } from '@remixicon/react'
 import { SubPanelId, useSidePanel } from '../hooks/useSidePanel'
 import { ScreenRecording } from './ScreenRecording'
-import { RecordingMode } from '@/features/rooms/api/startRecording'
-import { useIsRecordingModeEnabled } from '@/features/recording'
+import { useIsRecordingModeEnabled, RecordingMode } from '@/features/recording'
 
 export interface ToolsButtonProps {
   icon: ReactNode

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

@@ -7,8 +7,12 @@ import { useRoomContext } from '@livekit/components-react'
 import {
   RecordingMode,
   useStartRecording,
-} from '@/features/rooms/api/startRecording'
-import { useStopRecording } from '@/features/rooms/api/stopRecording'
+  useStopRecording,
+  useIsScreenRecordingStarted,
+  useIsTranscriptStarted,
+  useIsRecordingTransitioning,
+  useHasRecordingAccess,
+} from '@/features/recording'
 import { useEffect, useMemo, useState } from 'react'
 import { RoomEvent } from 'livekit-client'
 import { useTranslation } from 'react-i18next'
@@ -19,12 +23,6 @@ import {
   BETA_USERS_FORM_URL,
   CRISP_HELP_ARTICLE_TRANSCRIPT,
 } from '@/utils/constants'
-import {
-  useIsScreenRecordingStarted,
-  useIsTranscriptStarted,
-  useIsRecordingTransitioning,
-  useHasRecordingAccess,
-} from '@/features/recording'
 
 export const Transcript = () => {
   const [isLoading, setIsLoading] = useState(false)