refactor all timeline components

1 files changed, 44 insertions, 44 deletions

diff --git a/apps/web/src/components/editor/timeline/timeline-scroll-sync.tsx b/apps/web/src/components/editor/timeline/timeline-scroll-sync.tsx
index 6537d909..9938ca04 100644
--- a/apps/web/src/components/editor/timeline/timeline-scroll-sync.tsx
+++ b/apps/web/src/components/editor/timeline/timeline-scroll-sync.tsx
@@ -1,61 +1,61 @@
 import { useEffect, useRef } from "react";
 
 export interface TimelineScrollSyncProps {
-	rulerScrollRef: React.RefObject<HTMLDivElement>;
-	tracksScrollRef: React.RefObject<HTMLDivElement>;
+  rulerScrollRef: React.RefObject<HTMLDivElement>;
+  tracksScrollRef: React.RefObject<HTMLDivElement>;
 }
 
 export function useTimelineScrollSync({
-	rulerScrollRef,
-	tracksScrollRef,
+  rulerScrollRef,
+  tracksScrollRef,
 }: TimelineScrollSyncProps) {
-	const isUpdatingRef = useRef(false);
-	const lastSyncRef = useRef(0);
+  const isUpdatingRef = useRef(false);
+  const lastSyncRef = useRef(0);
 
-	// --- Horizontal scroll synchronization between ruler and tracks ---
-	useEffect(() => {
-		const rulerViewport = rulerScrollRef.current?.querySelector(
-			"[data-radix-scroll-area-viewport]",
-		) as HTMLElement;
-		const tracksViewport = tracksScrollRef.current?.querySelector(
-			"[data-radix-scroll-area-viewport]",
-		) as HTMLElement;
+  // --- Horizontal scroll synchronization between ruler and tracks ---
+  useEffect(() => {
+    const rulerViewport = rulerScrollRef.current?.querySelector(
+      "[data-radix-scroll-area-viewport]"
+    ) as HTMLElement;
+    const tracksViewport = tracksScrollRef.current?.querySelector(
+      "[data-radix-scroll-area-viewport]"
+    ) as HTMLElement;
 
-		if (!rulerViewport || !tracksViewport) return;
+    if (!rulerViewport || !tracksViewport) return;
 
-		// Throttled scroll handlers for better performance
-		const handleRulerScroll = () => {
-			const now = Date.now();
-			if (isUpdatingRef.current || now - lastSyncRef.current < 16) return; // 60fps throttling
-			lastSyncRef.current = now;
+    // Throttled scroll handlers for better performance
+    const handleRulerScroll = () => {
+      const now = Date.now();
+      if (isUpdatingRef.current || now - lastSyncRef.current < 16) return; // 60fps throttling
+      lastSyncRef.current = now;
 
-			isUpdatingRef.current = true;
-			tracksViewport.scrollLeft = rulerViewport.scrollLeft;
-			isUpdatingRef.current = false;
-		};
+      isUpdatingRef.current = true;
+      tracksViewport.scrollLeft = rulerViewport.scrollLeft;
+      isUpdatingRef.current = false;
+    };
 
-		const handleTracksScroll = () => {
-			const now = Date.now();
-			if (isUpdatingRef.current || now - lastSyncRef.current < 16) return; // 60fps throttling
-			lastSyncRef.current = now;
+    const handleTracksScroll = () => {
+      const now = Date.now();
+      if (isUpdatingRef.current || now - lastSyncRef.current < 16) return; // 60fps throttling
+      lastSyncRef.current = now;
 
-			isUpdatingRef.current = true;
-			rulerViewport.scrollLeft = tracksViewport.scrollLeft;
-			isUpdatingRef.current = false;
-		};
+      isUpdatingRef.current = true;
+      rulerViewport.scrollLeft = tracksViewport.scrollLeft;
+      isUpdatingRef.current = false;
+    };
 
-		rulerViewport.addEventListener("scroll", handleRulerScroll, {
-			passive: true,
-		});
-		tracksViewport.addEventListener("scroll", handleTracksScroll, {
-			passive: true,
-		});
+    rulerViewport.addEventListener("scroll", handleRulerScroll, {
+      passive: true,
+    });
+    tracksViewport.addEventListener("scroll", handleTracksScroll, {
+      passive: true,
+    });
 
-		return () => {
-			rulerViewport.removeEventListener("scroll", handleRulerScroll);
-			tracksViewport.removeEventListener("scroll", handleTracksScroll);
-		};
-	}, [rulerScrollRef, tracksScrollRef]);
+    return () => {
+      rulerViewport.removeEventListener("scroll", handleRulerScroll);
+      tracksViewport.removeEventListener("scroll", handleTracksScroll);
+    };
+  }, [rulerScrollRef, tracksScrollRef]);
 
-	return null;
+  return null;
 }