1 files changed, 15 insertions, 14 deletions

diff --git a/apps/web/src/timeline/hooks/use-timeline-seek.ts b/apps/web/src/timeline/hooks/use-timeline-seek.ts
index 56f68ed6..ea9b44a7 100644
--- a/apps/web/src/timeline/hooks/use-timeline-seek.ts
+++ b/apps/web/src/timeline/hooks/use-timeline-seek.ts
@@ -1,9 +1,11 @@
-import { useEffect, useRef, type RefObject } from "react";
+import { useEffect, useState, type RefObject } from "react";
 import { useEditor } from "@/editor/use-editor";
+import { useCommittedRef } from "@/hooks/use-committed-ref";
 import {
 	SeekController,
 	type SeekConfig,
 } from "@/timeline/controllers/seek-controller";
+import type { MediaTime } from "@/wasm";
 
 interface UseTimelineSeekProps {
 	playheadRef: RefObject<HTMLDivElement | null>;
@@ -11,10 +13,10 @@ interface UseTimelineSeekProps {
 	rulerScrollRef: RefObject<HTMLDivElement | null>;
 	tracksScrollRef: RefObject<HTMLDivElement | null>;
 	zoomLevel: number;
-	duration: number;
+	duration: MediaTime;
 	isSelecting: boolean;
 	clearSelectedElements: () => void;
-	seek: (time: number) => void;
+	seek: (time: MediaTime) => void;
 }
 
 export function useTimelineSeek({
@@ -40,18 +42,17 @@ export function useTimelineSeek({
 		getActiveProjectFps: () => editor.project.getActive()?.settings.fps ?? null,
 		clearSelectedElements,
 		seek,
-		setTimelineViewState: (viewState) =>
-			editor.project.setTimelineViewState({ viewState }),
+		setTimelineViewState: ({ zoomLevel, scrollLeft, playheadTime }) =>
+			editor.project.setTimelineViewState({
+				viewState: {
+					zoomLevel,
+					scrollLeft,
+					playheadTime,
+				},
+			}),
 	};
-
-	const configRef = useRef(config);
-	configRef.current = config;
-
-	const controllerRef = useRef<SeekController | null>(null);
-	if (!controllerRef.current) {
-		controllerRef.current = new SeekController({ configRef });
-	}
-	const controller = controllerRef.current;
+	const configRef = useCommittedRef(config);
+	const [controller] = useState(() => new SeekController({ configRef }));
 
 	useEffect(() => () => controller.destroy(), [controller]);