Spaces:
Sleeping
Sleeping
toto (#2)
Browse files- refactor: Improve AI prompt for better HTML generation and code structure (891e1dcde5faaac21c71dfb80023877f738e1127)
Co-authored-by: Victor Mustar <[email protected]>
src/components/ask-ai/ask-ai.tsx
CHANGED
|
@@ -25,10 +25,11 @@ function AskAI({
|
|
| 25 |
const [previousPrompt, setPreviousPrompt] = useState("");
|
| 26 |
|
| 27 |
const callAi = async () => {
|
| 28 |
-
if (isAiWorking) return;
|
| 29 |
setisAiWorking(true);
|
| 30 |
|
| 31 |
let contentResponse = "";
|
|
|
|
| 32 |
try {
|
| 33 |
const request = await fetch("/api/ask-ai", {
|
| 34 |
method: "POST",
|
|
@@ -64,6 +65,13 @@ function AskAI({
|
|
| 64 |
setPreviousPrompt(prompt);
|
| 65 |
setisAiWorking(false);
|
| 66 |
setHasAsked(true);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 67 |
return;
|
| 68 |
}
|
| 69 |
|
|
@@ -71,8 +79,20 @@ function AskAI({
|
|
| 71 |
contentResponse += chunk;
|
| 72 |
const newHtml = contentResponse.match(/<!DOCTYPE html>[\s\S]*/)?.[0];
|
| 73 |
if (newHtml) {
|
| 74 |
-
|
| 75 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 76 |
onScrollToBottom();
|
| 77 |
}
|
| 78 |
}
|
|
|
|
| 25 |
const [previousPrompt, setPreviousPrompt] = useState("");
|
| 26 |
|
| 27 |
const callAi = async () => {
|
| 28 |
+
if (isAiWorking || !prompt.trim()) return;
|
| 29 |
setisAiWorking(true);
|
| 30 |
|
| 31 |
let contentResponse = "";
|
| 32 |
+
let lastRenderTime = 0;
|
| 33 |
try {
|
| 34 |
const request = await fetch("/api/ask-ai", {
|
| 35 |
method: "POST",
|
|
|
|
| 65 |
setPreviousPrompt(prompt);
|
| 66 |
setisAiWorking(false);
|
| 67 |
setHasAsked(true);
|
| 68 |
+
|
| 69 |
+
// Now we have the complete HTML including </html>, so set it to be sure
|
| 70 |
+
const finalDoc = contentResponse.match(/<!DOCTYPE html>[\s\S]*<\/html>/)?.[0];
|
| 71 |
+
if (finalDoc) {
|
| 72 |
+
setHtml(finalDoc);
|
| 73 |
+
}
|
| 74 |
+
|
| 75 |
return;
|
| 76 |
}
|
| 77 |
|
|
|
|
| 79 |
contentResponse += chunk;
|
| 80 |
const newHtml = contentResponse.match(/<!DOCTYPE html>[\s\S]*/)?.[0];
|
| 81 |
if (newHtml) {
|
| 82 |
+
// Force-close the HTML tag so the iframe doesn't render half-finished markup
|
| 83 |
+
let partialDoc = newHtml;
|
| 84 |
+
if (!partialDoc.includes("</html>")) {
|
| 85 |
+
partialDoc += "\n</html>";
|
| 86 |
+
}
|
| 87 |
+
|
| 88 |
+
// Throttle the re-renders to avoid flashing/flicker
|
| 89 |
+
const now = Date.now();
|
| 90 |
+
if (now - lastRenderTime > 300) {
|
| 91 |
+
setHtml(partialDoc);
|
| 92 |
+
lastRenderTime = now;
|
| 93 |
+
}
|
| 94 |
+
|
| 95 |
+
if (partialDoc.length > 200) {
|
| 96 |
onScrollToBottom();
|
| 97 |
}
|
| 98 |
}
|