feat: refactor to multi-track only editor with sidebar controls
Major refactor to simplify the editor and focus exclusively on multi-track editing: **AudioEditor Changes:** - Removed single-file waveform view and useAudioPlayer - Removed all single-file editing operations (cut, copy, paste, trim) - Simplified to multi-track only with track selection support - Added selectedTrackId state for track-specific effect chain - Reduced from ~1500 lines to ~290 lines **SidePanel Changes:** - Complete rewrite with 2 tabs: Tracks and Effect Chain - Tracks tab shows all tracks with inline controls (volume, pan, solo, mute) - Click tracks to select/deselect - Effect Chain tab shows effects for selected track - Removed old file/history/info/effects tabs - Sidebar now wider (320px) to accommodate inline track controls **TrackList/Track Changes:** - Added track selection support (isSelected/onSelect props) - Visual feedback with ring border when track is selected - Click anywhere on track to select it **Workflow:** 1. Import or add audio tracks 2. Select a track in the sidebar or main view 3. Apply effects to selected track via Effect Chain tab 4. Adjust track controls (volume, pan, solo, mute) in Tracks tab 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -10,6 +10,8 @@ export interface TrackProps {
|
||||
zoom: number;
|
||||
currentTime: number;
|
||||
duration: number;
|
||||
isSelected?: boolean;
|
||||
onSelect?: () => void;
|
||||
onToggleMute: () => void;
|
||||
onToggleSolo: () => void;
|
||||
onToggleCollapse: () => void;
|
||||
@@ -25,6 +27,8 @@ export function Track({
|
||||
zoom,
|
||||
currentTime,
|
||||
duration,
|
||||
isSelected,
|
||||
onSelect,
|
||||
onToggleMute,
|
||||
onToggleSolo,
|
||||
onToggleCollapse,
|
||||
@@ -121,7 +125,13 @@ export function Track({
|
||||
|
||||
if (track.collapsed) {
|
||||
return (
|
||||
<div className="border-b border-border">
|
||||
<div
|
||||
className={cn(
|
||||
'border-b border-border cursor-pointer',
|
||||
isSelected && 'ring-2 ring-primary ring-inset'
|
||||
)}
|
||||
onClick={onSelect}
|
||||
>
|
||||
<TrackHeader
|
||||
track={track}
|
||||
onToggleMute={onToggleMute}
|
||||
@@ -140,9 +150,10 @@ export function Track({
|
||||
<div
|
||||
ref={containerRef}
|
||||
className={cn(
|
||||
'border-b border-border',
|
||||
track.selected && 'ring-2 ring-primary ring-inset'
|
||||
'border-b border-border cursor-pointer',
|
||||
isSelected && 'ring-2 ring-primary ring-inset'
|
||||
)}
|
||||
onClick={onSelect}
|
||||
>
|
||||
<TrackHeader
|
||||
track={track}
|
||||
|
||||
Reference in New Issue
Block a user