feat: show waveform in collapsed state

Changes:
- Waveform canvas now displays even when track is collapsed
- Only the upload placeholder is hidden when collapsed
- Gives better visual overview when tracks are minimized
- Similar to DAWs like Ableton Live

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-11-18 07:09:29 +01:00
parent 1404228239
commit e3582b7b9a

View File

@@ -81,7 +81,7 @@ export function Track({
// Draw waveform // Draw waveform
React.useEffect(() => { React.useEffect(() => {
if (!track.audioBuffer || !canvasRef.current || track.collapsed) return; if (!track.audioBuffer || !canvasRef.current) return;
const canvas = canvasRef.current; const canvas = canvasRef.current;
const ctx = canvas.getContext('2d'); const ctx = canvas.getContext('2d');
@@ -387,8 +387,6 @@ export function Track({
className="flex-1 relative bg-slate-900 border-b border-border cursor-pointer" className="flex-1 relative bg-slate-900 border-b border-border cursor-pointer"
onClick={onSelect} onClick={onSelect}
> >
{!track.collapsed && (
<>
{track.audioBuffer ? ( {track.audioBuffer ? (
<canvas <canvas
ref={canvasRef} ref={canvasRef}
@@ -396,6 +394,7 @@ export function Track({
onClick={handleCanvasClick} onClick={handleCanvasClick}
/> />
) : ( ) : (
!track.collapsed && (
<> <>
<div <div
className={cn( className={cn(
@@ -422,8 +421,7 @@ export function Track({
className="hidden" className="hidden"
/> />
</> </>
)} )
</>
)} )}
</div> </div>
</div> </div>