Implement audio player component and integrate with history and sample lists

- Added a new AudioPlayer component for audio playback functionality, utilizing WaveSurfer for waveform visualization.
- Integrated audio playback controls into the HistoryTable and SampleList components, allowing users to play audio directly from their history and samples.
- Updated player state management to handle audio URL, ID, title, and playback state.
- Introduced a custom Slider component for volume control and seek functionality.
- Enhanced UI to ensure the AudioPlayer is always visible except in settings, improving user experience.
This commit is contained in:
Jamie Pine
2026-01-25 13:12:50 -08:00
parent 6fa2966371
commit f80f870e93
8 changed files with 604 additions and 79 deletions
+22 -21
View File
@@ -13,34 +13,35 @@
"check": "biome check --write src"
},
"dependencies": {
"@tauri-apps/api": "^2.0.0",
"react": "^18.3.0",
"react-dom": "^18.3.0",
"@tanstack/react-query": "^5.0.0",
"@tanstack/react-query-devtools": "^5.0.0",
"zustand": "^4.5.0",
"react-hook-form": "^7.53.0",
"@hookform/resolvers": "^3.9.0",
"zod": "^3.23.8",
"wavesurfer.js": "^7.0.0",
"lucide-react": "^0.454.0",
"date-fns": "^3.6.0",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.1",
"tailwind-merge": "^2.5.4",
"@radix-ui/react-alert-dialog": "^1.1.1",
"@radix-ui/react-avatar": "^1.1.0",
"@radix-ui/react-dialog": "^1.1.1",
"@radix-ui/react-dropdown-menu": "^2.1.1",
"@radix-ui/react-label": "^2.1.0",
"@radix-ui/react-select": "^2.1.1",
"@radix-ui/react-separator": "^1.1.0",
"@radix-ui/react-slot": "^1.1.0",
"@radix-ui/react-tabs": "^1.1.0",
"@radix-ui/react-toast": "^1.2.1",
"@radix-ui/react-popover": "^1.1.1",
"@radix-ui/react-progress": "^1.1.0",
"@radix-ui/react-scroll-area": "^1.1.0",
"@radix-ui/react-avatar": "^1.1.0",
"@radix-ui/react-alert-dialog": "^1.1.1"
"@radix-ui/react-select": "^2.1.1",
"@radix-ui/react-separator": "^1.1.0",
"@radix-ui/react-slider": "^1.3.6",
"@radix-ui/react-slot": "^1.1.0",
"@radix-ui/react-tabs": "^1.1.0",
"@radix-ui/react-toast": "^1.2.1",
"@tanstack/react-query": "^5.0.0",
"@tanstack/react-query-devtools": "^5.0.0",
"@tauri-apps/api": "^2.0.0",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.1",
"date-fns": "^3.6.0",
"lucide-react": "^0.454.0",
"react": "^18.3.0",
"react-dom": "^18.3.0",
"react-hook-form": "^7.53.0",
"tailwind-merge": "^2.5.4",
"wavesurfer.js": "^7.0.0",
"zod": "^3.23.8",
"zustand": "^4.5.0"
},
"devDependencies": {
"@tailwindcss/vite": "^4.1.18",