diff --git a/apps/web/src/stores/timeline-store.ts b/apps/web/src/stores/timeline-store.ts index 01ad1635..20e80253 100644 --- a/apps/web/src/stores/timeline-store.ts +++ b/apps/web/src/stores/timeline-store.ts @@ -1317,8 +1317,9 @@ export const useTimelineStore = create((set, get) => { findOrCreateTrack: (trackType) => { // Always create new text track to allow multiple text elements + // Insert text tracks at the top if (trackType === "text") { - return get().addTrack(trackType); + return get().insertTrackAt(trackType, 0); } const existingTrack = get()._tracks.find((t) => t.type === trackType); @@ -1356,7 +1357,7 @@ export const useTimelineStore = create((set, get) => { }, addTextAtTime: (item, currentTime = 0) => { - const targetTrackId = get().addTrack("text"); // Always create new text track to allow multiple text elements + const targetTrackId = get().insertTrackAt("text", 0); // Always create new text track at the top get().addElementToTrack(targetTrackId, { type: "text", @@ -1399,7 +1400,7 @@ export const useTimelineStore = create((set, get) => { }, addTextToNewTrack: (item) => { - const targetTrackId = get().addTrack("text"); // Always create new text track to allow multiple text elements + const targetTrackId = get().insertTrackAt("text", 0); // Always create new text track at the top get().addElementToTrack(targetTrackId, { type: "text", diff --git a/apps/web/src/types/timeline.ts b/apps/web/src/types/timeline.ts index 17dbb5d1..f8a79d03 100644 --- a/apps/web/src/types/timeline.ts +++ b/apps/web/src/types/timeline.ts @@ -89,13 +89,19 @@ export interface TimelineTrack { export function sortTracksByOrder(tracks: TimelineTrack[]): TimelineTrack[] { return [...tracks].sort((a, b) => { + // Text tracks always go to the top + if (a.type === "text" && b.type !== "text") return -1; + if (b.type === "text" && a.type !== "text") return 1; + // Audio tracks always go to bottom if (a.type === "audio" && b.type !== "audio") return 1; if (b.type === "audio" && a.type !== "audio") return -1; - // Main track goes above audio but below other tracks - if (a.isMain && !b.isMain && b.type !== "audio") return 1; - if (b.isMain && !a.isMain && a.type !== "audio") return -1; + // Main track goes above audio but below text tracks + if (a.isMain && !b.isMain && b.type !== "audio" && b.type !== "text") + return 1; + if (b.isMain && !a.isMain && a.type !== "audio" && a.type !== "text") + return -1; // Within same category, maintain creation order return 0;