From e4b67094e757917588fb624a30aa046667403add Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Tue, 7 Apr 2026 01:09:13 +0200
Subject: refactor: split effects and masks into dedicated rust crates,
 introduce MediaTime and FrameRate

---
 .../properties/hooks/use-element-playhead.ts       | 45 +++++++++++-----------
 .../editor/panels/properties/tabs/masks-tab.tsx    |  3 +-
 2 files changed, 23 insertions(+), 25 deletions(-)

(limited to 'apps/web/src/components/editor/panels/properties')

diff --git a/apps/web/src/components/editor/panels/properties/hooks/use-element-playhead.ts b/apps/web/src/components/editor/panels/properties/hooks/use-element-playhead.ts
index a900cb13..27300784 100644
--- a/apps/web/src/components/editor/panels/properties/hooks/use-element-playhead.ts
+++ b/apps/web/src/components/editor/panels/properties/hooks/use-element-playhead.ts
@@ -1,23 +1,22 @@
-import { useEditor } from "@/hooks/use-editor";
-import { getElementLocalTime } from "@/lib/animation";
-import { TIME_EPSILON_SECONDS } from "@/constants/animation-constants";
-
-export function useElementPlayhead({
-	startTime,
-	duration,
-}: {
-	startTime: number;
-	duration: number;
-}) {
-	const playheadTime = useEditor((editor) => editor.playback.getCurrentTime());
-	const localTime = getElementLocalTime({
-		timelineTime: playheadTime,
-		elementStartTime: startTime,
-		elementDuration: duration,
-	});
-	const isPlayheadWithinElementRange =
-		playheadTime >= startTime - TIME_EPSILON_SECONDS &&
-		playheadTime <= startTime + duration + TIME_EPSILON_SECONDS;
-
-	return { localTime, isPlayheadWithinElementRange };
-}
+import { useEditor } from "@/hooks/use-editor";
+import { getElementLocalTime } from "@/lib/animation";
+
+export function useElementPlayhead({
+	startTime,
+	duration,
+}: {
+	startTime: number;
+	duration: number;
+}) {
+	const playheadTime = useEditor((editor) => editor.playback.getCurrentTime());
+	const localTime = getElementLocalTime({
+		timelineTime: playheadTime,
+		elementStartTime: startTime,
+		elementDuration: duration,
+	});
+	const isPlayheadWithinElementRange =
+		playheadTime >= startTime &&
+		playheadTime <= startTime + duration;
+
+	return { localTime, isPlayheadWithinElementRange };
+}
diff --git a/apps/web/src/components/editor/panels/properties/tabs/masks-tab.tsx b/apps/web/src/components/editor/panels/properties/tabs/masks-tab.tsx
index f48a50cb..9b0ffc88 100644
--- a/apps/web/src/components/editor/panels/properties/tabs/masks-tab.tsx
+++ b/apps/web/src/components/editor/panels/properties/tabs/masks-tab.tsx
@@ -15,7 +15,6 @@ import {
 	PlusSignIcon,
 	RotateClockwiseIcon,
 } from "@hugeicons/core-free-icons";
-import { TIME_EPSILON_SECONDS } from "@/constants/animation-constants";
 import { useMemo, useState } from "react";
 import { Button } from "@/components/ui/button";
 import { ColorPicker } from "@/components/ui/color-picker";
@@ -102,7 +101,7 @@ export function MasksTab({ element, trackId }: MasksTabProps) {
 	const elementBounds = useMemo(() => {
 		const clampedTime = Math.min(
 			Math.max(currentTime, element.startTime),
-			element.startTime + element.duration - TIME_EPSILON_SECONDS,
+			element.startTime + element.duration - 1,
 		);
 
 		return (
-- 
cgit v1.3.1