fix(player): open the channel page from the player without it bouncing back

Two bugs made clicking the channel name in the video modal just close the player:
- the second PlayerModal mount (main feed path) was missing onOpenChannel, so the handler
  hit its no-op early return;
- opening the channel synchronously pushed the _chan history entry, which the player's own
  useBackToClose teardown (history.back on unmount) then immediately popped. Now the open is
  deferred to a one-shot popstate listener that fires AFTER that teardown, so the channel
  entry lands at the feed level. Verified: player → channel name → channel page; Back → feed
  (player does not reappear).
This commit is contained in:
npeter83 2026-06-30 04:14:14 +02:00
parent 641fc393a7
commit 419231bddb
2 changed files with 13 additions and 1 deletions

View file

@ -587,6 +587,7 @@ export default function Feed({
startAt={activeVideo.startAt} startAt={activeVideo.startAt}
onClose={() => setActiveVideo(null)} onClose={() => setActiveVideo(null)}
onState={onState} onState={onState}
onOpenChannel={onOpenChannel}
/> />
)} )}
{isFetchingNextPage && ( {isFetchingNextPage && (

View file

@ -559,8 +559,19 @@ export default function PlayerModal({
<div className="flex items-center gap-1.5 shrink-0 min-w-0"> <div className="flex items-center gap-1.5 shrink-0 min-w-0">
<button <button
onClick={() => { onClick={() => {
if (!onOpenChannel) return onClose();
const cid = active.channel_id;
const cname = active.channel_title ?? undefined;
// Closing the player pops its own history entry (useBackToClose → history.back()).
// Open the channel only AFTER that pop's popstate — pushing the channel entry
// before it would let the back remove it again (the bug: clicking the name only
// closed the player). One-shot listener fires after App's popstate handler.
const open = () => {
window.removeEventListener("popstate", open);
onOpenChannel(cid, cname);
};
window.addEventListener("popstate", open);
onClose(); onClose();
onOpenChannel?.(active.channel_id, active.channel_title ?? undefined);
}} }}
className="font-medium hover:text-accent truncate text-left" className="font-medium hover:text-accent truncate text-left"
> >