From 8dd6f9a9b3da6a5c683d91bd647a60198955317f Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Wed, 9 Jul 2025 23:59:39 +0200
Subject: feat: add conditional rendering to properties panel with text change
 functionality

---
 apps/web/src/stores/timeline-store.ts | 41 +++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)

(limited to 'apps/web/src/stores')

diff --git a/apps/web/src/stores/timeline-store.ts b/apps/web/src/stores/timeline-store.ts
index 7431e085..8c934392 100644
--- a/apps/web/src/stores/timeline-store.ts
+++ b/apps/web/src/stores/timeline-store.ts
@@ -4,6 +4,7 @@ import {
   TimelineElement,
   CreateTimelineElement,
   TimelineTrack,
+  TextElement,
   sortTracksByOrder,
   ensureMainTrack,
   validateElementTrackCompatibility,
@@ -136,6 +137,28 @@ interface TimelineStore {
   loadProjectTimeline: (projectId: string) => Promise<void>;
   saveProjectTimeline: (projectId: string) => Promise<void>;
   clearTimeline: () => void;
+  updateTextElement: (
+    trackId: string,
+    elementId: string,
+    updates: Partial<
+      Pick<
+        TextElement,
+        | "content"
+        | "fontSize"
+        | "fontFamily"
+        | "color"
+        | "backgroundColor"
+        | "textAlign"
+        | "fontWeight"
+        | "fontStyle"
+        | "textDecoration"
+        | "x"
+        | "y"
+        | "rotation"
+        | "opacity"
+      >
+    >
+  ) => void;
 }
 
 export const useTimelineStore = create<TimelineStore>((set, get) => {
@@ -494,6 +517,24 @@ export const useTimelineStore = create<TimelineStore>((set, get) => {
       );
     },
 
+    updateTextElement: (trackId, elementId, updates) => {
+      get().pushHistory();
+      updateTracksAndSave(
+        get()._tracks.map((track) =>
+          track.id === trackId
+            ? {
+                ...track,
+                elements: track.elements.map((element) =>
+                  element.id === elementId && element.type === "text"
+                    ? { ...element, ...updates }
+                    : element
+                ),
+              }
+            : track
+        )
+      );
+    },
+
     splitElement: (trackId, elementId, splitTime) => {
       const { _tracks } = get();
       const track = _tracks.find((t) => t.id === trackId);
-- 
cgit v1.3.1