fix: convert media asset duration to ticks on insert

2 files changed, 16 insertions, 7 deletions

diff --git a/apps/web/src/hooks/timeline/use-timeline-drag-drop.ts b/apps/web/src/hooks/timeline/use-timeline-drag-drop.ts
index 009f0ff6..868c638d 100644
--- a/apps/web/src/hooks/timeline/use-timeline-drag-drop.ts
+++ b/apps/web/src/hooks/timeline/use-timeline-drag-drop.ts
@@ -4,6 +4,7 @@ import { processMediaAssets } from "@/lib/media/processing";
 import { toast } from "sonner";
 import { showMediaUploadToast } from "@/lib/media/upload-toast";
 import { DEFAULT_NEW_ELEMENT_DURATION } from "@/lib/timeline/creation";
+import { TICKS_PER_SECOND } from "@/lib/wasm";
 import { BASE_TIMELINE_PIXELS_PER_SECOND } from "@/lib/timeline/scale";
 import { roundToFrame } from "opencut-wasm";
 import {
@@ -87,7 +88,9 @@ export function useTimelineDragDrop({
 			if (mediaId) {
 				const mediaAssets = editor.media.getAssets();
 				const media = mediaAssets.find((m) => m.id === mediaId);
-				return media?.duration ?? DEFAULT_NEW_ELEMENT_DURATION;
+				return media?.duration != null
+				? Math.round(media.duration * TICKS_PER_SECOND)
+				: DEFAULT_NEW_ELEMENT_DURATION;
 			}
 			return DEFAULT_NEW_ELEMENT_DURATION;
 		},
@@ -342,7 +345,9 @@ export function useTimelineDragDrop({
 				dragData.mediaType === "audio" ? "audio" : "video";
 
 			const duration =
-				mediaAsset.duration ?? DEFAULT_NEW_ELEMENT_DURATION;
+				mediaAsset.duration != null
+					? Math.round(mediaAsset.duration * TICKS_PER_SECOND)
+					: DEFAULT_NEW_ELEMENT_DURATION;
 			const element = buildElementFromMedia({
 				mediaId: mediaAsset.id,
 				mediaType: mediaAsset.type,
@@ -463,9 +468,10 @@ export function useTimelineDragDrop({
 						});
 						if (!createdAsset) continue;
 
-						const duration =
-							createdAsset.duration ??
-							DEFAULT_NEW_ELEMENT_DURATION;
+					const duration =
+						createdAsset.duration != null
+							? Math.round(createdAsset.duration * TICKS_PER_SECOND)
+							: DEFAULT_NEW_ELEMENT_DURATION;
 						const sceneTracks = editor.scenes.getActiveScene().tracks;
 						const currentTime = editor.playback.getCurrentTime();
 						const reuseMainTrackId =
diff --git a/apps/web/src/hooks/use-paste-media.ts b/apps/web/src/hooks/use-paste-media.ts
index 36d70ebe..ca821d6b 100644
--- a/apps/web/src/hooks/use-paste-media.ts
+++ b/apps/web/src/hooks/use-paste-media.ts
@@ -8,6 +8,7 @@ import { AddMediaAssetCommand } from "@/lib/commands/media";
 import { InsertElementCommand } from "@/lib/commands/timeline";
 import { BatchCommand } from "@/lib/commands";
 import { DEFAULT_NEW_ELEMENT_DURATION } from "@/lib/timeline/creation";
+import { TICKS_PER_SECOND } from "@/lib/wasm";
 import { isTypableDOMElement } from "@/utils/browser";
 import type { MediaType } from "@/lib/media/types";
 
@@ -73,8 +74,10 @@ export function usePasteMedia() {
 								asset,
 							);
 							const assetId = addMediaCmd.getAssetId();
-							const duration =
-								asset.duration ?? DEFAULT_NEW_ELEMENT_DURATION;
+						const duration =
+							asset.duration != null
+								? Math.round(asset.duration * TICKS_PER_SECOND)
+								: DEFAULT_NEW_ELEMENT_DURATION;
 							const trackType = asset.type === "audio" ? "audio" : "video";
 
 							const element = buildElementFromMedia({