@lobehub/lobehub 2.0.0-next.338 → 2.0.0-next.339

package/packages/model-runtime/src/core/contextBuilders/anthropic.ts

@@ -5,6 +5,19 @@ import OpenAI from 'openai';
 import { OpenAIChatMessage, UserMessageContentPart } from '../../types';
 import { parseDataUri } from '../../utils/uriParser';
 
+const ANTHROPIC_SUPPORTED_IMAGE_TYPES = new Set([
+  'image/jpeg',
+  'image/jpg',
+  'image/png',
+  'image/gif',
+  'image/webp',
+]);
+
+const isImageTypeSupported = (mimeType: string | null): boolean => {
+  if (!mimeType) return true;
+  return ANTHROPIC_SUPPORTED_IMAGE_TYPES.has(mimeType.toLowerCase());
+};
+
 export const buildAnthropicBlock = async (
   content: UserMessageContentPart,
 ): Promise<Anthropic.ContentBlock | Anthropic.ImageBlockParam | undefined> => {
@@ -23,7 +36,9 @@ export const buildAnthropicBlock = async (
     case 'image_url': {
       const { mimeType, base64, type } = parseDataUri(content.image_url.url);
 
-      if (type === 'base64')
+      if (type === 'base64') {
+        if (!isImageTypeSupported(mimeType)) return undefined;
+
         return {
           source: {
             data: base64 as string,
@@ -32,9 +47,13 @@ export const buildAnthropicBlock = async (
           },
           type: 'image',
         };
+      }
 
       if (type === 'url') {
         const { base64, mimeType } = await imageUrlToBase64(content.image_url.url);
+
+        if (!isImageTypeSupported(mimeType)) return undefined;
+
         return {
           source: {
             data: base64 as string,

package/packages/model-runtime/src/core/contextBuilders/google.test.ts

@@ -149,6 +149,48 @@ describe('google contextBuilders', () => {
         thoughtSignature: GEMINI_MAGIC_THOUGHT_SIGNATURE,
       });
     });
+
+    it('should return undefined for unsupported SVG image (base64)', async () => {
+      const svgBase64 =
+        'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==';
+
+      vi.mocked(parseDataUri).mockReturnValueOnce({
+        base64: 'PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==',
+        mimeType: 'image/svg+xml',
+        type: 'base64',
+      });
+
+      const content: UserMessageContentPart = {
+        image_url: { url: svgBase64 },
+        type: 'image_url',
+      };
+
+      const result = await buildGooglePart(content);
+      expect(result).toBeUndefined();
+    });
+
+    it('should return undefined for unsupported SVG image (URL)', async () => {
+      const svgUrl = 'https://example.com/image.svg';
+
+      vi.mocked(parseDataUri).mockReturnValueOnce({
+        base64: null,
+        mimeType: null,
+        type: 'url',
+      });
+
+      vi.spyOn(imageToBase64Module, 'imageUrlToBase64').mockResolvedValueOnce({
+        base64: 'PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==',
+        mimeType: 'image/svg+xml',
+      });
+
+      const content: UserMessageContentPart = {
+        image_url: { url: svgUrl },
+        type: 'image_url',
+      };
+
+      const result = await buildGooglePart(content);
+      expect(result).toBeUndefined();
+    });
   });
 
   describe('buildGoogleMessage', () => {

package/packages/model-runtime/src/core/contextBuilders/google.ts

@@ -11,6 +11,19 @@ import { ChatCompletionTool, OpenAIChatMessage, UserMessageContentPart } from '.
 import { safeParseJSON } from '../../utils/safeParseJSON';
 import { parseDataUri } from '../../utils/uriParser';
 
+const GOOGLE_SUPPORTED_IMAGE_TYPES = new Set([
+  'image/jpeg',
+  'image/jpg',
+  'image/png',
+  'image/gif',
+  'image/webp',
+]);
+
+const isImageTypeSupported = (mimeType: string | null): boolean => {
+  if (!mimeType) return true;
+  return GOOGLE_SUPPORTED_IMAGE_TYPES.has(mimeType.toLowerCase());
+};
+
 /**
  * Magic thoughtSignature
  * @see https://ai.google.dev/gemini-api/docs/thought-signatures#model-behavior:~:text=context_engineering_is_the_way_to_go
@@ -43,6 +56,8 @@ export const buildGooglePart = async (
           throw new TypeError("Image URL doesn't contain base64 data");
         }
 
+        if (!isImageTypeSupported(mimeType)) return undefined;
+
         return {
           inlineData: { data: base64, mimeType: mimeType || 'image/png' },
           thoughtSignature: GEMINI_MAGIC_THOUGHT_SIGNATURE,
@@ -52,6 +67,8 @@ export const buildGooglePart = async (
       if (type === 'url') {
         const { base64, mimeType } = await imageUrlToBase64(content.image_url.url);
 
+        if (!isImageTypeSupported(mimeType)) return undefined;
+
         return {
           inlineData: { data: base64, mimeType },
           thoughtSignature: GEMINI_MAGIC_THOUGHT_SIGNATURE,

package/scripts/electronWorkflow/modifiers/dynamicToStatic.mts

@@ -0,0 +1,273 @@
+/* eslint-disable no-undef */
+import { Lang, parse } from '@ast-grep/napi';
+import path from 'node:path';
+
+import { invariant, isDirectRun, runStandalone, updateFile } from './utils.mjs';
+
+interface ImportInfo {
+  defaultImport?: string;
+  namedImports: string[];
+}
+
+interface DynamicElementInfo {
+  componentName: string;
+  end: number;
+  importPath: string;
+  isNamedExport: boolean;
+  namedExport?: string;
+  start: number;
+}
+
+const toPascalCase = (str: string): string => {
+  return str
+    .split(/[_-]/)
+    .map((part) => part.charAt(0).toUpperCase() + part.slice(1))
+    .join('');
+};
+
+const generateComponentName = (
+  importPath: string,
+  namedExport?: string,
+  existingNames: Set<string> = new Set(),
+): string => {
+  if (namedExport) {
+    let name = namedExport;
+    let counter = 1;
+    while (existingNames.has(name)) {
+      name = `${namedExport}${counter++}`;
+    }
+    return name;
+  }
+
+  const segments = importPath
+    .split('/')
+    .filter((s) => s && !s.startsWith('.'))
+    .map((s) => s.replace(/^\((.+)\)$/, '$1').replace(/^\[(.+)]$/, '$1'));
+
+  const meaningfulSegments = segments.slice(-3).filter(Boolean);
+
+  let baseName =
+    meaningfulSegments.length > 0
+      ? meaningfulSegments.map((s) => toPascalCase(s)).join('') + 'Page'
+      : 'Page';
+
+  let name = baseName;
+  let counter = 1;
+  while (existingNames.has(name)) {
+    name = `${baseName}${counter++}`;
+  }
+
+  return name;
+};
+
+const extractDynamicElements = (code: string): DynamicElementInfo[] => {
+  const ast = parse(Lang.Tsx, code);
+  const root = ast.root();
+
+  const results: DynamicElementInfo[] = [];
+  const existingNames = new Set<string>();
+
+  const dynamicCalls = root.findAll({
+    rule: {
+      pattern: 'dynamicElement($IMPORT_FN, $DEBUG_ID)',
+    },
+  });
+
+  for (const call of dynamicCalls) {
+    const range = call.range();
+    const text = call.text();
+
+    const importMatch = text.match(/import\s*\(\s*["']([^"']+)["']\s*\)/);
+    invariant(
+      importMatch,
+      `[convertDynamicToStatic] Failed to extract import path from dynamicElement call: ${text.slice(0, 100)}`,
+    );
+
+    const importPath = importMatch![1];
+
+    const thenMatch = text.match(/\.then\s*\(\s*\(\s*(\w+)\s*\)\s*=>\s*\1\.(\w+)\s*\)/);
+    const namedExport = thenMatch ? thenMatch[2] : undefined;
+
+    const componentName = generateComponentName(importPath, namedExport, existingNames);
+    existingNames.add(componentName);
+
+    results.push({
+      componentName,
+      end: range.end.index,
+      importPath,
+      isNamedExport: !!namedExport,
+      namedExport,
+      start: range.start.index,
+    });
+  }
+
+  return results;
+};
+
+const buildImportMap = (elements: DynamicElementInfo[]): Map<string, ImportInfo> => {
+  const importMap = new Map<string, ImportInfo>();
+
+  for (const el of elements) {
+    const existing = importMap.get(el.importPath) || { namedImports: [] };
+
+    if (el.isNamedExport && el.namedExport) {
+      if (!existing.namedImports.includes(el.namedExport)) {
+        existing.namedImports.push(el.namedExport);
+      }
+    } else {
+      existing.defaultImport = el.componentName;
+    }
+
+    importMap.set(el.importPath, existing);
+  }
+
+  return importMap;
+};
+
+const generateImportStatements = (importMap: Map<string, ImportInfo>): string => {
+  const statements: string[] = [];
+
+  const sortedPaths = [...importMap.keys()].sort();
+
+  for (const importPath of sortedPaths) {
+    const info = importMap.get(importPath)!;
+    const parts: string[] = [];
+
+    if (info.defaultImport) {
+      parts.push(info.defaultImport);
+    }
+
+    if (info.namedImports.length > 0) {
+      parts.push(`{ ${info.namedImports.join(', ')} }`);
+    }
+
+    if (parts.length > 0) {
+      statements.push(`import ${parts.join(', ')} from '${importPath}';`);
+    }
+  }
+
+  return statements.join('\n');
+};
+
+const findImportInsertPosition = (code: string): number => {
+  const ast = parse(Lang.Tsx, code);
+  const root = ast.root();
+
+  const imports = root.findAll({
+    rule: {
+      kind: 'import_statement',
+    },
+  });
+
+  invariant(imports.length > 0, '[convertDynamicToStatic] No import statements found in file');
+
+  const lastImport = imports.at(-1)!;
+  return lastImport.range().end.index;
+};
+
+const removeDynamicElementImport = (code: string): string => {
+  const ast = parse(Lang.Tsx, code);
+  const root = ast.root();
+
+  const utilsRouterImport = root.find({
+    rule: {
+      kind: 'import_statement',
+      pattern: "import { $$$IMPORTS } from '@/utils/router'",
+    },
+  });
+
+  if (!utilsRouterImport) {
+    return code;
+  }
+
+  const importText = utilsRouterImport.text();
+
+  if (!importText.includes('dynamicElement')) {
+    return code;
+  }
+
+  const importSpecifiers = utilsRouterImport.findAll({
+    rule: {
+      kind: 'import_specifier',
+    },
+  });
+
+  const specifiersToKeep = importSpecifiers
+    .map((spec) => spec.text())
+    .filter((text) => !text.includes('dynamicElement'));
+
+  if (specifiersToKeep.length === 0) {
+    const range = utilsRouterImport.range();
+    let endIndex = range.end.index;
+    if (code[endIndex] === '\n') {
+      endIndex++;
+    }
+    return code.slice(0, range.start.index) + code.slice(endIndex);
+  }
+
+  const newImport = `import { ${specifiersToKeep.join(', ')} } from '@/utils/router';`;
+  const range = utilsRouterImport.range();
+  return code.slice(0, range.start.index) + newImport + code.slice(range.end.index);
+};
+
+export const convertDynamicToStatic = async (TEMP_DIR: string) => {
+  const routerConfigPath = path.join(
+    TEMP_DIR,
+    'src/app/[variants]/router/desktopRouter.config.tsx',
+  );
+
+  console.log('  Processing dynamicElement → static imports...');
+
+  await updateFile({
+    assertAfter: (code) => {
+      const noDynamicElement = !/dynamicElement\s*\(/.test(code);
+      const hasStaticImports = /^import .+ from ["']\.\.\/\(main\)/m.test(code);
+      return noDynamicElement && hasStaticImports;
+    },
+    filePath: routerConfigPath,
+    name: 'convertDynamicToStatic',
+    transformer: (code) => {
+      const elements = extractDynamicElements(code);
+
+      invariant(
+        elements.length > 0,
+        '[convertDynamicToStatic] No dynamicElement calls found in desktopRouter.config.tsx',
+      );
+
+      console.log(`    Found ${elements.length} dynamicElement calls`);
+
+      const importMap = buildImportMap(elements);
+      const importStatements = generateImportStatements(importMap);
+
+      const edits: Array<{ end: number; start: number; text: string }> = [];
+
+      for (const el of elements) {
+        edits.push({
+          end: el.end,
+          start: el.start,
+          text: `<${el.componentName} />`,
+        });
+      }
+
+      edits.sort((a, b) => b.start - a.start);
+
+      let result = code;
+      for (const edit of edits) {
+        result = result.slice(0, edit.start) + edit.text + result.slice(edit.end);
+      }
+
+      const insertPos = findImportInsertPosition(result);
+      result = result.slice(0, insertPos) + '\n' + importStatements + result.slice(insertPos);
+
+      result = removeDynamicElementImport(result);
+
+      return result;
+    },
+  });
+};
+
+if (isDirectRun(import.meta.url)) {
+  await runStandalone('convertDynamicToStatic', convertDynamicToStatic, [
+    { lang: Lang.Tsx, path: 'src/app/[variants]/router/desktopRouter.config.tsx' },
+  ]);
+}

package/scripts/electronWorkflow/modifiers/index.mts

@@ -3,14 +3,24 @@ import path from 'node:path';
 
 import { modifyAppCode } from './appCode.mjs';
 import { cleanUpCode } from './cleanUp.mjs';
+import { convertDynamicToStatic } from './dynamicToStatic.mjs';
+import { convertNextDynamicToStatic } from './nextDynamicToStatic.mjs';
 import { modifyNextConfig } from './nextConfig.mjs';
+import { removeSuspenseFromConversation } from './removeSuspense.mjs';
 import { modifyRoutes } from './routes.mjs';
+import { convertSettingsContentToStatic } from './settingsContentToStatic.mjs';
 import { modifyStaticExport } from './staticExport.mjs';
 import { isDirectRun, runStandalone } from './utils.mjs';
+import { wrapChildrenWithClientOnly } from './wrapChildrenWithClientOnly.mjs';
 
 export const modifySourceForElectron = async (TEMP_DIR: string) => {
   await modifyNextConfig(TEMP_DIR);
   await modifyAppCode(TEMP_DIR);
+  await wrapChildrenWithClientOnly(TEMP_DIR);
+  await convertDynamicToStatic(TEMP_DIR);
+  await convertNextDynamicToStatic(TEMP_DIR);
+  await convertSettingsContentToStatic(TEMP_DIR);
+  await removeSuspenseFromConversation(TEMP_DIR);
   await modifyRoutes(TEMP_DIR);
   await modifyStaticExport(TEMP_DIR);
   await cleanUpCode(TEMP_DIR);

package/scripts/electronWorkflow/modifiers/nextConfig.mts

@@ -1,3 +1,4 @@
+/* eslint-disable no-undef */
 import { Lang, parse } from '@ast-grep/napi';
 import fs from 'fs-extra';
 import path from 'node:path';

package/scripts/electronWorkflow/modifiers/nextDynamicToStatic.mts

@@ -0,0 +1,233 @@
+/* eslint-disable no-undef */
+import { Lang, parse } from '@ast-grep/napi';
+import { glob } from 'glob';
+import fs from 'fs-extra';
+import path from 'node:path';
+
+import { invariant, isDirectRun, runStandalone } from './utils.mjs';
+
+interface DynamicImportInfo {
+  componentName: string;
+  end: number;
+  importPath: string;
+  start: number;
+}
+
+const extractDynamicImports = (code: string): DynamicImportInfo[] => {
+  const ast = parse(Lang.Tsx, code);
+  const root = ast.root();
+
+  const results: DynamicImportInfo[] = [];
+
+  const dynamicCalls = root.findAll({
+    rule: {
+      pattern: 'const $NAME = dynamic(() => import($PATH))',
+    },
+  });
+
+  for (const call of dynamicCalls) {
+    const range = call.range();
+    const text = call.text();
+
+    const nameMatch = text.match(/const\s+(\w+)\s*=/);
+    invariant(
+      nameMatch,
+      `[convertNextDynamicToStatic] Failed to extract component name from dynamic call: ${text.slice(0, 100)}`,
+    );
+
+    const importMatch = text.match(/import\s*\(\s*["']([^"']+)["']\s*\)/);
+    invariant(
+      importMatch,
+      `[convertNextDynamicToStatic] Failed to extract import path from dynamic call: ${text.slice(0, 100)}`,
+    );
+
+    results.push({
+      componentName: nameMatch![1],
+      end: range.end.index,
+      importPath: importMatch![1],
+      start: range.start.index,
+    });
+  }
+
+  const dynamicCallsWithOptions = root.findAll({
+    rule: {
+      pattern: 'const $NAME = dynamic(() => import($PATH), $OPTIONS)',
+    },
+  });
+
+  for (const call of dynamicCallsWithOptions) {
+    const range = call.range();
+    const text = call.text();
+
+    const nameMatch = text.match(/const\s+(\w+)\s*=/);
+    invariant(
+      nameMatch,
+      `[convertNextDynamicToStatic] Failed to extract component name from dynamic call: ${text.slice(0, 100)}`,
+    );
+
+    const importMatch = text.match(/import\s*\(\s*["']([^"']+)["']\s*\)/);
+    invariant(
+      importMatch,
+      `[convertNextDynamicToStatic] Failed to extract import path from dynamic call: ${text.slice(0, 100)}`,
+    );
+
+    const alreadyExists = results.some(
+      (r) => r.componentName === nameMatch![1] && r.importPath === importMatch![1],
+    );
+    if (alreadyExists) continue;
+
+    results.push({
+      componentName: nameMatch![1],
+      end: range.end.index,
+      importPath: importMatch![1],
+      start: range.start.index,
+    });
+  }
+
+  return results;
+};
+
+const generateImportStatements = (imports: DynamicImportInfo[]): string => {
+  const uniqueImports = new Map<string, string>();
+
+  for (const imp of imports) {
+    if (!uniqueImports.has(imp.importPath)) {
+      uniqueImports.set(imp.importPath, imp.componentName);
+    }
+  }
+
+  const sortedPaths = [...uniqueImports.keys()].sort();
+
+  return sortedPaths
+    .map((importPath) => {
+      const componentName = uniqueImports.get(importPath)!;
+      return `import ${componentName} from '${importPath}';`;
+    })
+    .join('\n');
+};
+
+const findImportInsertPosition = (code: string, filePath: string): number => {
+  const ast = parse(Lang.Tsx, code);
+  const root = ast.root();
+
+  const imports = root.findAll({
+    rule: {
+      kind: 'import_statement',
+    },
+  });
+
+  invariant(
+    imports.length > 0,
+    `[convertNextDynamicToStatic] No import statements found in ${filePath}`,
+  );
+
+  const lastImport = imports.at(-1)!;
+  return lastImport.range().end.index;
+};
+
+const removeDynamicImport = (code: string): string => {
+  const patterns = [
+    /import dynamic from ["']@\/libs\/next\/dynamic["'];\n?/g,
+    /import dynamic from ["']next\/dynamic["'];\n?/g,
+  ];
+
+  let result = code;
+  for (const pattern of patterns) {
+    result = result.replace(pattern, '');
+  }
+
+  return result;
+};
+
+const removeUnusedLoadingImport = (code: string): string => {
+  const codeWithoutImport = code.replaceAll(/import Loading from ["'][^"']+["'];?\n?/g, '');
+  if (!/\bLoading\b/.test(codeWithoutImport)) {
+    return code.replaceAll(/import Loading from ["'][^"']+["'];?\n?/g, '');
+  }
+  return code;
+};
+
+const transformFile = (code: string, filePath: string): string => {
+  const imports = extractDynamicImports(code);
+
+  if (imports.length === 0) {
+    return code;
+  }
+
+  const importStatements = generateImportStatements(imports);
+
+  const edits: Array<{ end: number; start: number; text: string }> = [];
+
+  for (const imp of imports) {
+    edits.push({
+      end: imp.end,
+      start: imp.start,
+      text: '',
+    });
+  }
+
+  edits.sort((a, b) => b.start - a.start);
+
+  let result = code;
+  for (const edit of edits) {
+    let endIndex = edit.end;
+    while (result[endIndex] === '\n' || result[endIndex] === '\r') {
+      endIndex++;
+    }
+    result = result.slice(0, edit.start) + result.slice(endIndex);
+  }
+
+  const insertPos = findImportInsertPosition(result, filePath);
+  if (importStatements) {
+    result = result.slice(0, insertPos) + '\n' + importStatements + result.slice(insertPos);
+  }
+
+  result = removeDynamicImport(result);
+  result = removeUnusedLoadingImport(result);
+
+  result = result.replaceAll(/\n{3,}/g, '\n\n');
+
+  return result;
+};
+
+export const convertNextDynamicToStatic = async (TEMP_DIR: string) => {
+  const appDirs = [
+    { dir: path.join(TEMP_DIR, 'src/app/(variants)'), label: 'src/app/(variants)' },
+    { dir: path.join(TEMP_DIR, 'src/app/[variants]'), label: 'src/app/[variants]' },
+  ];
+
+  console.log('  Processing next/dynamic → static imports...');
+
+  let processedCount = 0;
+
+  for (const { dir, label } of appDirs) {
+    if (!(await fs.pathExists(dir))) {
+      continue;
+    }
+
+    const files = await glob('**/*.tsx', { cwd: dir });
+
+    for (const file of files) {
+      const filePath = path.join(dir, file);
+      const code = await fs.readFile(filePath, 'utf8');
+
+      if (!code.includes('dynamic(')) {
+        continue;
+      }
+
+      const transformed = transformFile(code, `${label}/${file}`);
+
+      if (transformed !== code) {
+        await fs.writeFile(filePath, transformed);
+        processedCount++;
+        console.log(`    Transformed: ${label}/${file}`);
+      }
+    }
+  }
+
+  console.log(`    Processed ${processedCount} files with dynamic imports`);
+};
+
+if (isDirectRun(import.meta.url)) {
+  await runStandalone('convertNextDynamicToStatic', convertNextDynamicToStatic, []);
+}