forward timeline name

voxel51 · Oct 23, 2024 · 04d5451 · 04d5451
1 parent 809f172
commit 04d5451
Showing 1 changed file with 7 additions and 5 deletions.
diff --git a/app/packages/playback/src/views/Timeline.tsx b/app/packages/playback/src/views/Timeline.tsx
@@ -26,14 +26,16 @@ interface TimelineProps {
  */
 export const Timeline = React.memo(
   React.forwardRef<HTMLDivElement, TimelineProps>(
-    ({ name, style, controlsStyle }, ref) => {
+    (timelineProps: TimelineProps, ref) => {
+      const { name, style, controlsStyle } = timelineProps;
+
       const { playHeadState, config, play, pause, setSpeed } =
         useTimeline(name);
       const frameNumber = useFrameNumber(name);
 
-      const { getSeekValue, seekTo } = useTimelineVizUtils();
+      const { getSeekValue, seekTo } = useTimelineVizUtils(name);
 
-      const seekBarValue = React.useMemo(() => getSeekValue(), [frameNumber]);
+      const seekBarValue = React.useMemo(() => getSeekValue(), [getSeekValue]);
 
       const { loaded, loading } = useTimelineBuffers(name);
 
@@ -52,15 +54,15 @@ export const Timeline = React.memo(
             detail: { timelineName: name, start: true },
           })
         );
-      }, [pause]);
+      }, [pause, name]);
 
       const onSeekEnd = React.useCallback(() => {
         dispatchEvent(
           new CustomEvent("seek", {
             detail: { timelineName: name, start: false },
           })
         );
-      }, []);
+      }, [name]);
 
       const [isHoveringSeekBar, setIsHoveringSeekBar] = React.useState(false);