From 7f0bcea4ca91eccb9e35f25804a4f6feed8c4e11 Mon Sep 17 00:00:00 2001
From: creotove <creotove@gmail.com>
Date: Wed, 25 Jun 2025 15:29:20 +0530
Subject: Feat: basic audio waveform added.

---
 apps/web/src/components/editor/timeline.tsx | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

(limited to 'apps/web/src/components/editor/timeline.tsx')

diff --git a/apps/web/src/components/editor/timeline.tsx b/apps/web/src/components/editor/timeline.tsx
index ce0ffa30..cc7d7f3a 100644
--- a/apps/web/src/components/editor/timeline.tsx
+++ b/apps/web/src/components/editor/timeline.tsx
@@ -35,6 +35,7 @@ import {
   SelectTrigger,
   SelectValue,
 } from "../ui/select";
+import AudioWaveform from "./audio-waveform";
 
 export function Timeline() {
   // Timeline shows all tracks (video, audio, effects) and their clips.
@@ -1626,7 +1627,21 @@ function TimelineTrackContent({
       );
     }
 
-    // Fallback for audio or videos without thumbnails
+    if (mediaItem.type === "audio") {
+    return (
+      <div className="w-full h-full flex items-center gap-2">
+        <div className="flex-1 min-w-0">
+          <AudioWaveform 
+            audioUrl={mediaItem.url} 
+            height={24}
+            className="w-full"
+          />
+        </div>
+      </div>
+    );
+  }
+
+    // Fallback for videos without thumbnails
     return (
       <span className="text-xs text-foreground/80 truncate">{clip.name}</span>
     );
-- 
cgit v1.3.1


From 07351ca7e6ca8da79fc0206aa843847184c12efe Mon Sep 17 00:00:00 2001
From: GeorgeCaoJ <cjooo092@gmail.com>
Date: Wed, 25 Jun 2025 20:04:21 +0800
Subject: fix(timeline): drag and drop to create new track

---
 apps/web/src/components/editor/timeline.tsx | 20 +++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

(limited to 'apps/web/src/components/editor/timeline.tsx')

diff --git a/apps/web/src/components/editor/timeline.tsx b/apps/web/src/components/editor/timeline.tsx
index ce0ffa30..f84a1863 100644
--- a/apps/web/src/components/editor/timeline.tsx
+++ b/apps/web/src/components/editor/timeline.tsx
@@ -566,15 +566,6 @@ export function Timeline() {
       onMouseLeave={() => setIsInTimeline(false)}
       onWheel={handleWheel}
     >
-      {/* Show overlay when dragging media over the timeline */}
-      {isDragOver && (
-        <div className="absolute inset-0 z-20 flex items-center justify-center pointer-events-none backdrop-blur-lg">
-          <div>
-            Drop media here to add to timeline
-          </div>
-        </div>
-      )}
-
       {/* Toolbar */}
       <div className="border-b flex items-center px-2 py-1 gap-1">
         <TooltipProvider delayDuration={500}>
@@ -953,6 +944,17 @@ export function Timeline() {
                     )}
                   </>
                 )}
+                {isDragOver && (
+                  <div
+                    className="absolute left-0 right-0 border-2 border-dashed border-accent flex items-center justify-center text-muted-foreground"
+                    style={{
+                      top: `${tracks.length * 60}px`,
+                      height: "60px",
+                    }}
+                  >
+                    <div>Drop media here to add a new track</div>
+                  </div>
+                )}
               </div>
             </div>
           </div>
-- 
cgit v1.3.1