fix custom template

sparrow-js · sparrow-js · commit a6e2d8ea6400 · 2024-01-24T11:50:04.000+08:00
diff --git a/service/events/prompts.ts b/service/events/prompts.ts
@@ -612,11 +612,28 @@ In terms of libraries,
 - You can use Google Fonts
 - Font Awesome for icons: <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"></link>
 
+Code can be modified locally,
+
+- Can use the element attribute data-uid="$id" to find the element and modify it.
+- If need to delete, Delete the element use attribute data-uid="$id" like so:
+input:
+<div>
+    <h2>*</h2>
+    <div data-uid="$id">
+      ****
+    </div>
+</div>
+
+output:
+<div>
+    <h2>*</h2>
+</div>
+
 Return only the full code in <html></html> tags.
 Do not include markdown "\`\`\`" or "\`\`\`html" at the start or end.
-"""
+`
 
-IMPORTED_CODE_BOOTSTRAP_SYSTEM_PROMPT = """
+const IMPORTED_CODE_BOOTSTRAP_SYSTEM_PROMPT = `
 You are an expert Bootstrap developer.
 
 - Do not add comments in the code such as "<!-- Add other navigation links as needed -->" and "<!-- ... other news items ... -->" in place of writing the full code. WRITE THE FULL CODE.
@@ -629,6 +646,23 @@ In terms of libraries,
 - You can use Google Fonts
 - Font Awesome for icons: <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"></link>
 
+Code can be modified locally,
+
+- Can use the element attribute data-uid="$id" to find the element and modify it.
+- If need to delete, Delete the element use attribute data-uid="$id" like so:
+input:
+<div>
+    <h2>*</h2>
+    <div data-uid="$id">
+      ****
+    </div>
+</div>
+
+output:
+<div>
+    <h2>*</h2>
+</div>
+
 Return only the full code in <html></html> tags.
 Do not include markdown "\`\`\`" or "\`\`\`html" at the start or end.
 `
@@ -655,6 +689,23 @@ In terms of libraries,
     <script nomodule src="https://cdn.jsdelivr.net/npm/ionicons/dist/esm/ionicons.min.js"></script>
     <link href="https://cdn.jsdelivr.net/npm/ionicons/dist/collection/components/icon/icon.min.css" rel="stylesheet">
 
+Code can be modified locally,
+
+- Can use the element attribute data-uid="$id" to find the element and modify it.
+- If need to delete, Delete the element use attribute data-uid="$id" like so:
+input:
+<div>
+    <h2>*</h2>
+    <div data-uid="$id">
+      ****
+    </div>
+</div>
+
+output:
+<div>
+    <h2>*</h2>
+</div>
+
 Return only the full code in <html></html> tags.
 Do not include markdown "\`\`\`" or "\`\`\`html" at the start or end.
 `;
@@ -687,6 +738,23 @@ In terms of libraries,
 - You can use Google Fonts
 - Font Awesome for icons: <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"></link>
 
+Code can be modified locally,
+
+- Can use the element attribute data-uid="$id" to find the element and modify it.
+- If need to delete, Delete the element use attribute data-uid="$id" like so:
+input:
+<div>
+    <h2>*</h2>
+    <div data-uid="$id">
+      ****
+    </div>
+</div>
+
+output:
+<div>
+    <h2>*</h2>
+</div>
+
 Return only the full code in <html></html> tags.
 Do not include markdown "\`\`\`" or "\`\`\`html" at the start or end.
 The return result must only include the code.
