refactor(miniPlayer): co-locate mini player feature into features/miniPlayer

This commit is contained in:
Psychotoxical
2026-06-29 23:22:00 +02:00
parent 6dd0d4a130
commit e6269c7b85
21 changed files with 59 additions and 51 deletions
@@ -0,0 +1,37 @@
import { Pause, Play, SkipBack, SkipForward } from 'lucide-react';
import { formatTrackTime } from '@/utils/format/formatDuration';
import type { MiniControlAction } from '@/features/miniPlayer/utils/miniPlayerBridge';
interface Props {
isPlaying: boolean;
currentTime: number;
duration: number;
progress: number;
control: (action: MiniControlAction) => void;
}
export function MiniControls({ isPlaying, currentTime, duration, progress, control }: Props) {
return (
<div className="mini-player__bottom" data-tauri-drag-region="false">
<div className="mini-player__controls">
<button className="mini-player__btn" onClick={() => control('prev')} data-tauri-drag-region="false">
<SkipBack size={16} />
</button>
<button className="mini-player__btn mini-player__btn--primary" onClick={() => control('toggle')} data-tauri-drag-region="false">
{isPlaying ? <Pause size={18} /> : <Play size={18} />}
</button>
<button className="mini-player__btn" onClick={() => control('next')} data-tauri-drag-region="false">
<SkipForward size={16} />
</button>
</div>
<div className="mini-player__progress">
<div className="mini-player__progress-time">{formatTrackTime(currentTime)}</div>
<div className="mini-player__progress-track">
<div className="mini-player__progress-fill" style={{ width: `${progress}%` }} />
</div>
<div className="mini-player__progress-time">{formatTrackTime(duration)}</div>
</div>
</div>
);
}