audio player respects group context

This commit is contained in:
gosangam
2026-10-15 23:18:05 +05:30
parent 09dc734613
commit 8537eb6ce2
8 changed files with 379 additions and 138 deletions
@@ -180,6 +180,7 @@ export default async function TranscriptionPage({
subtitle={[t.date, t.place].filter(Boolean).join(" · ")}
sourceUrl={`/transcriptions/${t.slug}`}
type={t.type}
fallbackYear={t.year}
/>
</div>
)}
@@ -5,6 +5,11 @@ import {
type AudioTrack,
AudioWaveAnimation,
} from "@/components/audio-player";
import {
rememberedQueue,
useTranscriptQueue,
yearQueue,
} from "@/components/audio-player/transcript-queue";
import { cn } from "@/lib/utils";
import { Play } from "lucide-react";
@@ -17,6 +22,11 @@ type PlayAudioButtonProps = {
className?: string;
/** Compact icon-only variant for list items */
variant?: "default" | "compact";
/**
* On a lecture's own page: its year, queued as a fallback when the lecture
* wasn't opened from a list (search, a shared link…).
*/
fallbackYear?: number | null;
};
export function PlayAudioButton({
@@ -27,8 +37,18 @@ export function PlayAudioButton({
type,
className,
variant = "default",
fallbackYear,
}: PlayAudioButtonProps) {
const { currentTrack, isPlaying, play, togglePlayPause } = useAudioPlayer();
const {
currentTrack,
isPlaying,
play,
playPlaylist,
attachQueue,
togglePlayPause,
} = useAudioPlayer();
// The list this button sits in (a transcription list row), if any.
const listQueue = useTranscriptQueue();
const isThisTrack = currentTrack?.url === audioUrl;
const isThisPlaying = isThisTrack && isPlaying;
@@ -44,7 +64,25 @@ export function PlayAudioButton({
sourceUrl,
type: type ?? "lecture",
};
// Queue the list this recording was found in, so Next / Previous
// follow it: the list the button sits in, or — on a lecture's own
// page — the list it was opened from.
const queue =
listQueue ??
rememberedQueue(sourceUrl.replace(/^\/transcriptions\//, ""));
const at = queue?.findIndex((q) => q.url === audioUrl) ?? -1;
if (queue && at >= 0 && queue.length > 1) {
playPlaylist(queue, at);
return;
}
// No list to follow: start this lecture now — audio must begin inside
// the tap, or iOS blocks it — then queue its year once that loads.
play(track);
if (fallbackYear) {
void yearQueue(fallbackYear).then((tracks) => {
if (tracks && tracks.length > 1) attachQueue(tracks);
});
}
}
}