ai-localize-codemods 1.0.0

package/dist/index.mjs

@@ -0,0 +1,486 @@
+// src/react-codemod.ts
+import * as fs from "fs";
+import * as parser from "@babel/parser";
+import traverse from "@babel/traverse";
+import generate from "@babel/generator";
+import * as t from "@babel/types";
+var USE_TRANSLATION_IMPORT = "react-i18next";
+var USE_TRANSLATION_HOOK = "useTranslation";
+var ReactCodemod = class {
+  filePath;
+  content;
+  texts;
+  constructor(filePath, content, texts) {
+    this.filePath = filePath;
+    this.content = content;
+    this.texts = texts;
+  }
+  transform() {
+    if (this.texts.length === 0) {
+      return {
+        filePath: this.filePath,
+        originalContent: this.content,
+        transformedContent: this.content,
+        changed: false,
+        injectedImport: false,
+        injectedHook: false,
+        replacedTexts: 0
+      };
+    }
+    let ast;
+    try {
+      ast = parser.parse(this.content, {
+        sourceType: "module",
+        plugins: [
+          "jsx",
+          "typescript",
+          "decorators-legacy",
+          "classProperties",
+          "optionalChaining",
+          "nullishCoalescingOperator"
+        ],
+        errorRecovery: true
+      });
+    } catch {
+      return {
+        filePath: this.filePath,
+        originalContent: this.content,
+        transformedContent: this.content,
+        changed: false,
+        injectedImport: false,
+        injectedHook: false,
+        replacedTexts: 0
+      };
+    }
+    const textKeyMap = /* @__PURE__ */ new Map();
+    for (const dt of this.texts) {
+      textKeyMap.set(dt.text, dt.suggestedKey);
+    }
+    let replacedTexts = 0;
+    let hasUseTranslationImport = false;
+    let hasUseTranslationHook = false;
+    let injectedImport = false;
+    let injectedHook = false;
+    traverse(ast, {
+      ImportDeclaration(nodePath) {
+        if (nodePath.node.source.value === USE_TRANSLATION_IMPORT) {
+          hasUseTranslationImport = true;
+        }
+      },
+      // Check if useTranslation hook already destructured
+      VariableDeclarator(nodePath) {
+        const id = nodePath.node.id;
+        if (t.isObjectPattern(id) && id.properties.some(
+          (p) => t.isObjectProperty(p) && t.isIdentifier(p.key) && p.key.name === "t"
+        )) {
+          hasUseTranslationHook = true;
+        }
+      }
+    });
+    traverse(ast, {
+      JSXText(nodePath) {
+        const text = nodePath.node.value.trim();
+        if (!text) return;
+        const key = textKeyMap.get(text);
+        if (!key) return;
+        const tCall = t.jsxExpressionContainer(
+          t.callExpression(t.identifier("t"), [t.stringLiteral(key)])
+        );
+        nodePath.replaceWith(tCall);
+        replacedTexts++;
+      },
+      StringLiteral(nodePath) {
+        const text = nodePath.node.value;
+        const key = textKeyMap.get(text);
+        if (!key) return;
+        if (t.isImportDeclaration(nodePath.parent)) return;
+        if (t.isObjectProperty(nodePath.parent) && nodePath.parent.key === nodePath.node) return;
+        if (t.isJSXAttribute(nodePath.parent)) return;
+        const tCall = t.callExpression(t.identifier("t"), [t.stringLiteral(key)]);
+        nodePath.replaceWith(tCall);
+        replacedTexts++;
+      },
+      JSXAttribute(nodePath) {
+        const valueNode = nodePath.node.value;
+        if (!t.isStringLiteral(valueNode)) return;
+        const text = valueNode.value;
+        const key = textKeyMap.get(text);
+        if (!key) return;
+        nodePath.node.value = t.jsxExpressionContainer(
+          t.callExpression(t.identifier("t"), [t.stringLiteral(key)])
+        );
+        replacedTexts++;
+      }
+    });
+    if (replacedTexts === 0) {
+      return {
+        filePath: this.filePath,
+        originalContent: this.content,
+        transformedContent: this.content,
+        changed: false,
+        injectedImport: false,
+        injectedHook: false,
+        replacedTexts: 0
+      };
+    }
+    if (!hasUseTranslationImport) {
+      const importDecl = t.importDeclaration(
+        [t.importSpecifier(t.identifier(USE_TRANSLATION_HOOK), t.identifier(USE_TRANSLATION_HOOK))],
+        t.stringLiteral(USE_TRANSLATION_IMPORT)
+      );
+      ast.program.body.unshift(importDecl);
+      injectedImport = true;
+    }
+    if (!hasUseTranslationHook) {
+      this.injectUseTranslationHook(ast);
+      injectedHook = true;
+    }
+    const output = generate(
+      ast,
+      {
+        retainLines: false,
+        comments: true,
+        compact: false
+      },
+      this.content
+    );
+    return {
+      filePath: this.filePath,
+      originalContent: this.content,
+      transformedContent: output.code,
+      changed: true,
+      injectedImport,
+      injectedHook,
+      replacedTexts
+    };
+  }
+  injectUseTranslationHook(ast) {
+    traverse(ast, {
+      FunctionDeclaration(nodePath) {
+        if (!isReactComponent(nodePath.node.id?.name)) return;
+        injectHookIntoBody(nodePath.node.body);
+        nodePath.stop();
+      },
+      ArrowFunctionExpression(nodePath) {
+        if (!isReactComponentParent(nodePath)) return;
+        const body = nodePath.node.body;
+        if (t.isBlockStatement(body)) {
+          injectHookIntoBody(body);
+          nodePath.stop();
+        }
+      }
+    });
+  }
+};
+function isReactComponent(name) {
+  if (!name) return false;
+  return /^[A-Z]/.test(name);
+}
+function isReactComponentParent(nodePath) {
+  const parent = nodePath.parent;
+  if (t.isVariableDeclarator(parent)) {
+    const id = parent.id;
+    if (t.isIdentifier(id) && /^[A-Z]/.test(id.name)) return true;
+  }
+  return false;
+}
+function injectHookIntoBody(body) {
+  const hookDecl = t.variableDeclaration("const", [
+    t.variableDeclarator(
+      t.objectPattern([
+        t.objectProperty(t.identifier("t"), t.identifier("t"), false, true)
+      ]),
+      t.callExpression(t.identifier("useTranslation"), [])
+    )
+  ]);
+  body.body.unshift(hookDecl);
+}
+function applyReactCodemod(filePath, texts, dryRun = false) {
+  const content = fs.readFileSync(filePath, "utf-8");
+  const codemod = new ReactCodemod(filePath, content, texts);
+  const result = codemod.transform();
+  if (result.changed && !dryRun) {
+    fs.writeFileSync(filePath, result.transformedContent, "utf-8");
+  }
+  return result;
+}
+
+// src/vue-codemod.ts
+import * as fs2 from "fs";
+var VueCodemod = class {
+  filePath;
+  content;
+  texts;
+  constructor(filePath, content, texts) {
+    this.filePath = filePath;
+    this.content = content;
+    this.texts = texts;
+  }
+  transform() {
+    if (this.texts.length === 0) {
+      return this.unchanged();
+    }
+    const templateMatch = this.content.match(/<template[^>]*>([\s\S]*?)<\/template>/);
+    const scriptMatch = this.content.match(/<script[^>]*>([\s\S]*?)<\/script>/);
+    if (!templateMatch && !scriptMatch) {
+      return this.unchanged();
+    }
+    const textKeyMap = /* @__PURE__ */ new Map();
+    for (const dt of this.texts) {
+      textKeyMap.set(dt.text, dt.suggestedKey);
+    }
+    let transformedContent = this.content;
+    let replacedTexts = 0;
+    if (templateMatch) {
+      let template = templateMatch[1];
+      for (const [text, key] of textKeyMap) {
+        const escaped = text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+        const re = new RegExp(`(>\\s*)${escaped}(\\s*<)`, "g");
+        template = template.replace(re, `$1{{ $t('${key}') }}$2`);
+        const attrRe = new RegExp(`((?:title|placeholder|alt|label)=)"(${escaped})"`, "g");
+        template = template.replace(attrRe, `:$1"$t('${key}')"`);
+        replacedTexts++;
+      }
+      transformedContent = transformedContent.replace(templateMatch[1], template);
+    }
+    if (replacedTexts === 0) {
+      return this.unchanged();
+    }
+    return {
+      filePath: this.filePath,
+      originalContent: this.content,
+      transformedContent,
+      changed: true,
+      injectedImport: false,
+      // vue-i18n is globally injected
+      injectedHook: false,
+      replacedTexts
+    };
+  }
+  unchanged() {
+    return {
+      filePath: this.filePath,
+      originalContent: this.content,
+      transformedContent: this.content,
+      changed: false,
+      injectedImport: false,
+      injectedHook: false,
+      replacedTexts: 0
+    };
+  }
+};
+function applyVueCodemod(filePath, texts, dryRun = false) {
+  const content = fs2.readFileSync(filePath, "utf-8");
+  const codemod = new VueCodemod(filePath, content, texts);
+  const result = codemod.transform();
+  if (result.changed && !dryRun) {
+    fs2.writeFileSync(filePath, result.transformedContent, "utf-8");
+  }
+  return result;
+}
+
+// src/angular-codemod.ts
+import * as fs3 from "fs";
+var AngularCodemod = class {
+  filePath;
+  content;
+  texts;
+  constructor(filePath, content, texts) {
+    this.filePath = filePath;
+    this.content = content;
+    this.texts = texts;
+  }
+  transform() {
+    if (this.texts.length === 0) return this.unchanged();
+    const textKeyMap = /* @__PURE__ */ new Map();
+    for (const dt of this.texts) {
+      textKeyMap.set(dt.text, dt.suggestedKey);
+    }
+    let transformedContent = this.content;
+    let replacedTexts = 0;
+    const isTemplate = this.filePath.endsWith(".html");
+    for (const [text, key] of textKeyMap) {
+      const escaped = text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+      if (isTemplate) {
+        const re = new RegExp(`(>\\s*)${escaped}(\\s*<)`, "g");
+        transformedContent = transformedContent.replace(re, `$1{{ '${key}' | translate }}$2`);
+        const attrRe = new RegExp(`\\[(?:placeholder|label|title|alt)\\]="'${escaped}'"`, "g");
+        transformedContent = transformedContent.replace(
+          attrRe,
+          `[placeholder]="'${key}' | translate"`
+        );
+      } else {
+        const tsRe = new RegExp(`'${escaped}'`, "g");
+        transformedContent = transformedContent.replace(
+          tsRe,
+          `this.translateService.instant('${key}')`
+        );
+      }
+      replacedTexts++;
+    }
+    if (replacedTexts === 0) return this.unchanged();
+    return {
+      filePath: this.filePath,
+      originalContent: this.content,
+      transformedContent,
+      changed: true,
+      injectedImport: false,
+      injectedHook: false,
+      replacedTexts
+    };
+  }
+  unchanged() {
+    return {
+      filePath: this.filePath,
+      originalContent: this.content,
+      transformedContent: this.content,
+      changed: false,
+      injectedImport: false,
+      injectedHook: false,
+      replacedTexts: 0
+    };
+  }
+};
+function applyAngularCodemod(filePath, texts, dryRun = false) {
+  const content = fs3.readFileSync(filePath, "utf-8");
+  const codemod = new AngularCodemod(filePath, content, texts);
+  const result = codemod.transform();
+  if (result.changed && !dryRun) {
+    fs3.writeFileSync(filePath, result.transformedContent, "utf-8");
+  }
+  return result;
+}
+
+// src/cdn-replacer.ts
+import * as fs4 from "fs";
+import * as path from "path";
+var CdnReplacer = class {
+  assetMap;
+  constructor(assets) {
+    this.assetMap = /* @__PURE__ */ new Map();
+    for (const asset of assets) {
+      this.assetMap.set(asset.localPath, asset);
+      this.assetMap.set(asset.s3Key, asset);
+    }
+  }
+  replaceInFile(filePath, legacyUrls, dryRun = false) {
+    let content;
+    try {
+      content = fs4.readFileSync(filePath, "utf-8");
+    } catch {
+      return { filePath, replacedCount: 0, changed: false, originalContent: "", transformedContent: "" };
+    }
+    let transformedContent = content;
+    let replacedCount = 0;
+    for (const legacyUrl of legacyUrls) {
+      const asset = this.findAsset(legacyUrl.assetPath);
+      if (!asset) continue;
+      const escapedUrl = legacyUrl.url.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+      const re = new RegExp(escapedUrl, "g");
+      const newCount = (transformedContent.match(re) || []).length;
+      transformedContent = transformedContent.replace(re, asset.cloudfrontUrl);
+      replacedCount += newCount;
+    }
+    if (replacedCount > 0 && !dryRun) {
+      fs4.writeFileSync(filePath, transformedContent, "utf-8");
+    }
+    return {
+      filePath,
+      replacedCount,
+      changed: replacedCount > 0,
+      originalContent: content,
+      transformedContent
+    };
+  }
+  findAsset(assetPath) {
+    const normalized = assetPath.replace(/^\//, "");
+    return this.assetMap.get(assetPath) || this.assetMap.get(normalized) || this.assetMap.get("/" + normalized) || // fuzzy match by filename
+    Array.from(this.assetMap.values()).find(
+      (a) => path.basename(a.localPath) === path.basename(assetPath)
+    );
+  }
+};
+async function batchReplaceCdnUrls(fileUrlMap, assets, dryRun = false) {
+  const replacer = new CdnReplacer(assets);
+  const results = [];
+  for (const [filePath, legacyUrls] of fileUrlMap) {
+    const result = replacer.replaceInFile(filePath, legacyUrls, dryRun);
+    results.push(result);
+  }
+  return results;
+}
+
+// src/codemod-runner.ts
+import * as path2 from "path";
+var CodemodRunner = class {
+  config;
+  constructor(config) {
+    this.config = config;
+  }
+  async run(detectedTexts, options = {}) {
+    const startTime = Date.now();
+    const { dryRun = false, onProgress } = options;
+    const fileTextMap = /* @__PURE__ */ new Map();
+    for (const dt of detectedTexts) {
+      const existing = fileTextMap.get(dt.filePath) || [];
+      existing.push(dt);
+      fileTextMap.set(dt.filePath, existing);
+    }
+    const results = [];
+    let totalReplacements = 0;
+    let importInjections = 0;
+    let hookInjections = 0;
+    for (const [filePath, texts] of fileTextMap) {
+      let result;
+      const framework = this.config.framework;
+      try {
+        result = this.applyCodemod(filePath, texts, framework, dryRun);
+      } catch (err) {
+        result = {
+          filePath,
+          originalContent: "",
+          transformedContent: "",
+          changed: false,
+          injectedImport: false,
+          injectedHook: false,
+          replacedTexts: 0
+        };
+      }
+      results.push(result);
+      totalReplacements += result.replacedTexts;
+      if (result.injectedImport) importInjections++;
+      if (result.injectedHook) hookInjections++;
+      onProgress?.(filePath, result);
+    }
+    return {
+      totalFiles: fileTextMap.size,
+      changedFiles: results.filter((r) => r.changed).length,
+      totalReplacements,
+      importInjections,
+      hookInjections,
+      results,
+      duration: Date.now() - startTime
+    };
+  }
+  applyCodemod(filePath, texts, framework, dryRun) {
+    const ext = path2.extname(filePath).toLowerCase();
+    if (ext === ".vue") {
+      return applyVueCodemod(filePath, texts, dryRun);
+    }
+    if (framework === "angular" || framework === "angular-ngx" || framework === "angular-i18n") {
+      return applyAngularCodemod(filePath, texts, dryRun);
+    }
+    return applyReactCodemod(filePath, texts, dryRun);
+  }
+};
+export {
+  AngularCodemod,
+  CdnReplacer,
+  CodemodRunner,
+  ReactCodemod,
+  VueCodemod,
+  applyAngularCodemod,
+  applyReactCodemod,
+  applyVueCodemod,
+  batchReplaceCdnUrls
+};

package/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "ai-localize-codemods",
+  "version": "1.0.0",
+  "description": "AST-based codemods to inject i18n wrappers into frontend source code",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    }
+  },
+  "dependencies": {
+    "@babel/parser": "^7.23.9",
+    "@babel/traverse": "^7.23.9",
+    "@babel/types": "^7.23.9",
+    "@babel/generator": "^7.23.9",
+    "recast": "^0.23.4",
+    "jscodeshift": "^0.15.2",
+    "ai-localize-shared": "1.0.0"
+  },
+  "devDependencies": {
+    "@types/babel__generator": "^7.6.8",
+    "@types/babel__traverse": "^7.20.5",
+    "@types/jscodeshift": "^0.11.11",
+    "tsup": "^8.0.1",
+    "typescript": "^5.3.3",
+    "vitest": "^1.2.1"
+  },
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsup src/index.ts --format cjs,esm --dts",
+    "dev": "tsup src/index.ts --format cjs,esm --dts --watch",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run",
+    "lint": "eslint src --ext .ts"
+  }
+}

package/src/angular-codemod.ts

@@ -0,0 +1,95 @@
+import * as fs from 'fs';
+
+import type { DetectedText } from '@ai-localize/shared';
+import type { CodemodResult } from './react-codemod.js';
+
+/**
+ * Angular ngx-translate codemod:
+ * - In templates: wraps text with {{ 'key' | translate }}
+ * - In TS: replaces string literals with this.translateService.instant('key')
+ */
+export class AngularCodemod {
+  private filePath: string;
+  private content: string;
+  private texts: DetectedText[];
+
+  constructor(filePath: string, content: string, texts: DetectedText[]) {
+ this.filePath = filePath;
+    this.content = content;
+    this.texts = texts;
+  }
+
+  transform(): CodemodResult {
+    if (this.texts.length === 0) return this.unchanged();
+
+    const textKeyMap = new Map<string, string>();
+    for (const dt of this.texts) {
+      textKeyMap.set(dt.text, dt.suggestedKey);
+    }
+
+    let transformedContent = this.content;
+    let replacedTexts = 0;
+    const isTemplate = this.filePath.endsWith('.html');
+
+    for (const [text, key] of textKeyMap) {
+    const escaped = text.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+      if (isTemplate) {
+        // Template: >Some Text< => >{{ 'key' | translate }}<
+        const re = new RegExp(`(>\\s*)${escaped}(\\s*<)`, 'g');
+        transformedContent = transformedContent.replace(re, `$1{{ '${key}' | translate }}$2`);
+        // attribute: [attr]="'Some Text'" => [attr]="'key' | translate"
+        const attrRe = new RegExp(`\\[(?:placeholder|label|title|alt)\\]="'${escaped}'"`, 'g');
+        transformedContent = transformedContent.replace(
+      attrRe,
+          `[placeholder]="'${key}' | translate"`
+        );
+      } else {
+   // TS file: 'Some Text' => this.translateService.instant('key')
+        const tsRe = new RegExp(`'${escaped}'`, 'g');
+        transformedContent = transformedContent.replace(
+          tsRe,
+  `this.translateService.instant('${key}')`
+        );
+      }
+      replacedTexts++;
+    }
+
+    if (replacedTexts === 0) return this.unchanged();
+
+    return {
+      filePath: this.filePath,
+    originalContent: this.content,
+      transformedContent,
+      changed: true,
+      injectedImport: false,
+      injectedHook: false,
+   replacedTexts,
+    };
+  }
+
+  private unchanged(): CodemodResult {
+    return {
+      filePath: this.filePath,
+      originalContent: this.content,
+    transformedContent: this.content,
+      changed: false,
+      injectedImport: false,
+      injectedHook: false,
+      replacedTexts: 0,
+    };
+  }
+}
+
+export function applyAngularCodemod(
+  filePath: string,
+  texts: DetectedText[],
+  dryRun = false
+): CodemodResult {
+  const content = fs.readFileSync(filePath, 'utf-8');
+  const codemod = new AngularCodemod(filePath, content, texts);
+  const result = codemod.transform();
+  if (result.changed && !dryRun) {
+    fs.writeFileSync(filePath, result.transformedContent, 'utf-8');
+  }
+  return result;
+}