nits
This commit is contained in:
@@ -260,12 +260,17 @@ function StreamViewInner({ path, streamParticle }: StreamViewProps) {
|
||||
|
||||
const { fastPlayback } = usePlaybackKeys({ mediaRef });
|
||||
|
||||
const handleExitNavigate = useCallback(() => {
|
||||
navigate(`/${networkId}`);
|
||||
}, [navigate, networkId]);
|
||||
|
||||
useStreamNavigationKeys({
|
||||
next,
|
||||
prev,
|
||||
currentIndex,
|
||||
childrenLength: children.length,
|
||||
mediaRef,
|
||||
onExit: handleExitNavigate,
|
||||
});
|
||||
|
||||
const handleOpenHuddle = useCallback(() => {
|
||||
@@ -326,10 +331,6 @@ function StreamViewInner({ path, streamParticle }: StreamViewProps) {
|
||||
// Always show controls when compose is active or exit countdown is visible
|
||||
const controlsVisible = showControls || composeActive || status === 'ended';
|
||||
|
||||
const handleExitNavigate = useCallback(() => {
|
||||
navigate(`/${networkId}`);
|
||||
}, [navigate, networkId]);
|
||||
|
||||
const exitRemainingMs = useExitCountdown(status, paused, handleExitNavigate);
|
||||
|
||||
// Reset progress when the particle changes.
|
||||
@@ -364,6 +365,7 @@ function StreamViewInner({ path, streamParticle }: StreamViewProps) {
|
||||
showEscape
|
||||
onOpenKeybindings={() => setShowKeybindings(true)}
|
||||
onOpenHuddle={handleOpenHuddle}
|
||||
onExit={handleExitNavigate}
|
||||
/>
|
||||
<ComposeOverlay
|
||||
networkId={networkId}
|
||||
@@ -508,6 +510,7 @@ function StreamViewInner({ path, streamParticle }: StreamViewProps) {
|
||||
exitRemainingMs={exitRemainingMs}
|
||||
onOpenKeybindings={() => setShowKeybindings(true)}
|
||||
onOpenHuddle={handleOpenHuddle}
|
||||
onExit={handleExitNavigate}
|
||||
/>
|
||||
|
||||
<KeybindingsOverlay
|
||||
@@ -531,6 +534,7 @@ function BottomBar({
|
||||
exitRemainingMs,
|
||||
onOpenKeybindings,
|
||||
onOpenHuddle,
|
||||
onExit,
|
||||
}: {
|
||||
visible: boolean;
|
||||
total: number;
|
||||
@@ -545,6 +549,7 @@ function BottomBar({
|
||||
exitRemainingMs: number | null;
|
||||
onOpenKeybindings: () => void;
|
||||
onOpenHuddle: () => void;
|
||||
onExit: () => void;
|
||||
}) {
|
||||
return (
|
||||
<div
|
||||
@@ -586,6 +591,7 @@ function BottomBar({
|
||||
showEscape
|
||||
onOpenKeybindings={onOpenKeybindings}
|
||||
onOpenHuddle={onOpenHuddle}
|
||||
onExit={onExit}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -597,19 +603,20 @@ function StreamViewControls({
|
||||
showEscape,
|
||||
onOpenKeybindings,
|
||||
onOpenHuddle,
|
||||
onExit,
|
||||
}: {
|
||||
showEscape?: boolean;
|
||||
onOpenKeybindings: () => void;
|
||||
onOpenHuddle: () => void;
|
||||
onExit: () => void;
|
||||
}) {
|
||||
const navigate = useNavigate();
|
||||
const requestIntent = useComposeIntentStore((s) => s.request);
|
||||
return (
|
||||
<div className="flex items-center gap-4 text-sm text-white/50">
|
||||
{showEscape && (
|
||||
<KeyHint
|
||||
keys="Esc"
|
||||
onClick={() => navigate(-1)}
|
||||
onClick={onExit}
|
||||
title="Back to network (or press Esc)"
|
||||
>
|
||||
back
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import { useEffect, type RefObject } from 'react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import type { MediaParticleHandle } from '@/features/particles/media-particle-view';
|
||||
import { isTypingTarget } from '@/lib/keyboard';
|
||||
|
||||
@@ -11,6 +10,7 @@ interface UseStreamNavigationKeysOptions {
|
||||
currentIndex: number;
|
||||
childrenLength: number;
|
||||
mediaRef: RefObject<MediaParticleHandle | null>;
|
||||
onExit: () => void;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -23,9 +23,8 @@ export function useStreamNavigationKeys({
|
||||
currentIndex,
|
||||
childrenLength,
|
||||
mediaRef,
|
||||
onExit,
|
||||
}: UseStreamNavigationKeysOptions) {
|
||||
const navigate = useNavigate();
|
||||
|
||||
useEffect(() => {
|
||||
const onKeyDown = (e: KeyboardEvent) => {
|
||||
if (isTypingTarget(e)) return;
|
||||
@@ -53,12 +52,12 @@ export function useStreamNavigationKeys({
|
||||
break;
|
||||
case 'Escape':
|
||||
e.preventDefault();
|
||||
navigate(-1);
|
||||
onExit();
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
window.addEventListener('keydown', onKeyDown);
|
||||
return () => window.removeEventListener('keydown', onKeyDown);
|
||||
}, [next, prev, currentIndex, childrenLength, mediaRef, navigate]);
|
||||
}, [next, prev, currentIndex, childrenLength, mediaRef, onExit]);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user