From 03b3c952c75b7642b537fa2499d081edd1a0a1e4 Mon Sep 17 00:00:00 2001
From: ahmedfahim21 <ahmed.fahim0207@gmail.com>
Date: Sun, 13 Jul 2025 00:59:54 +0530
Subject: feat: click to add to timeline

---
 .../components/editor/media-panel/views/media.tsx  |  2 ++
 .../components/editor/media-panel/views/text.tsx   | 35 +++++++++++++++++++---
 2 files changed, 33 insertions(+), 4 deletions(-)

(limited to 'apps/web/src/components/editor/media-panel')

diff --git a/apps/web/src/components/editor/media-panel/views/media.tsx b/apps/web/src/components/editor/media-panel/views/media.tsx
index 48e54961..36478667 100644
--- a/apps/web/src/components/editor/media-panel/views/media.tsx
+++ b/apps/web/src/components/editor/media-panel/views/media.tsx
@@ -24,6 +24,7 @@ import {
 } from "@/components/ui/select";
 import { DraggableMediaItem } from "@/components/ui/draggable-item";
 import { useProjectStore } from "@/stores/project-store";
+import { addMediaToTimeline } from "@/lib/timeline-utils";
 
 export function MediaView() {
   const { mediaItems, addMediaItem, removeMediaItem } = useMediaStore();
@@ -288,6 +289,7 @@ export function MediaView() {
                         name: item.name,
                       }}
                       showPlusOnDrag={false}
+                      onAddToTimeline={(currentTime) => addMediaToTimeline(item, currentTime)}
                       rounded={false}
                     />
                   </ContextMenuTrigger>
diff --git a/apps/web/src/components/editor/media-panel/views/text.tsx b/apps/web/src/components/editor/media-panel/views/text.tsx
index bec32c85..fad79343 100644
--- a/apps/web/src/components/editor/media-panel/views/text.tsx
+++ b/apps/web/src/components/editor/media-panel/views/text.tsx
@@ -1,4 +1,30 @@
 import { DraggableMediaItem } from "@/components/ui/draggable-item";
+import { TIMELINE_CONSTANTS } from "@/constants/timeline-constants";
+import { addTextToTimeline } from "@/lib/timeline-utils";
+import { type TextElement } from "@/types/timeline";
+
+let textData: TextElement = {
+  id: "default-text",
+  type: "text",
+  name: "Default text",
+  content: "Default text",
+  fontSize: 48,
+  fontFamily: "Arial",
+  color: "#ffffff",
+  backgroundColor: "transparent",
+  textAlign: "center" as const,
+  fontWeight: "normal" as const,
+  fontStyle: "normal" as const,
+  textDecoration: "none" as const,
+  x: 0,
+  y: 0,
+  rotation: 0,
+  opacity: 1,
+  duration: TIMELINE_CONSTANTS.DEFAULT_TEXT_DURATION,
+  startTime: 0,
+  trimStart: 0,
+  trimEnd: 0,
+};
 
 export function TextView() {
   return (
@@ -11,12 +37,13 @@ export function TextView() {
           </div>
         }
         dragData={{
-          id: "default-text",
-          type: "text",
-          name: "Default text",
-          content: "Default text",
+          id: textData.id,
+          type: textData.type,
+          name: textData.name,
+          content: textData.content,
         }}
         aspectRatio={1}
+        onAddToTimeline={(currentTime) => addTextToTimeline(textData, currentTime)}
         showLabel={false}
       />
     </div>
-- 
cgit v1.3.1