From 82dbc98cbde2cd544f2e8a91d060f53d0146dfb1 Mon Sep 17 00:00:00 2001
From: ct <charlesteh90@gmail.com>
Date: Sun, 15 Jun 2025 20:49:06 +0800
Subject: [PATCH] Update

---
 .../editor/partials/canvas/video-editor.jsx   | 34 ++++++++++++++-----
 1 file changed, 26 insertions(+), 8 deletions(-)

diff --git a/resources/js/modules/editor/partials/canvas/video-editor.jsx b/resources/js/modules/editor/partials/canvas/video-editor.jsx
index 05c53b1..452d3e0 100644
--- a/resources/js/modules/editor/partials/canvas/video-editor.jsx
+++ b/resources/js/modules/editor/partials/canvas/video-editor.jsx
@@ -46,16 +46,34 @@ const VideoEditor = ({ width, height }) => {
 
     // ✅ FIX 1: Use useEffect to automatically setup videos when timeline loads
     useEffect(() => {
-        setTimeout(() => {
-            setTimelineElements(sampleTimelineElements);
-            showConsoleLogs && console.log('Loaded sample timeline');
-
-            setTimeout(() => {
-                setupVideos();
-            }, 1000);
-        }, 1000);
+        initTimeline();
     }, []);
 
+    const timelineUpdateResolverRef = useRef(null);
+
+    const setTimelineElementsAsync = useCallback((newElements) => {
+        return new Promise((resolve) => {
+            timelineUpdateResolverRef.current = resolve;
+            setTimelineElements(newElements);
+        });
+    }, []);
+
+    // Add this useEffect to resolve the promise when timeline updates
+    useEffect(() => {
+        if (timelineUpdateResolverRef.current && timelineElements.length > 0) {
+            timelineUpdateResolverRef.current();
+            timelineUpdateResolverRef.current = null;
+        }
+    }, [timelineElements]);
+
+    const initTimeline = () => {
+        cleanupVideos();
+        setTimelineElementsAsync(sampleTimelineElements).then(() => {
+            showConsoleLogs && console.log('Loaded sample timeline');
+
+            setupVideos();
+        });
+    };
     // ✅ FIX 3: Auto-update status when videos load
     useEffect(() => {
         setupVideoStatus();