Update

resources/js/modules/editor/partials/text-sidebar.jsx

@@ -5,6 +5,7 @@ import { Sheet, SheetContent, SheetHeader, SheetTitle } from '@/components/ui/sh
 import { Textarea } from '@/components/ui/textarea';
 import { useMitt } from '@/plugins/MittContext';
 import useVideoEditorStore from '@/stores/VideoEditorStore';
+import useMediaStore from '@/stores/MediaStore';
 import { Bold, Italic, Minus, Plus, Type } from 'lucide-react';
 import { useEffect, useState } from 'react';
 
@@ -13,6 +14,7 @@ import { DEFAULT_TEXT_CONFIG, getAvailableFonts, loadFonts } from '@/modules/edi
 
 export default function TextSidebar({ isOpen, onClose }) {
     const { selectedTextElement } = useVideoEditorStore();
+    const { updateCurrentCaption } = useMediaStore();
     const emitter = useMitt();
     const [textValue, setTextValue] = useState('');
     const [fontSize, setFontSize] = useState(24);
@@ -77,10 +79,14 @@ export default function TextSidebar({ isOpen, onClose }) {
         setTextValue(newText);
 
         if (selectedTextElement) {
+            // Update the timeline element
             emitter.emit('text-update', {
                 elementId: selectedTextElement.id,
                 updates: { text: newText },
             });
+            
+            // Update MediaStore to maintain single source of truth
+            updateCurrentCaption(newText);
         }
     };
 

resources/js/stores/MediaStore.js

@@ -38,6 +38,11 @@ const useMediaStore = create(
             set({ selectedBackground: background });
         },
 
+        // Update current caption when user edits text
+        updateCurrentCaption: (caption) => {
+            set({ currentCaption: caption });
+        },
+
         // Clear selections
         clearSelectedMeme: () => {
             set({ selectedMeme: null });