diff --git a/components/tracks/Track.tsx b/components/tracks/Track.tsx index 78d74a2..4fe3220 100644 --- a/components/tracks/Track.tsx +++ b/components/tracks/Track.tsx @@ -15,6 +15,8 @@ import { createAutomationPoint } from '@/lib/audio/automation/utils'; import { createAutomationLane } from '@/lib/audio/automation-utils'; import { EffectDevice } from '@/components/effects/EffectDevice'; import { EffectBrowser } from '@/components/effects/EffectBrowser'; +import { ImportDialog } from '@/components/dialogs/ImportDialog'; +import { importAudioFile, type ImportOptions } from '@/lib/audio/decoder'; export interface TrackProps { track: TrackType; @@ -86,6 +88,11 @@ export function Track({ const resizeStartRef = React.useRef({ y: 0, height: 0 }); const [effectBrowserOpen, setEffectBrowserOpen] = React.useState(false); + // Import dialog state + const [showImportDialog, setShowImportDialog] = React.useState(false); + const [pendingFile, setPendingFile] = React.useState(null); + const [fileMetadata, setFileMetadata] = React.useState<{ sampleRate?: number; channels?: number }>({}); + // Selection state const [isSelecting, setIsSelecting] = React.useState(false); const [selectionStart, setSelectionStart] = React.useState(null); @@ -452,24 +459,55 @@ export function Track({ if (!file || !onLoadAudio) return; try { + // Decode to get basic metadata before showing dialog const arrayBuffer = await file.arrayBuffer(); const audioContext = new AudioContext(); - const audioBuffer = await audioContext.decodeAudioData(arrayBuffer); - onLoadAudio(audioBuffer); + const tempBuffer = await audioContext.decodeAudioData(arrayBuffer); - // Update track name to filename if it's still default - if (track.name === 'New Track' || track.name === 'Untitled Track') { - const fileName = file.name.replace(/\.[^/.]+$/, ''); - onNameChange(fileName); - } + // Set metadata and show import dialog + setFileMetadata({ + sampleRate: tempBuffer.sampleRate, + channels: tempBuffer.numberOfChannels, + }); + setPendingFile(file); + setShowImportDialog(true); } catch (error) { - console.error('Failed to load audio file:', error); + console.error('Failed to read audio file metadata:', error); } // Reset input e.target.value = ''; }; + const handleImport = async (options: ImportOptions) => { + if (!pendingFile || !onLoadAudio) return; + + try { + setShowImportDialog(false); + const { buffer, metadata } = await importAudioFile(pendingFile, options); + onLoadAudio(buffer); + + // Update track name to filename if it's still default + if (track.name === 'New Track' || track.name === 'Untitled Track') { + const fileName = metadata.fileName.replace(/\.[^/.]+$/, ''); + onNameChange(fileName); + } + + console.log('Audio imported:', metadata); + } catch (error) { + console.error('Failed to import audio file:', error); + } finally { + setPendingFile(null); + setFileMetadata({}); + } + }; + + const handleImportCancel = () => { + setShowImportDialog(false); + setPendingFile(null); + setFileMetadata({}); + }; + const handleLoadAudioClick = () => { fileInputRef.current?.click(); }; @@ -1005,6 +1043,17 @@ export function Track({
)} + + {/* Import Dialog */} + {showImportDialog && pendingFile && ( + + )} ); }