sonance-brand-mcp 1.3.29 → 1.3.31

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

@@ -746,17 +746,23 @@ function gatherAllImports(
   maxDepth: number = 4
 ): { path: string; content: string }[] {
   // Prevent infinite loops and limit total files
-  if (visited.has(filePath) || visited.size > 50) return [];
+  if (visited.has(filePath) || visited.size > 50) {
+    return [];
+  }
   visited.add(filePath);
   
   const results: { path: string; content: string }[] = [];
   const fullPath = path.join(projectRoot, filePath);
   
-  if (!fs.existsSync(fullPath)) return results;
+  if (!fs.existsSync(fullPath)) {
+    debugLog("[apply] gatherAllImports: file not found", { filePath, fullPath });
+    return results;
+  }
   
   try {
     const content = fs.readFileSync(fullPath, "utf-8");
     results.push({ path: filePath, content });
+    debugLog("[apply] gatherAllImports: added file", { filePath, contentLength: content.length });
     
     // Continue recursing if we haven't hit max depth
     if (maxDepth > 0) {
@@ -769,8 +775,8 @@ function gatherAllImports(
         }
       }
     }
-  } catch {
-    // Skip files that can't be read
+  } catch (e) {
+    debugLog("[apply] gatherAllImports: error reading file", { filePath, error: String(e) });
   }
   
   return results;
@@ -1081,7 +1087,8 @@ function findDynamicRoute(cleanRoute: string, projectRoot: string): string | nul
 }
 
 function extractImports(content: string): string[] {
-  const importRegex = /import\s+.*?\s+from\s+["'](@\/components\/[^"']+|\.\.?\/[^"']+)["']/g;
+  // Match ALL @/ imports (not just @/components) and relative imports
+  const importRegex = /import\s+.*?\s+from\s+["'](@\/[^"']+|\.\.?\/[^"']+)["']/g;
   const imports: string[] = [];
   let match;
 
@@ -1089,32 +1096,134 @@ function extractImports(content: string): string[] {
     imports.push(match[1]);
   }
 
+  debugLog("[apply] Extracted imports", { count: imports.length, imports: imports.slice(0, 10) });
   return imports;
 }
 
-function resolveImportPath(
-  importPath: string,
-  fromFile: string,
-  projectRoot: string
-): string | null {
-  if (importPath.startsWith("@/")) {
-    const resolved = importPath.replace("@/", "src/");
-    const withExt = resolved.endsWith(".tsx") ? resolved : `${resolved}.tsx`;
+// Cache for tsconfig path aliases
+let cachedPathAliases: Map<string, string> | null = null;
+let cachedProjectRoot: string | null = null;
+
+/**
+ * Read and parse tsconfig.json to get path aliases
+ */
+function getPathAliases(projectRoot: string): Map<string, string> {
+  // Return cached if same project
+  if (cachedPathAliases && cachedProjectRoot === projectRoot) {
+    return cachedPathAliases;
+  }
+
+  const aliases = new Map<string, string>();
+  
+  // Try to read tsconfig.json
+  const tsconfigPath = path.join(projectRoot, "tsconfig.json");
+  if (fs.existsSync(tsconfigPath)) {
+    try {
+      const content = fs.readFileSync(tsconfigPath, "utf-8");
+      // Remove comments (tsconfig allows them)
+      const cleanContent = content.replace(/\/\/.*$/gm, "").replace(/\/\*[\s\S]*?\*\//g, "");
+      const tsconfig = JSON.parse(cleanContent);
+      
+      const paths = tsconfig.compilerOptions?.paths || {};
+      const baseUrl = tsconfig.compilerOptions?.baseUrl || ".";
+      
+      // Parse path mappings
+      for (const [alias, targets] of Object.entries(paths)) {
+        if (Array.isArray(targets) && targets.length > 0) {
+          // Convert @/* to @/ and src/* to src/
+          const cleanAlias = alias.replace("/*", "/");
+          const cleanTarget = (targets[0] as string).replace("/*", "/").replace("./", "");
+          aliases.set(cleanAlias, cleanTarget);
+        }
+      }
+      
+      debugLog("[apply] Loaded tsconfig path aliases", { aliases: Object.fromEntries(aliases) });
+    } catch (e) {
+      debugLog("[apply] Failed to parse tsconfig.json", { error: String(e) });
+    }
+  }
+  
+  // If no @/ alias found, try common defaults
+  if (!aliases.has("@/")) {
+    // Check if src/ exists
+    if (fs.existsSync(path.join(projectRoot, "src"))) {
+      aliases.set("@/", "src/");
+    } else if (fs.existsSync(path.join(projectRoot, "app"))) {
+      // Next.js App Router without src/
+      aliases.set("@/", "");
+    } else {
+      aliases.set("@/", "");
+    }
+    debugLog("[apply] Using default @/ alias", { alias: aliases.get("@/") });
+  }
+  
+  cachedPathAliases = aliases;
+  cachedProjectRoot = projectRoot;
+  return aliases;
+}
+
+/**
+ * Try multiple file extensions for an import
+ */
+function tryFileExtensions(basePath: string, projectRoot: string): string | null {
+  const extensions = [".tsx", ".ts", ".jsx", ".js"];
+  
+  // First try exact path (if already has extension)
+  if (extensions.some(ext => basePath.endsWith(ext))) {
+    if (fs.existsSync(path.join(projectRoot, basePath))) {
+      return basePath;
+    }
+  }
+  
+  // Try each extension
+  for (const ext of extensions) {
+    const withExt = `${basePath}${ext}`;
     if (fs.existsSync(path.join(projectRoot, withExt))) {
       return withExt;
     }
-    const indexPath = `${resolved}/index.tsx`;
+  }
+  
+  // Try as directory with index file
+  for (const ext of extensions) {
+    const indexPath = `${basePath}/index${ext}`;
     if (fs.existsSync(path.join(projectRoot, indexPath))) {
       return indexPath;
     }
-    return withExt;
+  }
+  
+  return null;
+}
+
+function resolveImportPath(
+  importPath: string,
+  fromFile: string,
+  projectRoot: string
+): string | null {
+  const aliases = getPathAliases(projectRoot);
+  
+  // Handle aliased imports (e.g., @/, ~/, etc.)
+  for (const [alias, target] of aliases) {
+    if (importPath.startsWith(alias)) {
+      const resolved = importPath.replace(alias, target);
+      const result = tryFileExtensions(resolved, projectRoot);
+      if (result) {
+        debugLog("[apply] Resolved alias import", { importPath, resolved: result });
+        return result;
+      }
+      // Return best guess even if file not found
+      return `${resolved}.tsx`;
+    }
   }
 
+  // Handle relative imports
   if (importPath.startsWith(".")) {
     const dir = path.dirname(fromFile);
     const resolved = path.join(dir, importPath);
-    const withExt = resolved.endsWith(".tsx") ? resolved : `${resolved}.tsx`;
-    return withExt;
+    const result = tryFileExtensions(resolved, projectRoot);
+    if (result) {
+      return result;
+    }
+    return `${resolved}.tsx`;
   }
 
   return null;

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

@@ -614,17 +614,23 @@ function gatherAllImports(
   maxDepth: number = 4
 ): { path: string; content: string }[] {
   // Prevent infinite loops and limit total files
-  if (visited.has(filePath) || visited.size > 50) return [];
+  if (visited.has(filePath) || visited.size > 50) {
+    return [];
+  }
   visited.add(filePath);
   
   const results: { path: string; content: string }[] = [];
   const fullPath = path.join(projectRoot, filePath);
   
-  if (!fs.existsSync(fullPath)) return results;
+  if (!fs.existsSync(fullPath)) {
+    debugLog("[edit] gatherAllImports: file not found", { filePath, fullPath });
+    return results;
+  }
   
   try {
     const content = fs.readFileSync(fullPath, "utf-8");
     results.push({ path: filePath, content });
+    debugLog("[edit] gatherAllImports: added file", { filePath, contentLength: content.length });
     
     // Continue recursing if we haven't hit max depth
     if (maxDepth > 0) {
@@ -637,8 +643,8 @@ function gatherAllImports(
         }
       }
     }
-  } catch {
-    // Skip files that can't be read
+  } catch (e) {
+    debugLog("[edit] gatherAllImports: error reading file", { filePath, error: String(e) });
   }
   
   return results;
@@ -972,7 +978,8 @@ function findDynamicRoute(cleanRoute: string, projectRoot: string): string | nul
  * Extract import paths from file content
  */
 function extractImports(content: string): string[] {
-  const importRegex = /import\s+.*?\s+from\s+["'](@\/components\/[^"']+|\.\.?\/[^"']+)["']/g;
+  // Match ALL @/ imports (not just @/components) and relative imports
+  const importRegex = /import\s+.*?\s+from\s+["'](@\/[^"']+|\.\.?\/[^"']+)["']/g;
   const imports: string[] = [];
   let match;
 
@@ -980,9 +987,104 @@ function extractImports(content: string): string[] {
     imports.push(match[1]);
   }
 
+  debugLog("[edit] Extracted imports", { count: imports.length, imports: imports.slice(0, 10) });
   return imports;
 }
 
+// Cache for tsconfig path aliases
+let cachedPathAliases: Map<string, string> | null = null;
+let cachedProjectRoot: string | null = null;
+
+/**
+ * Read and parse tsconfig.json to get path aliases
+ */
+function getPathAliases(projectRoot: string): Map<string, string> {
+  // Return cached if same project
+  if (cachedPathAliases && cachedProjectRoot === projectRoot) {
+    return cachedPathAliases;
+  }
+
+  const aliases = new Map<string, string>();
+  
+  // Try to read tsconfig.json
+  const tsconfigPath = path.join(projectRoot, "tsconfig.json");
+  if (fs.existsSync(tsconfigPath)) {
+    try {
+      const content = fs.readFileSync(tsconfigPath, "utf-8");
+      // Remove comments (tsconfig allows them)
+      const cleanContent = content.replace(/\/\/.*$/gm, "").replace(/\/\*[\s\S]*?\*\//g, "");
+      const tsconfig = JSON.parse(cleanContent);
+      
+      const paths = tsconfig.compilerOptions?.paths || {};
+      const baseUrl = tsconfig.compilerOptions?.baseUrl || ".";
+      
+      // Parse path mappings
+      for (const [alias, targets] of Object.entries(paths)) {
+        if (Array.isArray(targets) && targets.length > 0) {
+          // Convert @/* to @/ and src/* to src/
+          const cleanAlias = alias.replace("/*", "/");
+          const cleanTarget = (targets[0] as string).replace("/*", "/").replace("./", "");
+          aliases.set(cleanAlias, cleanTarget);
+        }
+      }
+      
+      debugLog("[edit] Loaded tsconfig path aliases", { aliases: Object.fromEntries(aliases) });
+    } catch (e) {
+      debugLog("[edit] Failed to parse tsconfig.json", { error: String(e) });
+    }
+  }
+  
+  // If no @/ alias found, try common defaults
+  if (!aliases.has("@/")) {
+    // Check if src/ exists
+    if (fs.existsSync(path.join(projectRoot, "src"))) {
+      aliases.set("@/", "src/");
+    } else if (fs.existsSync(path.join(projectRoot, "app"))) {
+      // Next.js App Router without src/
+      aliases.set("@/", "");
+    } else {
+      aliases.set("@/", "");
+    }
+    debugLog("[edit] Using default @/ alias", { alias: aliases.get("@/") });
+  }
+  
+  cachedPathAliases = aliases;
+  cachedProjectRoot = projectRoot;
+  return aliases;
+}
+
+/**
+ * Try multiple file extensions for an import
+ */
+function tryFileExtensions(basePath: string, projectRoot: string): string | null {
+  const extensions = [".tsx", ".ts", ".jsx", ".js"];
+  
+  // First try exact path (if already has extension)
+  if (extensions.some(ext => basePath.endsWith(ext))) {
+    if (fs.existsSync(path.join(projectRoot, basePath))) {
+      return basePath;
+    }
+  }
+  
+  // Try each extension
+  for (const ext of extensions) {
+    const withExt = `${basePath}${ext}`;
+    if (fs.existsSync(path.join(projectRoot, withExt))) {
+      return withExt;
+    }
+  }
+  
+  // Try as directory with index file
+  for (const ext of extensions) {
+    const indexPath = `${basePath}/index${ext}`;
+    if (fs.existsSync(path.join(projectRoot, indexPath))) {
+      return indexPath;
+    }
+  }
+  
+  return null;
+}
+
 /**
  * Resolve an import path to a file system path
  */
@@ -991,28 +1093,31 @@ function resolveImportPath(
   fromFile: string,
   projectRoot: string
 ): string | null {
-  // Handle @ alias (maps to src/)
-  if (importPath.startsWith("@/")) {
-    const resolved = importPath.replace("@/", "src/");
-    // Try with .tsx extension
-    const withExt = resolved.endsWith(".tsx") ? resolved : `${resolved}.tsx`;
-    if (fs.existsSync(path.join(projectRoot, withExt))) {
-      return withExt;
-    }
-    // Try as directory with index
-    const indexPath = `${resolved}/index.tsx`;
-    if (fs.existsSync(path.join(projectRoot, indexPath))) {
-      return indexPath;
+  const aliases = getPathAliases(projectRoot);
+  
+  // Handle aliased imports (e.g., @/, ~/, etc.)
+  for (const [alias, target] of aliases) {
+    if (importPath.startsWith(alias)) {
+      const resolved = importPath.replace(alias, target);
+      const result = tryFileExtensions(resolved, projectRoot);
+      if (result) {
+        debugLog("[edit] Resolved alias import", { importPath, resolved: result });
+        return result;
+      }
+      // Return best guess even if file not found
+      return `${resolved}.tsx`;
     }
-    return withExt; // Return even if not found for context
   }
 
   // Handle relative imports
   if (importPath.startsWith(".")) {
     const dir = path.dirname(fromFile);
     const resolved = path.join(dir, importPath);
-    const withExt = resolved.endsWith(".tsx") ? resolved : `${resolved}.tsx`;
-    return withExt;
+    const result = tryFileExtensions(resolved, projectRoot);
+    if (result) {
+      return result;
+    }
+    return `${resolved}.tsx`;
   }
 
   return null;

package/dist/assets/dev-tools/SonanceDevTools.tsx

@@ -260,6 +260,35 @@ export function SonanceDevTools() {
     }
   }, [mounted, DEVTOOLS_POSITION_KEY]);
 
+  // Restore apply-first session from localStorage on mount
+  // This allows the Accept/Revert UI to survive page refreshes
+  useEffect(() => {
+    if (!mounted) return;
+    try {
+      const savedSession = localStorage.getItem("sonance-apply-first-session");
+      if (savedSession) {
+        const session = JSON.parse(savedSession);
+        // Check if session is recent (< 1 hour old)
+        const MAX_SESSION_AGE = 60 * 60 * 1000; // 1 hour
+        if (session.timestamp && Date.now() - session.timestamp < MAX_SESSION_AGE) {
+          console.log("[Apply-First] Restoring session from localStorage:", session.sessionId);
+          setApplyFirstSession(session);
+          setApplyFirstStatus("reviewing");
+          // Auto-open the DevTools panel so user sees the Accept/Revert UI
+          setIsOpen(true);
+          setActiveTab("components");
+        } else {
+          // Session expired, clear it
+          console.log("[Apply-First] Session expired, clearing localStorage");
+          localStorage.removeItem("sonance-apply-first-session");
+        }
+      }
+    } catch (e) {
+      console.warn("[Apply-First] Failed to restore session:", e);
+      localStorage.removeItem("sonance-apply-first-session");
+    }
+  }, [mounted]);
+
   // Drag handlers for movable panel
   const headerRef = useRef<HTMLDivElement>(null);
   
@@ -1097,6 +1126,17 @@ export function SonanceDevTools() {
     setApplyFirstStatus("waiting-hmr");
     setVisionModeActive(false);
 
+    // Persist session to localStorage so it survives page refreshes
+    try {
+      localStorage.setItem("sonance-apply-first-session", JSON.stringify({
+        ...session,
+        timestamp: Date.now(),
+      }));
+      console.log("[Apply-First] Session persisted to localStorage");
+    } catch (e) {
+      console.warn("[Apply-First] Failed to persist session:", e);
+    }
+
     // After a brief delay, assume HMR has completed
     setTimeout(() => {
       setApplyFirstStatus("reviewing");
@@ -1128,6 +1168,13 @@ export function SonanceDevTools() {
         setApplyFirstStatus("idle");
         setVisionFocusedElements([]);
         setChangedElements([]); // Clear highlights
+        // Clear persisted session from localStorage
+        try {
+          localStorage.removeItem("sonance-apply-first-session");
+          console.log("[Apply-First] Session cleared from localStorage");
+        } catch (e) {
+          console.warn("[Apply-First] Failed to clear session:", e);
+        }
       } else {
         console.error("[Apply-First] Accept failed:", result.error);
         setApplyFirstStatus("error");
@@ -1164,6 +1211,13 @@ export function SonanceDevTools() {
         setVisionFocusedElements([]);
         setChangedElements([]); // Clear highlights
         // HMR will automatically refresh with restored files
+        // Clear persisted session from localStorage
+        try {
+          localStorage.removeItem("sonance-apply-first-session");
+          console.log("[Apply-First] Session cleared from localStorage");
+        } catch (e) {
+          console.warn("[Apply-First] Failed to clear session:", e);
+        }
       } else {
         console.error("[Apply-First] Revert failed:", result.error);
         setApplyFirstStatus("error");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sonance-brand-mcp",
-  "version": "1.3.29",
+  "version": "1.3.31",
   "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",