From 401cc35743aafc4c8bdfb8055501650390bde88b Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Wed, 29 Apr 2026 10:37:39 +0200
Subject: refactor: animate params over time

---
 apps/web/src/timeline/components/graph-editor/session.ts | 15 ++++++---------
 apps/web/src/timeline/components/timeline-element.tsx    |  4 ++--
 2 files changed, 8 insertions(+), 11 deletions(-)

(limited to 'apps/web/src/timeline/components')

diff --git a/apps/web/src/timeline/components/graph-editor/session.ts b/apps/web/src/timeline/components/graph-editor/session.ts
index d7c6b001..c5d1c133 100644
--- a/apps/web/src/timeline/components/graph-editor/session.ts
+++ b/apps/web/src/timeline/components/graph-editor/session.ts
@@ -1,11 +1,12 @@
 import {
 	getCurveHandlesForNormalizedCubicBezier,
 	getEditableScalarChannels,
-	getEasingModeForKind,
 	getNormalizedCubicBezierForScalarSegment,
 	getScalarKeyframeContext,
 	updateScalarKeyframeCurve,
 } from "@/animation";
+import { getChannelsFromData } from "@/animation/channel-data";
+import { isScalarChannel } from "@/animation/interpolation";
 import type {
 	AnimationPath,
 	ElementAnimations,
@@ -143,12 +144,9 @@ function findKeyframeTime({
 	propertyPath: AnimationPath;
 	keyframeId: string;
 }): number | null {
-	const binding = animations.bindings[propertyPath];
-	if (!binding) return null;
-
-	for (const component of binding.components) {
-		const channel = animations.channels[component.channelId];
-		if (channel?.kind !== "scalar") continue;
+	const data = animations[propertyPath];
+	for (const channel of getChannelsFromData({ data })) {
+		if (!channel || !isScalarChannel(channel)) continue;
 		const key = channel.keys.find((k) => k.id === keyframeId);
 		if (key !== undefined) return key.time;
 	}
@@ -300,8 +298,7 @@ function resolvePropertySelection({
 		}
 	}
 
-	const { binding: resolvedBinding, channels: scalarChannels } = scalarResult;
-	const easingMode = getEasingModeForKind(resolvedBinding.kind);
+	const { easingMode, channels: scalarChannels } = scalarResult;
 	const contexts = scalarChannels.flatMap((channel) => {
 		const context = getScalarKeyframeContext({
 			animations: element.animations,
diff --git a/apps/web/src/timeline/components/timeline-element.tsx b/apps/web/src/timeline/components/timeline-element.tsx
index 74f026dc..1b549a15 100644
--- a/apps/web/src/timeline/components/timeline-element.tsx
+++ b/apps/web/src/timeline/components/timeline-element.tsx
@@ -52,7 +52,7 @@ import { getTimelinePixelsPerSecond } from "@/timeline";
 import { buildWaveformSourceKey } from "@/media/waveform-summary";
 import { addMediaTime, type MediaTime, TICKS_PER_SECOND } from "@/wasm";
 import {
-	getActionDefaultShortcuts,
+	getActionDefinition,
 	type TAction,
 	type TActionWithOptionalArgs,
 	invokeAction,
@@ -186,7 +186,7 @@ export function getKeyframeIndicators({
 }
 
 export function getDisplayShortcut({ action }: { action: TAction }) {
-	const defaultShortcuts = getActionDefaultShortcuts({ action });
+	const defaultShortcuts = getActionDefinition({ action }).defaultShortcuts;
 	if (!defaultShortcuts?.length) {
 		return "";
 	}
-- 
cgit v1.3.1