Fix insert link flow for new page creation

🔧 Fixed URL generation for new page links:
- Updated SlateEditor to generate proper URLs: /new?title=PageName instead of /new:PageName
- Added isNew flag to LinkElement type definition
- Fixed malformed URLs that were breaking navigation

✨ Added automatic new page creation:
- Extract new page references from content during save
- Automatically create referenced pages with empty content
- Works for both new page creation and existing page updates
- Ensures all linked pages exist after save operation

🎯 Improved user experience:
- Insert link flow now works correctly for new pages
- Proper URL parameters for title pre-filling
- Seamless page creation workflow
- No more broken links to non-existent pages

Technical changes:
- Updated insertLink function in SlateEditor.tsx
- Added extractNewPageReferences and createNewPagesFromLinks helpers
- Enhanced save process in both new/page.tsx and PageView.tsx
- Proper URL encoding for page titles with special characters

Author: sirjamesgray

app/components/editor/SlateEditor.tsx

@@ -52,6 +52,7 @@ type LinkElement = {
   isOwned: boolean;
   isSuggestion?: boolean; // New flag for link suggestions
   suggestionData?: any; // Store original suggestion data for confirmation
+  isNew?: boolean; // Flag for new pages that need to be created
   children: Descendant[];
 };
 
@@ -713,12 +714,13 @@ const SlateEditor: React.FC<SlateEditorProps> = ({
       // Insert new link
       const link: LinkElement = {
         type: 'link',
-        url: linkData.url,
+        url: linkData.url || (linkData.isNew ? `/new?title=${encodeURIComponent(linkData.pageTitle)}` : `/${linkData.pageId}`),
         pageId: linkData.pageId,
         pageTitle: linkData.pageTitle,
         isExternal: linkData.type === 'external',
         isPublic: true,
         isOwned: false,
+        isNew: linkData.isNew, // Add isNew flag to the link element
         children: [{ text: linkData.text || linkData.pageTitle || 'Link' }]
       };
 
@@ -734,12 +736,13 @@ const SlateEditor: React.FC<SlateEditorProps> = ({
         editor,
         {
           type: 'link',
-          url: linkData.url,
+          url: linkData.url || (linkData.isNew ? `/new?title=${encodeURIComponent(linkData.pageTitle)}` : `/${linkData.pageId}`),
           pageId: linkData.pageId,
           pageTitle: linkData.pageTitle,
           isExternal: linkData.type === 'external',
           isPublic: true,
           isOwned: false,
+          isNew: linkData.isNew, // Add isNew flag to the link element
           children: []
         },
         { split: true }

app/components/pages/PageView.tsx

@@ -800,6 +800,67 @@ export default function PageView({
 
   // No need for handleSetIsEditing - always in edit mode
 
+  // Helper function to extract new page references from content
+  const extractNewPageReferences = (content: any[]): Array<{pageId: string, title: string}> => {
+    const newPages: Array<{pageId: string, title: string}> = [];
+
+    const processNode = (node: any) => {
+      if (node.type === 'link' && node.isNew && node.pageId && node.pageTitle) {
+        newPages.push({
+          pageId: node.pageId,
+          title: node.pageTitle
+        });
+      }
+
+      if (node.children) {
+        node.children.forEach(processNode);
+      }
+    };
+
+    content.forEach(processNode);
+    return newPages;
+  };
+
+  // Helper function to create new pages referenced in links
+  const createNewPagesFromLinks = async (newPageRefs: Array<{pageId: string, title: string}>): Promise<void> => {
+    if (!user?.uid || newPageRefs.length === 0) return;
+
+    console.log('🔵 PAGE SAVE: Creating new pages from links:', newPageRefs);
+
+    for (const pageRef of newPageRefs) {
+      try {
+        const pageData = {
+          title: pageRef.title,
+          content: JSON.stringify([{ type: 'paragraph', children: [{ text: '' }] }]), // Empty content
+          userId: user.uid,
+          username: user.username || user.displayName || 'Anonymous',
+          lastModified: new Date().toISOString(),
+          isReply: false,
+          groupId: null,
+          customDate: null
+        };
+
+        const response = await fetch('/api/pages', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify(pageData),
+          credentials: 'include'
+        });
+
+        if (response.ok) {
+          const result = await response.json();
+          console.log('✅ PAGE SAVE: Created new page from link:', { title: pageRef.title, id: result.id });
+        } else {
+          console.error('🔴 PAGE SAVE: Failed to create new page from link:', pageRef.title);
+        }
+      } catch (error) {
+        console.error('🔴 PAGE SAVE: Error creating new page from link:', error);
+      }
+    }
+  };
+
   const handleSave = useCallback(async (passedContent?: any) => {
     console.log('🔵 PAGE SAVE: Save initiated', {
       pageId,
@@ -857,6 +918,13 @@ export default function PageView({
         contentToSaveSample: contentToSave ? JSON.stringify(contentToSave).substring(0, 200) : 'null'
       });
 
+      // Extract and create new pages referenced in links before saving the main page
+      const newPageRefs = extractNewPageReferences(contentToSave);
+      if (newPageRefs.length > 0) {
+        console.log('🔵 PAGE SAVE: Found new page references, creating them first:', newPageRefs);
+        await createNewPagesFromLinks(newPageRefs);
+      }
+
       const updateData = {
         id: pageId,
         title: title.trim(),

app/new/page.tsx

@@ -416,6 +416,67 @@ function NewPageContent() {
     setHasUnsavedChanges(hasContentChanged || hasTitleChanged);
   }, [hasContentChanged, hasTitleChanged]);
 
+  // Helper function to extract new page references from content
+  const extractNewPageReferences = (content: EditorNode[]): Array<{pageId: string, title: string}> => {
+    const newPages: Array<{pageId: string, title: string}> = [];
+
+    const processNode = (node: any) => {
+      if (node.type === 'link' && node.isNew && node.pageId && node.pageTitle) {
+        newPages.push({
+          pageId: node.pageId,
+          title: node.pageTitle
+        });
+      }
+
+      if (node.children) {
+        node.children.forEach(processNode);
+      }
+    };
+
+    content.forEach(processNode);
+    return newPages;
+  };
+
+  // Helper function to create new pages referenced in links
+  const createNewPagesFromLinks = async (newPageRefs: Array<{pageId: string, title: string}>): Promise<void> => {
+    if (!user?.uid || newPageRefs.length === 0) return;
+
+    console.log('🔵 DEBUG: Creating new pages from links:', newPageRefs);
+
+    for (const pageRef of newPageRefs) {
+      try {
+        const pageData = {
+          title: pageRef.title,
+          content: JSON.stringify([{ type: 'paragraph', children: [{ text: '' }] }]), // Empty content
+          userId: user.uid,
+          username: user.username || user.displayName || 'Anonymous',
+          lastModified: new Date().toISOString(),
+          isReply: false,
+          groupId: null,
+          customDate: null
+        };
+
+        const response = await fetch('/api/pages', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify(pageData),
+          credentials: 'include'
+        });
+
+        if (response.ok) {
+          const result = await response.json();
+          console.log('✅ DEBUG: Created new page from link:', { title: pageRef.title, id: result.id });
+        } else {
+          console.error('🔴 DEBUG: Failed to create new page from link:', pageRef.title);
+        }
+      } catch (error) {
+        console.error('🔴 DEBUG: Error creating new page from link:', error);
+      }
+    }
+  };
+
   // Handle save
   const handleSave = async (content: EditorNode[], saveMethod: 'keyboard' | 'button' = 'button'): Promise<boolean> => {
     console.log('🔵 DEBUG: handleSave called with:', {
@@ -680,6 +741,13 @@ function NewPageContent() {
 
         return true;
       } else {
+        // Extract and create new pages referenced in links before saving the main page
+        const newPageRefs = extractNewPageReferences(finalContent);
+        if (newPageRefs.length > 0) {
+          console.log('🔵 DEBUG: Found new page references, creating them first:', newPageRefs);
+          await createNewPagesFromLinks(newPageRefs);
+        }
+
         // Normal page creation for verified users - use API route instead of direct Firestore
         console.log('🔵 DEBUG: About to call API route with data:', { ...data, content: '(content omitted)' });