refactor: move to a typed-tracks system and add support for text

2 files changed, 10 insertions, 7 deletions

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 50fb6fa6..f975496e 100644
--- a/apps/web/src/components/editor/media-panel/views/media.tsx
+++ b/apps/web/src/components/editor/media-panel/views/media.tsx
@@ -73,18 +73,22 @@ export function MediaView() {
     // Remove a media item from the store

     e.stopPropagation();

 

-    // Remove tracks automatically when delete media

+    // Remove elements automatically when delete media

     const { tracks, removeTrack } = useTimelineStore.getState();

     tracks.forEach((track) => {

-      const clipsToRemove = track.clips.filter((clip) => clip.mediaId === id);

-      clipsToRemove.forEach((clip) => {

-        useTimelineStore.getState().removeClipFromTrack(track.id, clip.id);

+      const elementsToRemove = track.elements.filter(

+        (element) => element.type === "media" && element.mediaId === id

+      );

+      elementsToRemove.forEach((element) => {

+        useTimelineStore

+          .getState()

+          .removeElementFromTrack(track.id, element.id);

       });

-      // Only remove track if it becomes empty and has no other clips

+      // Only remove track if it becomes empty and has no other elements

       const updatedTrack = useTimelineStore

         .getState()

         .tracks.find((t) => t.id === track.id);

-      if (updatedTrack && updatedTrack.clips.length === 0) {

+      if (updatedTrack && updatedTrack.elements.length === 0) {

         removeTrack(track.id);

       }

     });

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 ab698528..bec32c85 100644
--- a/apps/web/src/components/editor/media-panel/views/text.tsx
+++ b/apps/web/src/components/editor/media-panel/views/text.tsx
@@ -17,7 +17,6 @@ export function TextView() {
           content: "Default text",

         }}

         aspectRatio={1}

-        className="w-24"

         showLabel={false}

       />

     </div>