update

app/api/ask-ai/route.ts

@@ -197,7 +197,7 @@ export async function PUT(request: NextRequest) {
   const userToken = request.cookies.get(MY_TOKEN_KEY())?.value;
 
   const body = await request.json();
-  const { prompt, previousPrompt, provider, selectedElementHtml, model, pages, files } =
+  const { prompt, previousPrompts, provider, selectedElementHtml, model, pages, files, } =
     body;
 
   if (!prompt || pages.length === 0) {
@@ -270,8 +270,8 @@ export async function PUT(request: NextRequest) {
           },
           {
             role: "user",
-            content: previousPrompt
-              ? previousPrompt
+            content: previousPrompts
+              ? `Also here are the previous prompts:\n\n${previousPrompts.map((p: string) => `- ${p}`).join("\n")}`
               : "You are modifying the HTML file based on the user's request.",
           },
           {

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

@@ -172,6 +172,10 @@ export async function PUT(
   };
 
   const files: File[] = [];
+  const promptsFile = new File([prompts.join("\n")], "prompts.txt", {
+    type: "text/plain",
+  });
+  files.push(promptsFile);
   pages.forEach((page: Page) => {
     const file = new File([page.html], page.path, { type: "text/html" });
     files.push(file);
@@ -188,7 +192,6 @@ export async function PUT(
     {
       $set: {
         prompts: [
-          ...(project && "prompts" in project ? project.prompts : []),
           ...prompts,
         ],
       },

app/api/me/projects/route.ts

@@ -96,7 +96,10 @@ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-
     const readmeFile = new File([readme], "README.md", {
       type: "text/markdown",
     });
-    const files = [readmeFile];
+    const promptsFile = new File([prompts.join("\n")], "prompts.txt", {
+      type: "text/plain",
+    });
+    const files = [readmeFile, promptsFile];
     pages.forEach((page: Page) => {
       const file = new File([page.html], page.path, { type: "text/html" });
       files.push(file);

components/editor/ask-ai/index.tsx

@@ -72,7 +72,6 @@ export function AskAI({
 
   const [open, setOpen] = useState(false);
   const [prompt, setPrompt] = useState("");
-  const [previousPrompt, setPreviousPrompt] = useState("");
   const [provider, setProvider] = useLocalStorage("provider", "auto");
   const [model, setModel] = useLocalStorage("model", MODELS[0].value);
   const [openProvider, setOpenProvider] = useState(false);
@@ -121,7 +120,7 @@ export function AskAI({
         prompt,
         model,
         provider,
-        previousPrompt,
+        previousPrompts,
         selectedElementHtml,
         selectedFiles
       );
@@ -132,7 +131,6 @@ export function AskAI({
       }
 
       if (result?.success) {
-        setPreviousPrompt(prompt);
         setPrompt("");
       }
     } else if (isFollowUp && pages.length > 1 && isSameHtml) {
@@ -152,7 +150,6 @@ export function AskAI({
       }
 
       if (result?.success) {
-        setPreviousPrompt(prompt);
         setPrompt("");
       }
     } else {
@@ -173,7 +170,6 @@ export function AskAI({
       }
 
       if (result?.success) {
-        setPreviousPrompt(prompt);
         setPrompt("");
         if (selectedModel?.isThinker) {
           setModel(MODELS[0].value);
@@ -285,13 +281,11 @@ export function AskAI({
         )}
         <div className="w-full relative flex items-center justify-between">
           {(isAiWorking || isUploading) && (
-            <div className="absolute bg-neutral-800 rounded-lg top-0 left-4 w-[calc(100%-30px)] h-full z-1 flex items-start pt-3.5 justify-between max-lg:text-sm">
+            <div className="absolute bg-neutral-800 top-0 left-4 w-[calc(100%-30px)] h-full z-1 flex items-start pt-3.5 justify-between max-lg:text-sm">
               <div className="flex items-center justify-start gap-2">
                 <Loading overlay={false} className="!size-4" />
                 <p className="text-neutral-400 text-sm">
-                  {isUploading
-                    ? "Uploading images..."
-                    : `AI is ${isThinking ? "thinking" : "coding"}...`}
+                  {isUploading ? "Uploading images..." : "AI is working..."}
                 </p>
               </div>
               {isAiWorking && (

components/editor/ask-ai/uploader.tsx

@@ -187,6 +187,7 @@ export const Uploader = ({
         size="iconXs"
         variant="outline"
         className="!border-neutral-600 !text-neutral-400 !hover:!border-neutral-500 hover:!text-neutral-300"
+        onClick={() => setOpen(true)}
       >
         <Images className="size-4" />
       </Button>

components/editor/index.tsx

@@ -39,10 +39,11 @@ export const AppEditor = ({
   images?: string[];
   isNew?: boolean;
 }) => {
+  console.log(project?.prompts);
   const [htmlStorage, , removeHtmlStorage] = useLocalStorage("pages");
   const [, copyToClipboard] = useCopyToClipboard();
   const { htmlHistory, setHtmlHistory, prompts, setPrompts, pages, setPages } =
-    useEditor(initialPages);
+    useEditor(initialPages, project?.prompts ?? []);
 
   const searchParams = useSearchParams();
   const router = useRouter();
@@ -292,7 +293,7 @@ export const AppEditor = ({
                 images={images}
                 currentPage={currentPageData}
                 htmlHistory={htmlHistory}
-                previousPrompts={project?.prompts ?? []}
+                previousPrompts={prompts}
                 onSuccess={(newPages, p: string) => {
                   const currentHistory = [...htmlHistory];
                   currentHistory.unshift({

hooks/useCallAi.ts

@@ -237,7 +237,7 @@ export const useCallAi = ({
     }
   };
 
-  const callAiFollowUp = async (prompt: string, model: string | undefined, provider: string | undefined, previousPrompt: string, selectedElementHtml?: string, files?: string[]) => {
+  const callAiFollowUp = async (prompt: string, model: string | undefined, provider: string | undefined, previousPrompts: string[], selectedElementHtml?: string, files?: string[]) => {
     if (isAiWorking) return;
     if (!prompt.trim()) return;
     
@@ -254,7 +254,7 @@ export const useCallAi = ({
         body: JSON.stringify({
           prompt,
           provider,
-          previousPrompt,
+          previousPrompts,
           model,
           pages,
           selectedElementHtml,

hooks/useEditor.ts

@@ -2,7 +2,7 @@ import { defaultHTML } from "@/lib/consts";
 import { HtmlHistory, Page } from "@/types";
 import { useState } from "react";
 
-export const useEditor = (initialPages?: Page[]) => {
+export const useEditor = (initialPages?: Page[], initialPrompts?: string[]) => {
   /**
    * State to manage the HTML content of the editor.
    * This will be the main content that users edit.
@@ -23,7 +23,9 @@ export const useEditor = (initialPages?: Page[]) => {
    * State to manage the prompts used for generating HTML content.
    * This can be used to track what prompts were used in the editor.
    */
-  const [prompts, setPrompts] = useState<string[]>([]);
+  const [prompts, setPrompts] = useState<string[]>(
+    initialPrompts ?? []
+  );
 
 
   return {