phase 6 ,7,9

frontend/src/pages/Thinker/Prompts.tsx

@@ -57,6 +57,13 @@ const PROMPT_TYPES = [
     icon: '🚫',
     color: 'red',
   },
+  {
+    key: 'site_structure_generation',
+    label: 'Site Structure Generation',
+    description: 'Generate site structure from business brief. Use [IGNY8_BUSINESS_BRIEF], [IGNY8_OBJECTIVES], [IGNY8_STYLE], and [IGNY8_SITE_INFO] to inject data.',
+    icon: '🏗️',
+    color: 'teal',
+  },
 ];
 
 export default function Prompts() {
@@ -426,6 +433,87 @@ export default function Prompts() {
             })}
           </div>
         </div>
+
+        {/* Site Builder Prompts Section */}
+        <div className="mb-8">
+          <div className="mb-4">
+            <h2 className="text-xl font-semibold text-gray-800 dark:text-white mb-1">
+              Site Builder
+            </h2>
+            <p className="text-sm text-gray-600 dark:text-gray-400">
+              Configure AI prompt templates for site structure generation
+            </p>
+          </div>
+
+          {/* Site Structure Generation Prompt */}
+          <div className="rounded-2xl border border-gray-200 bg-white dark:border-gray-800 dark:bg-gray-900">
+            {PROMPT_TYPES.filter(t => t.key === 'site_structure_generation').map((type) => {
+              const prompt = prompts[type.key] || {
+                prompt_type: type.key,
+                prompt_type_display: type.label,
+                prompt_value: '',
+                default_prompt: '',
+                is_active: true,
+              };
+
+              return (
+                <div key={type.key}>
+                  <div className="p-5 border-b border-gray-200 dark:border-gray-800">
+                    <div className="flex items-center justify-between">
+                      <div className="flex items-center gap-3">
+                        <span className="text-2xl">{type.icon}</span>
+                        <div>
+                          <h3 className="text-lg font-semibold text-gray-800 dark:text-white">
+                            {type.label}
+                          </h3>
+                          <p className="text-sm text-gray-600 dark:text-gray-400 mt-1">
+                            {type.description}
+                          </p>
+                          <div className="mt-2 text-xs text-gray-500 dark:text-gray-500">
+                            <p className="font-semibold mb-1">Available Variables:</p>
+                            <ul className="list-disc list-inside space-y-1">
+                              <li><code className="bg-gray-100 dark:bg-gray-800 px-1 rounded">[IGNY8_BUSINESS_BRIEF]</code> - Business description and context</li>
+                              <li><code className="bg-gray-100 dark:bg-gray-800 px-1 rounded">[IGNY8_OBJECTIVES]</code> - Site objectives and goals</li>
+                              <li><code className="bg-gray-100 dark:bg-gray-800 px-1 rounded">[IGNY8_STYLE]</code> - Design style preferences</li>
+                              <li><code className="bg-gray-100 dark:bg-gray-800 px-1 rounded">[IGNY8_SITE_INFO]</code> - Site type and requirements</li>
+                            </ul>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div className="p-5">
+                    <TextArea
+                      value={prompt.prompt_value || ''}
+                      onChange={(value) => handlePromptChange(type.key, value)}
+                      rows={15}
+                      placeholder="Enter prompt template for site structure generation..."
+                      className="font-mono-custom text-sm"
+                    />
+                    <div className="flex gap-3 mt-4">
+                      <Button
+                        onClick={() => handleSave(type.key)}
+                        disabled={saving[type.key]}
+                        className="flex-1"
+                        variant="solid"
+                        color="primary"
+                      >
+                        {saving[type.key] ? 'Saving...' : 'Save Prompt'}
+                      </Button>
+                      <Button
+                        onClick={() => handleReset(type.key)}
+                        disabled={saving[type.key]}
+                        variant="outline"
+                      >
+                        Reset to Default
+                      </Button>
+                    </div>
+                  </div>
+                </div>
+              );
+            })}
+          </div>
+        </div>
       </div>
     </>
   );