sonance-brand-mcp 1.3.101 → 1.3.102

package/dist/assets/api/sonance-vision-apply/route.ts

@@ -1519,53 +1519,37 @@ function buildPhase2DesignPrompt(problems: DesignProblem[]): string {
     return ''; // No problems identified, skip design protocol
   }
 
-  const problemsJson = JSON.stringify(problems, null, 2);
+  // Create a simple, readable list of problems (no JSON complexity)
+  const problemsList = problems.map(p => `• ${p.description}`).join('\n');
   
   return `
 ═══════════════════════════════════════════════════════════════════════════════
-PHASE 2: TARGETED PATCH GENERATION
+DESIGN ISSUES TO FIX
 ═══════════════════════════════════════════════════════════════════════════════
 
-A visual analysis identified these specific problems in the UI:
+These visual issues were identified:
+${problemsList}
 
-${problemsJson}
+Fix these issues by modifying the code below.
 
-YOUR TASK: Generate patches that fix ONLY these specific problems.
+⚠️ CRITICAL - EXACT CODE MATCHING:
+Your "search" string MUST be copied CHARACTER-FOR-CHARACTER from the file.
+Use the line numbers on the left to find the exact code.
 
-STRICT RULES:
-1. Each patch MUST include a "problemId" field referencing one of the problems above
-2. Do NOT make changes unrelated to the identified problems
-3. Make the SMALLEST change that fixes each problem
-4. Do NOT change layout systems (flex→grid) unless absolutely necessary to fix a problem
-5. Preserve existing structure - adjust properties, don't restructure
+EXAMPLE:
+If line 42 shows:    42| <div className="mt-6 flex items-center">
+Your search must be: <div className="mt-6 flex items-center">
 
-For each problem, find the exact code that causes it and create a targeted fix.
+DO NOT:
+- Combine multiple lines into one search string
+- Add or remove classes/attributes
+- Invent code that "should" exist
+- Guess at the structure
 
-OUTPUT FORMAT (note the problemId and rationale fields):
-{
-  "modifications": [{
-    "filePath": "components/Example.tsx",
-    "patches": [
-      {
-        "problemId": "grouping-1",
-        "search": "<Badge className=\"absolute right-4\">",
-        "replace": "<Badge className=\"ml-2\">",
-        "rationale": "Removes absolute positioning to group badge with label"
-      },
-      {
-        "problemId": "spacing-1",
-        "search": "className=\"mt-8\"",
-        "replace": "className=\"mt-4\"",
-        "rationale": "Reduces excessive vertical gap"
-      }
-    ]
-  }]
-}
-
-VALIDATION:
-- Patches without a valid problemId will be REJECTED
-- Patches that don't trace to an identified problem will be REJECTED
-- Each patch must have search, replace, problemId, and rationale fields
+DO:
+- Copy the exact text from the numbered lines
+- Make small, targeted changes in the "replace" field
+- Keep patches focused on one change each
 `;
 }
 
@@ -2664,36 +2648,17 @@ This is better than generating patches with made-up code.`,
           // New patch-based approach
           console.log(`[Apply-First] Applying ${mod.patches.length} patches to ${mod.filePath}`);
           
-          // DESIGN VALIDATION: For design-heavy requests, validate patches have problemIds
-          let patchesToApply = mod.patches;
+          // Use patches directly - simplified approach focuses on exact code matching
+          // rather than problemId validation (which was causing LLM to prioritize
+          // problem-solving over exact code copying)
+          const patchesToApply = mod.patches;
+          
           if (isDesignRequest && identifiedProblems.length > 0) {
-            const validationResult = validateDesignPatches(mod.patches, identifiedProblems);
-            
-            if (validationResult.rejected.length > 0) {
-              debugLog("Design patch validation rejected some patches", {
-                filePath: mod.filePath,
-                validCount: validationResult.valid.length,
-                rejectedCount: validationResult.rejected.length,
-                rejectedReasons: validationResult.rejected.map(r => r.reason)
-              });
-              console.warn(`[Apply-First] ${validationResult.rejected.length} patches rejected for missing/invalid problemId`);
-            }
-            
-            // Only use validated patches
-            if (validationResult.valid.length === 0) {
-              patchErrors.push(`${mod.filePath}: All patches were rejected - they don't reference identified problems`);
-              continue;
-            }
-            
-            // Log which problems are being fixed
-            const problemsBeingFixed = [...new Set(validationResult.valid.map(p => p.problemId))];
-            debugLog("Design patches validated", {
+            debugLog("Design patches received", {
               filePath: mod.filePath,
-              problemsBeingFixed,
-              patchCount: validationResult.valid.length
+              patchCount: patchesToApply.length,
+              problemsIdentified: identifiedProblems.length
             });
-            
-            patchesToApply = validationResult.valid;
           }
           
           // PRE-VALIDATION: Check if all search strings exist in the file BEFORE applying

package/dist/assets/api/sonance-vision-edit/route.ts

@@ -1515,53 +1515,37 @@ function buildPhase2DesignPrompt(problems: DesignProblem[]): string {
     return ''; // No problems identified, skip design protocol
   }
 
-  const problemsJson = JSON.stringify(problems, null, 2);
+  // Create a simple, readable list of problems (no JSON complexity)
+  const problemsList = problems.map(p => `• ${p.description}`).join('\n');
   
   return `
 ═══════════════════════════════════════════════════════════════════════════════
-PHASE 2: TARGETED PATCH GENERATION
+DESIGN ISSUES TO FIX
 ═══════════════════════════════════════════════════════════════════════════════
 
-A visual analysis identified these specific problems in the UI:
+These visual issues were identified:
+${problemsList}
 
-${problemsJson}
+Fix these issues by modifying the code below.
 
-YOUR TASK: Generate patches that fix ONLY these specific problems.
+⚠️ CRITICAL - EXACT CODE MATCHING:
+Your "search" string MUST be copied CHARACTER-FOR-CHARACTER from the file.
+Use the line numbers on the left to find the exact code.
 
-STRICT RULES:
-1. Each patch MUST include a "problemId" field referencing one of the problems above
-2. Do NOT make changes unrelated to the identified problems
-3. Make the SMALLEST change that fixes each problem
-4. Do NOT change layout systems (flex→grid) unless absolutely necessary to fix a problem
-5. Preserve existing structure - adjust properties, don't restructure
+EXAMPLE:
+If line 42 shows:    42| <div className="mt-6 flex items-center">
+Your search must be: <div className="mt-6 flex items-center">
 
-For each problem, find the exact code that causes it and create a targeted fix.
+DO NOT:
+- Combine multiple lines into one search string
+- Add or remove classes/attributes
+- Invent code that "should" exist
+- Guess at the structure
 
-OUTPUT FORMAT (note the problemId and rationale fields):
-{
-  "modifications": [{
-    "filePath": "components/Example.tsx",
-    "patches": [
-      {
-        "problemId": "grouping-1",
-        "search": "<Badge className=\"absolute right-4\">",
-        "replace": "<Badge className=\"ml-2\">",
-        "rationale": "Removes absolute positioning to group badge with label"
-      },
-      {
-        "problemId": "spacing-1",
-        "search": "className=\"mt-8\"",
-        "replace": "className=\"mt-4\"",
-        "rationale": "Reduces excessive vertical gap"
-      }
-    ]
-  }]
-}
-
-VALIDATION:
-- Patches without a valid problemId will be REJECTED
-- Patches that don't trace to an identified problem will be REJECTED
-- Each patch must have search, replace, problemId, and rationale fields
+DO:
+- Copy the exact text from the numbered lines
+- Make small, targeted changes in the "replace" field
+- Keep patches focused on one change each
 `;
 }
 
@@ -2632,41 +2616,17 @@ This is better than generating patches with made-up code.`,
           // New patch-based approach
           console.log(`[Vision Mode] Applying ${mod.patches.length} patches to ${mod.filePath}`);
           
-          // DESIGN VALIDATION: For design-heavy requests, validate patches have problemIds
-          let patchesToApply = mod.patches;
+          // Use patches directly - simplified approach focuses on exact code matching
+          // rather than problemId validation (which was causing LLM to prioritize
+          // problem-solving over exact code copying)
+          const patchesToApply = mod.patches;
+          
           if (isDesignRequest && identifiedProblems.length > 0) {
-            const validationResult = validateDesignPatches(mod.patches, identifiedProblems);
-            
-            if (validationResult.rejected.length > 0) {
-              debugLog("Design patch validation rejected some patches", {
-                filePath: mod.filePath,
-                validCount: validationResult.valid.length,
-                rejectedCount: validationResult.rejected.length,
-                rejectedReasons: validationResult.rejected.map(r => r.reason)
-              });
-              console.warn(`[Vision Mode] ${validationResult.rejected.length} patches rejected for missing/invalid problemId`);
-            }
-            
-            // Only use validated patches
-            if (validationResult.valid.length === 0) {
-              patchErrors.push(`${mod.filePath}: All patches were rejected - they don't reference identified problems`);
-              continue;
-            }
-            
-            // Log which problems are being fixed
-            const problemsBeingFixed = [...new Set(validationResult.valid.map(p => p.problemId))];
-            debugLog("Design patches validated", {
+            debugLog("Design patches received", {
               filePath: mod.filePath,
-              problemsBeingFixed,
-              patchCount: validationResult.valid.length
+              patchCount: patchesToApply.length,
+              problemsIdentified: identifiedProblems.length
             });
-            
-            // Map validated patches to Patch interface (rationale -> explanation)
-            patchesToApply = validationResult.valid.map(p => ({
-              search: p.search,
-              replace: p.replace,
-              explanation: `[${p.problemId}] ${p.rationale}`
-            }));
           }
           
           // PRE-VALIDATION: Check if all search strings exist in the file BEFORE applying

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sonance-brand-mcp",
-  "version": "1.3.101",
+  "version": "1.3.102",
   "description": "MCP Server for Sonance Brand Guidelines and Component Library - gives Claude instant access to brand colors, typography, and UI components.",
   "main": "dist/index.js",
   "type": "module",