feat: expose editor state via ref in BlogEditor and integrate with CreatePost

src/pages/CreatePost.tsx

@@ -1,12 +1,13 @@
 import { useState, useRef } from 'react';
 import { useNavigate } from 'react-router-dom';
 import Layout from '../components/Layout';
-import BlogEditor from '../blog/BlogEditor';
+import BlogEditor, { type BlogEditorRef } from '../blog/BlogEditor';
 import { uploadImage, createBlogPost } from '../blog/api';
 import '../App.css';
 
 function CreatePost() {
   const navigate = useNavigate();
+  const editorRef = useRef<BlogEditorRef>(null);
   const [title, setTitle] = useState('');
   const [coverImage, setCoverImage] = useState<string | null>(null);
   const [coverImageKey, setCoverImageKey] = useState<string>('');
@@ -66,13 +67,17 @@ function CreatePost() {
       return;
     }
 
+    // Get editor content
+    if (!editorRef.current) {
+      alert('Editor not initialized');
+      return;
+    }
+
     setIsSubmitting(true);
 
     try {
-      // Get editor content
-      // Note: You'll need to export the editor content from the BlogEditor component
-      // For now, we'll use a placeholder
-      const content = JSON.stringify({ editorState: 'placeholder' });
+      // Get the actual editor state as JSON
+      const content = editorRef.current.getEditorState();
 
       const response = await createBlogPost(title, content, coverImageKey);
       
@@ -286,7 +291,7 @@ function CreatePost() {
             overflow: 'hidden',
             background: 'var(--bg-card)'
           }}>
-            <BlogEditor />
+            <BlogEditor ref={editorRef} />
           </div>
         </div>