some fixes

app/actions/projects.ts

@@ -19,39 +19,7 @@ export async function getProjects(): Promise<{
     };
   }
 
-  // await dbConnect();
-  // const projects = await Project.find({
-  //   user_id: user?.id,
-  // })
-  //   .sort({ _createdAt: -1 })
-  //   .limit(100)
-  //   .lean();
-  // if (!projects) {
-  //   return {
-  //     ok: true,
-  //     isEmpty: true,
-  //     projects: [],
-  //   };
-  // }
-
-  // const mappedProjects = []
-
-  // for (const project of projects) {
-  //   const space = await spaceInfo({
-  //     name: project.space_id,
-  //     accessToken: user.token as string,
-  //     additionalFields: ["author", "cardData"],
-  //   });
-  //   if (!space.private) {
-  //     mappedProjects.push({
-  //       ...project,
-  //       name: space.name,
-  //       cardData: space.cardData,
-  //     });
-  //   }
-  // }
   const projects = [];
-  // get user spaces from Hugging Face
   for await (const space of listSpaces({
     accessToken: user.token as string,
     additionalFields: ["author", "cardData"],

app/api/ask/route.ts

@@ -103,8 +103,6 @@ export async function POST(request: NextRequest) {
     rewrittenPrompt = await rewritePrompt(prompt, enhancedSettings, { token, billTo }, selectedModel.value, selectedProvider);
   }
 
-  console.log(rewrittenPrompt);
-
   try {
     const encoder = new TextEncoder();
     const stream = new TransformStream();
@@ -133,7 +131,7 @@ export async function POST(request: NextRequest) {
               },
               {
                 role: "user",
-                content: `${rewritePrompt}${redesignMarkdown ? `\n\nHere is my current design as a markdown:\n\n${redesignMarkdown}\n\nNow, please create a new design based on this markdown. Use the images in the markdown.` : ""}`
+                content: `${rewrittenPrompt}${redesignMarkdown ? `\n\nHere is my current design as a markdown:\n\n${redesignMarkdown}\n\nNow, please create a new design based on this markdown. Use the images in the markdown.` : ""}`
               },
             ],
             max_tokens: selectedProvider.max_tokens,
@@ -277,6 +275,21 @@ export async function PUT(request: NextRequest) {
 
   const client = new InferenceClient(token);
 
+  // Helper function to escape regex special characters
+  const escapeRegExp = (string: string) => {
+    return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+  };
+
+  // Helper function to create flexible HTML regex that handles varying spaces
+  const createFlexibleHtmlRegex = (searchBlock: string) => {
+    let searchRegex = escapeRegExp(searchBlock)
+      .replace(/\s+/g, '\\s*') // Allow any amount of whitespace where there are spaces
+      .replace(/>\s*</g, '>\\s*<') // Allow spaces between HTML tags
+      .replace(/\s*>/g, '\\s*>'); // Allow spaces before closing >
+    
+    return new RegExp(searchRegex, 'g');
+  };
+
   const selectedProvider = await getBestProvider(selectedModel.value, provider)
 
   try {
@@ -300,7 +313,7 @@ export async function PUT(request: NextRequest) {
 
             content: `${
               selectedElementHtml
-                ? `\n\nYou have to update ONLY the following element, NOTHING ELSE: \n\n\`\`\`html\n${selectedElementHtml}\n\`\`\``
+                ? `\n\nYou have to update ONLY the following element, NOTHING ELSE: \n\n\`\`\`html\n${selectedElementHtml}\n\`\`\` Could be in multiple pages, if so, update all the pages.`
                 : ""
             }. Current pages: ${pages?.map((p: Page) => `- ${p.path} \n${p.html}`).join("\n")}. ${files?.length > 0 ? `Current images: ${files?.map((f: string) => `- ${f}`).join("\n")}.` : ""}`,
           },
@@ -381,15 +394,18 @@ export async function PUT(request: NextRequest) {
               pageHtml = `${replaceBlock}\n${pageHtml}`;
               updatedLines.push([1, replaceBlock.split("\n").length]);
             } else {
-              const blockPosition = pageHtml.indexOf(searchBlock);
-              if (blockPosition !== -1) {
-                const beforeText = pageHtml.substring(0, blockPosition);
+              const regex = createFlexibleHtmlRegex(searchBlock);
+              const match = regex.exec(pageHtml);
+              
+              if (match) {
+                const matchedText = match[0];
+                const beforeText = pageHtml.substring(0, match.index);
                 const startLineNumber = beforeText.split("\n").length;
                 const replaceLines = replaceBlock.split("\n").length;
                 const endLineNumber = startLineNumber + replaceLines - 1;
 
                 updatedLines.push([startLineNumber, endLineNumber]);
-                pageHtml = pageHtml.replace(searchBlock, replaceBlock);
+                pageHtml = pageHtml.replace(matchedText, replaceBlock);
               }
             }
 
@@ -467,15 +483,18 @@ export async function PUT(request: NextRequest) {
             newHtml = `${replaceBlock}\n${newHtml}`;
             updatedLines.push([1, replaceBlock.split("\n").length]);
           } else {
-            const blockPosition = newHtml.indexOf(searchBlock);
-            if (blockPosition !== -1) {
-              const beforeText = newHtml.substring(0, blockPosition);
+            const regex = createFlexibleHtmlRegex(searchBlock);
+            const match = regex.exec(newHtml);
+            
+            if (match) {
+              const matchedText = match[0];
+              const beforeText = newHtml.substring(0, match.index);
               const startLineNumber = beforeText.split("\n").length;
               const replaceLines = replaceBlock.split("\n").length;
               const endLineNumber = startLineNumber + replaceLines - 1;
 
               updatedLines.push([startLineNumber, endLineNumber]);
-              newHtml = newHtml.replace(searchBlock, replaceBlock);
+              newHtml = newHtml.replace(matchedText, replaceBlock);
             }
           }
 

app/api/me/projects/[namespace]/[repoId]/commits/[commitId]/promote/route.ts

@@ -1,9 +1,7 @@
 import { NextRequest, NextResponse } from "next/server";
-import { RepoDesignation, listFiles, uploadFiles } from "@huggingface/hub";
+import { RepoDesignation, listFiles, spaceInfo, uploadFiles } from "@huggingface/hub";
 
 import { isAuthenticated } from "@/lib/auth";
-import Project from "@/models/Project";
-import dbConnect from "@/lib/mongodb";
 
 export async function POST(
   req: NextRequest,
@@ -21,28 +19,35 @@ export async function POST(
     return NextResponse.json({ message: "Unauthorized" }, { status: 401 });
   }
 
-  await dbConnect();
   const param = await params;
   const { namespace, repoId, commitId } = param;
 
-  const project = await Project.findOne({
-    user_id: user.id,
-    space_id: `${namespace}/${repoId}`,
-  }).lean();
-
-  if (!project) {
-    return NextResponse.json(
-      { ok: false, error: "Project not found" },
-      { status: 404 }
-    );
-  }
-
   try {
     const repo: RepoDesignation = {
       type: "space",
       name: `${namespace}/${repoId}`,
     };
 
+    const space = await spaceInfo({
+      name: `${namespace}/${repoId}`,
+      accessToken: user.token as string,
+      additionalFields: ["author"],
+    });
+
+    if (!space || space.sdk !== "static") {
+      return NextResponse.json(
+        { ok: false, error: "Space is not a static space." },
+        { status: 404 }
+      );
+    }
+    
+    if (space.author !== user.name) {
+      return NextResponse.json(
+        { ok: false, error: "Space does not belong to the authenticated user." },
+        { status: 403 }
+      );
+    }
+
     // Fetch files from the specific commit
     const files: File[] = [];
     const allowedExtensions = ["html", "md", "css", "js", "json", "txt"];
@@ -116,7 +121,6 @@ export async function POST(
     );
 
   } catch (error: any) {
-    console.error("Error promoting version:", error);
     
     // Handle specific HuggingFace API errors
     if (error.statusCode === 404) {

app/api/me/projects/[namespace]/[repoId]/images/route.ts

@@ -1,5 +1,5 @@
 import { NextRequest, NextResponse } from "next/server";
-import { RepoDesignation, uploadFiles } from "@huggingface/hub";
+import { RepoDesignation, spaceInfo, uploadFiles } from "@huggingface/hub";
 
 import { isAuthenticated } from "@/lib/auth";
 import Project from "@/models/Project";
@@ -16,24 +16,28 @@ export async function POST(
       return NextResponse.json({ message: "Unauthorized" }, { status: 401 });
     }
 
-    await dbConnect();
     const param = await params;
     const { namespace, repoId } = param;
 
-    const project = await Project.findOne({
-      user_id: user.id,
-      space_id: `${namespace}/${repoId}`,
-    }).lean();
-    
-    if (!project) {
+    const space = await spaceInfo({
+      name: `${namespace}/${repoId}`,
+      accessToken: user.token as string,
+      additionalFields: ["author"],
+    });
+
+    if (!space || space.sdk !== "static") {
       return NextResponse.json(
-        {
-          ok: false,
-          error: "Project not found",
-        },
+        { ok: false, error: "Space is not a static space." },
         { status: 404 }
       );
     }
+    
+    if (space.author !== user.name) {
+      return NextResponse.json(
+        { ok: false, error: "Space does not belong to the authenticated user." },
+        { status: 403 }
+      );
+    }
 
     // Parse the FormData to get the images
     const formData = await req.formData();

app/api/me/projects/[namespace]/[repoId]/route.ts

@@ -1,9 +1,7 @@
 import { NextRequest, NextResponse } from "next/server";
-import { RepoDesignation, spaceInfo, uploadFiles, listFiles, deleteRepo, listCommits } from "@huggingface/hub";
+import { RepoDesignation, spaceInfo, listFiles, deleteRepo, listCommits } from "@huggingface/hub";
 
 import { isAuthenticated } from "@/lib/auth";
-import Project from "@/models/Project";
-import dbConnect from "@/lib/mongodb";
 import { Commit, Page } from "@/types";
 
 export async function DELETE(
@@ -16,22 +14,9 @@ export async function DELETE(
     return NextResponse.json({ message: "Unauthorized" }, { status: 401 });
   }
 
-  await dbConnect();
   const param = await params;
   const { namespace, repoId } = param;
 
-  const project = await Project.findOne({
-    user_id: user.id,
-    space_id: `${namespace}/${repoId}`,
-  }).lean();
-  
-  if (!project) {
-    return NextResponse.json(
-      { ok: false, error: "Project not found" },
-      { status: 404 }
-    );
-  }
-
   try {
     const space = await spaceInfo({
       name: `${namespace}/${repoId}`,
@@ -69,11 +54,7 @@ export async function DELETE(
       repo,
       accessToken: user.token as string,
     });
-    
-    await Project.deleteOne({
-      user_id: user.id,
-      space_id: `${namespace}/${repoId}`,
-    });
+
     
     return NextResponse.json({ ok: true }, { status: 200 });
   } catch (error: any) {
@@ -94,23 +75,9 @@ export async function GET(
     return NextResponse.json({ message: "Unauthorized" }, { status: 401 });
   }
 
-  await dbConnect();
   const param = await params;
   const { namespace, repoId } = param;
 
-  const project = await Project.findOne({
-    user_id: user.id,
-    space_id: `${namespace}/${repoId}`,
-  }).lean();
-  if (!project) {
-    return NextResponse.json(
-      {
-        ok: false,
-        error: "Project not found",
-      },
-      { status: 404 }
-    );
-  }
   try {
     const space = await spaceInfo({
       name: namespace + "/" + repoId,
@@ -203,10 +170,13 @@ export async function GET(
         { status: 404 }
       );
     }
-
     return NextResponse.json(
       {
-        project,
+        project: {
+          id: space.id,
+          space_id: space.name,
+          _updatedAt: space.updatedAt,
+        },
         pages: htmlFiles,
         files,
         commits,
@@ -218,10 +188,6 @@ export async function GET(
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
   } catch (error: any) {
     if (error.statusCode === 404) {
-      await Project.deleteOne({
-        user_id: user.id,
-        space_id: `${namespace}/${repoId}`,
-      });
       return NextResponse.json(
         { error: "Space not found", ok: false },
         { status: 404 }

app/api/me/projects/route.ts

@@ -2,8 +2,6 @@ import { NextRequest, NextResponse } from "next/server";
 import { RepoDesignation, createRepo, listCommits, uploadFiles } from "@huggingface/hub";
 
 import { isAuthenticated } from "@/lib/auth";
-import Project from "@/models/Project";
-import dbConnect from "@/lib/mongodb";
 import { Commit, Page } from "@/types";
 import { COLORS } from "@/lib/utils";
 
@@ -15,7 +13,6 @@ export async function POST(
     return NextResponse.json({ message: "Unauthorized" }, { status: 401 });
   }
 
-  await dbConnect();
   const { title: titleFromRequest, pages, prompt } = await req.json();
 
   const title = titleFromRequest ?? "DeepSite Project";
@@ -70,10 +67,6 @@ This project was created with [DeepSite](https://deepsite.hf.co).
     });
 
     const path = repoUrl.split("/").slice(-2).join("/");
-    const project = await Project.create({
-      user_id: user.id,
-      space_id: path,
-    });
 
     const commits: Commit[] = [];
     for await (const commit of listCommits({ repo, accessToken: user.token as string })) {
@@ -91,7 +84,9 @@ This project was created with [DeepSite](https://deepsite.hf.co).
       files,
       pages,
       commits,
-      project,
+      project: {
+        
+      }
     }
     
     return NextResponse.json({ space: newProject, path, ok: true }, { status: 201 });

app/api/proxy/route.ts

@@ -80,14 +80,12 @@ export async function GET(req: NextRequest) {
       <script>        
         // Add event listeners and communicate with parent
         document.addEventListener('DOMContentLoaded', function() {
-          console.log('DOM loaded, setting up communication');
           let hoveredElement = null;
           let isEditModeEnabled = false;
           
           document.addEventListener('mouseover', function(event) {
             if (event.target !== document.body && event.target !== document.documentElement) {
               hoveredElement = event.target;
-              console.log('Element hovered:', event.target.tagName, 'Edit mode:', isEditModeEnabled);
               
               const rect = event.target.getBoundingClientRect();
               const message = {
@@ -100,10 +98,9 @@ export async function GET(req: NextRequest) {
                     width: rect.width,
                     height: rect.height
                   },
-                  element: event.target.outerHTML.substring(0, 200)
+                  element: event.target.outerHTML
                 }
               };
-              console.log('Sending message to parent:', message);
               parent.postMessage(message, '*');
             }
           });
@@ -134,7 +131,7 @@ export async function GET(req: NextRequest) {
                     width: rect.width,
                     height: rect.height
                   },
-                  element: event.target.outerHTML.substring(0, 200)
+                  element: event.target.outerHTML
                 }
               }, '*');
             } else {
@@ -195,14 +192,11 @@ export async function GET(req: NextRequest) {
           
           // Listen for messages from parent
           window.addEventListener('message', function(event) {
-            console.log('Iframe received message from parent:', event.data);
             if (event.data.type === 'ENABLE_EDIT_MODE') {
-              console.log('Enabling edit mode');
               isEditModeEnabled = true;
               document.body.style.userSelect = 'none';
               document.body.style.pointerEvents = 'auto';
             } else if (event.data.type === 'DISABLE_EDIT_MODE') {
-              console.log('Disabling edit mode');
               isEditModeEnabled = false;
               document.body.style.userSelect = '';
               document.body.style.pointerEvents = '';

components/editor/preview/index.tsx

@@ -92,6 +92,7 @@ export const Preview = ({ isNew }: { isNew: boolean }) => {
             const mockElement = {
               tagName: data.tagName,
               getBoundingClientRect: () => data.rect,
+              outerHTML: data.element,
             };
             setSelectedElement(mockElement as any);
             setIsEditableModeEnabled(false);

hooks/useAi.ts

@@ -250,6 +250,7 @@ export const useAi = (onScrollToBottom?: () => void) => {
   const callAiFollowUp = async (prompt: string, enhancedSettings?: EnhancedSettings) => {
     if (isAiWorking) return;
     if (!prompt.trim()) return;
+
     
     setIsAiWorking(true);
     
@@ -265,7 +266,7 @@ export const useAi = (onScrollToBottom?: () => void) => {
           previousPrompts: prompts,
           model,
           pages,
-          selectedElementHtml: selectedElement,
+          selectedElementHtml: selectedElement?.outerHTML,
           files: selectedFiles,
           repoId: project?.space_id
         }),
@@ -311,7 +312,9 @@ export const useAi = (onScrollToBottom?: () => void) => {
         setIsEditableModeEnabled(false);
         if (audio.current) audio.current.play();
         if (iframe) {
-          iframe.src = iframe.src;
+          setTimeout(() => {
+            iframe.src = iframe.src;
+          }, 500);
         }
 
         return { success: true, html: res.html, updatedLines: res.updatedLines };