Merge pull request #324 from simonorzel26/feat/refactor-timeline

feat(web): timeline refactor and horizontal + vertical scrolling

1 files changed, 32 insertions, 0 deletions

diff --git a/apps/web/src/components/editor/timeline/timeline-wheel-handler.tsx b/apps/web/src/components/editor/timeline/timeline-wheel-handler.tsx
new file mode 100644
index 00000000..8036b96c
--- /dev/null
+++ b/apps/web/src/components/editor/timeline/timeline-wheel-handler.tsx
@@ -0,0 +1,32 @@
+import { useEffect } from "react";
+
+export interface TimelineWheelHandlerProps {
+	timelineRef: React.RefObject<HTMLDivElement>;
+	isInTimeline: boolean;
+	handleWheel: (e: React.WheelEvent) => void;
+}
+
+export function useTimelineWheelHandler({
+	timelineRef,
+	isInTimeline,
+	handleWheel,
+}: TimelineWheelHandlerProps) {
+	useEffect(() => {
+		const timelineContainer = timelineRef.current;
+		if (!timelineContainer || !isInTimeline) return;
+
+		const handleWheelCapture = (e: WheelEvent) => {
+			handleWheel(e as any);
+		};
+
+		timelineContainer.addEventListener("wheel", handleWheelCapture, {
+			passive: false,
+		});
+
+		return () => {
+			timelineContainer.removeEventListener("wheel", handleWheelCapture);
+		};
+	}, [handleWheel, isInTimeline, timelineRef]);
+
+	return null;
+}