feat: add audio extraction management interface and services

- Implemented ExtractionsPage component for managing audio extractions.
- Added ExtractionsService for handling extraction API calls.
- Created Playlist component for displaying audio tracks.
- Introduced ScrollArea component for better UI scrolling experience.
- Developed FilesService for file download and thumbnail management.
- Added PlayerService for controlling audio playback and state.
- Updated API services index to include new services.

src/lib/api/services/extractions.ts

@@ -0,0 +1,52 @@
+import { apiClient } from '../client'
+
+export interface ExtractionInfo {
+  id: number
+  url: string
+  status: 'pending' | 'processing' | 'completed' | 'failed'
+  title?: string
+  service?: string
+  service_id?: string
+  sound_id?: number
+  user_id: number
+  error?: string
+  created_at: string
+  updated_at: string
+}
+
+export interface CreateExtractionResponse {
+  message: string
+  extraction: ExtractionInfo
+}
+
+export interface GetExtractionsResponse {
+  extractions: ExtractionInfo[]
+}
+
+export class ExtractionsService {
+  /**
+   * Create a new extraction job
+   */
+  async createExtraction(url: string): Promise<CreateExtractionResponse> {
+    const response = await apiClient.post<CreateExtractionResponse>(`/api/v1/extractions/?url=${encodeURIComponent(url)}`)
+    return response
+  }
+
+  /**
+   * Get extraction by ID
+   */
+  async getExtraction(extractionId: number): Promise<ExtractionInfo> {
+    const response = await apiClient.get<ExtractionInfo>(`/api/v1/extractions/${extractionId}`)
+    return response
+  }
+
+  /**
+   * Get user's extractions
+   */
+  async getUserExtractions(): Promise<ExtractionInfo[]> {
+    const response = await apiClient.get<GetExtractionsResponse>('/api/v1/extractions/')
+    return response.extractions
+  }
+}
+
+export const extractionsService = new ExtractionsService()