fix(code | schema): handle route navigation with mismatch extensions + type schema node signature serialization fix

components/entities/semantic-schema/schemas/type.ts

@@ -21,13 +21,13 @@ export class TypeSchema extends SchemaNode {
 
   toString(options?: { color?: boolean }) {
     const bold = options?.color ? chalk.bold : (str: string) => str;
-    return `${bold(this.name)}: ${this.type.toString(options)}`;
+    return `type ${bold(this.name)}: ${this.type.toString(options)}`;
   }
 
   toFullSignature(options?: { showDocs?: boolean }): string {
     const typeSignature = this.type.toFullSignature(options);
 
-    let signature = `${this.name}: ${typeSignature}`;
+    let signature = `type ${this.name}: ${typeSignature}`;
 
     if (options?.showDocs && this.doc) {
       const docString = this.doc.toFullSignature();

components/ui/code-tab-page/code-tab-page.tsx

@@ -36,30 +36,88 @@ export type CodePageProps = {
   codeViewClassName?: string;
 } & HTMLAttributes<HTMLDivElement>;
 
-const resolveFilePath = (
+/**
+ * Resolves a requested file path against a file tree, handling extension mappings,
+ * parent directory traversal, and index files.
+ *
+ * @param requestedPath The path to resolve (can include ./, ../, etc)
+ * @param fileTree Array of available files
+ * @param mainFile Default file to return if no match is found
+ * @param loadingCode Whether code is currently loading
+ * @returns Resolved file path or undefined if loading
+ */
+export function resolveFilePath(
   requestedPath: string | undefined,
   fileTree: string[],
   mainFile: string,
   loadingCode: boolean
-) => {
+): string | undefined {
   if (loadingCode) return undefined;
   if (!requestedPath) return mainFile;
 
-  const normalized = path.normalize(requestedPath);
+  const normalized = path.resolve(requestedPath);
 
   if (fileTree.includes(normalized)) return normalized;
 
+  const requestedExt = path.extname(normalized);
+  const basePathWithoutExt = requestedExt ? normalized.slice(0, -requestedExt.length) : normalized;
+
+  const getTypeScriptVariants = (ext: string): string[] => {
+    switch (ext) {
+      case '.js':
+        return ['.ts', '.tsx'];
+      case '.jsx':
+        return ['.tsx'];
+      case '.mjs':
+        return ['.mts'];
+      case '.cjs':
+        return ['.cts'];
+      default:
+        return [];
+    }
+  };
+
+  const possibleExtensions = requestedExt
+    ? [requestedExt, ...getTypeScriptVariants(requestedExt)]
+    : ['.ts', '.tsx', '.js'];
+
   const possiblePaths = [
     normalized,
-    `${normalized}.ts`,
-    `${normalized}.js`,
-    path.join(normalized, 'index.ts'),
-    path.join(normalized, 'index.js'),
-  ];
-
-  const match = fileTree.find((file) => possiblePaths.includes(file));
-  return match || mainFile;
-};
+    ...possibleExtensions.map((ext) => `${basePathWithoutExt}${ext}`),
+    ...possibleExtensions.map((ext) => path.join(normalized, `index${ext}`)),
+    ...possibleExtensions.map((ext) => path.join(basePathWithoutExt, `index${ext}`)),
+  ].map((p) => path.resolve(p));
+
+  const matchingFiles = fileTree.filter((file) => possiblePaths.includes(path.resolve(file)));
+
+  if (matchingFiles.length > 0) {
+    if (matchingFiles.includes(normalized)) {
+      return normalized;
+    }
+
+    const ordered = matchingFiles.sort((a, b) => {
+      const extA = path.extname(a);
+      const extB = path.extname(b);
+
+      if (extA === requestedExt && extB !== requestedExt) return -1;
+      if (extB === requestedExt && extA !== requestedExt) return 1;
+
+      const isTypeScriptA = ['.ts', '.tsx'].includes(extA);
+      const isTypeScriptB = ['.ts', '.tsx'].includes(extB);
+      if (isTypeScriptA && !isTypeScriptB) return -1;
+      if (isTypeScriptB && !isTypeScriptA) return 1;
+
+      if (extA === '.ts' && extB === '.tsx') return -1;
+      if (extA === '.tsx' && extB === '.ts') return 1;
+
+      return a.length - b.length;
+    });
+
+    return ordered[0];
+  }
+
+  return mainFile;
+}
 
 export function CodePage({ className, fileIconSlot, host, codeViewClassName }: CodePageProps) {
   const urlParams = useCodeParams();