bctranslate 1.0.0 → 1.0.1

package/src/parsers/react.js

@@ -1,13 +1,10 @@
 import * as babelParser from '@babel/parser';
 import _traverse from '@babel/traverse';
-import _generate from '@babel/generator';
-import * as t from '@babel/types';
 import MagicString from 'magic-string';
-import { hashKey, isTranslatable } from '../utils.js';
+import { textKey, isTranslatable } from '../utils.js';
 
 // Handle ESM default export quirks
 const traverse = _traverse.default || _traverse;
-const generate = _generate.default || _generate;
 
 /**
  * Non-translatable JSX attribute names.
@@ -25,8 +22,31 @@ const ATTR_WHITELIST = new Set([
   'aria-placeholder', 'aria-description',
 ]);
 
+/**
+ * Walk up the Babel path tree to find the nearest enclosing function
+ * with a BlockStatement body — that is the React component function.
+ * Returns the character offset right after the opening `{`.
+ */
+function findComponentBodyStart(jsxPath) {
+  let p = jsxPath.parentPath;
+  while (p) {
+    const { node } = p;
+    if (
+      (node.type === 'FunctionDeclaration' ||
+        node.type === 'FunctionExpression' ||
+        node.type === 'ArrowFunctionExpression') &&
+      node.body?.type === 'BlockStatement'
+    ) {
+      return node.body.start + 1; // right after opening {
+    }
+    p = p.parentPath;
+  }
+  return -1;
+}
+
 /**
  * Parse a JSX/TSX file and extract translatable strings.
+ * Hook injection uses AST-derived character positions — no regex.
  */
 export function parseReact(source, filePath) {
   const extracted = [];
@@ -45,13 +65,12 @@ export function parseReact(source, filePath) {
         'decorators-legacy',
       ].filter(Boolean),
     });
-  } catch (err) {
-    // If Babel fails, return unmodified
+  } catch {
     return { source, extracted: [], modified: false };
   }
 
   const s = new MagicString(source);
-  let needsImport = false;
+  let hookInsertPos = -1;
 
   traverse(ast, {
     // JSX text children: <div>Hello World</div>
@@ -59,28 +78,23 @@ export function parseReact(source, filePath) {
       const text = path.node.value.trim();
       if (!isTranslatable(text)) return;
 
-      const key = hashKey(text);
-      const start = path.node.start;
-      const end = path.node.end;
-
-      // Preserve whitespace
+      const key = textKey(text);
+      const { start, end } = path.node;
       const original = path.node.value;
       const leadingWs = original.match(/^(\s*)/)[1];
       const trailingWs = original.match(/(\s*)$/)[1];
 
       s.overwrite(start, end, `${leadingWs}{t('${key}')}${trailingWs}`);
       extracted.push({ key, text, context: 'jsx-text' });
-      needsImport = true;
+
+      if (hookInsertPos === -1) hookInsertPos = findComponentBodyStart(path);
     },
 
     // JSX string attributes: <input placeholder="Enter name" />
     JSXAttribute(path) {
       const name = path.node.name?.name;
-      if (!name) return;
-
-      if (ATTR_BLACKLIST.has(name)) return;
+      if (!name || ATTR_BLACKLIST.has(name)) return;
 
-      // Only translate whitelisted attrs, or unknown attrs if they have translatable values
       const value = path.node.value;
       if (!value || value.type !== 'StringLiteral') return;
 
@@ -88,60 +102,41 @@ export function parseReact(source, filePath) {
       if (!isTranslatable(text)) return;
       if (!ATTR_WHITELIST.has(name) && text.length < 3) return;
 
-      const key = hashKey(text);
-      const attrStart = path.node.start;
-      const attrEnd = path.node.end;
-
-      s.overwrite(attrStart, attrEnd, `${name}={t('${key}')}`);
+      const key = textKey(text);
+      s.overwrite(path.node.start, path.node.end, `${name}={t('${key}')}`);
       extracted.push({ key, text, context: `jsx-attr-${name}` });
-      needsImport = true;
+
+      if (hookInsertPos === -1) hookInsertPos = findComponentBodyStart(path);
     },
 
-    // String literals in common patterns (not JSX)
+    // alert('...'), confirm('...')
     CallExpression(path) {
       const callee = path.node.callee;
-      const calleeName = callee.name || (callee.property && callee.property.name);
-
-      // alert('...'), confirm('...'), toast('...')
-      if (['alert', 'confirm'].includes(calleeName)) {
-        const arg = path.node.arguments[0];
-        if (arg && arg.type === 'StringLiteral' && isTranslatable(arg.value)) {
-          const key = hashKey(arg.value);
-          s.overwrite(arg.start, arg.end, `t('${key}')`);
-          extracted.push({ key, text: arg.value, context: 'call-arg' });
-          needsImport = true;
-        }
+      const calleeName = callee.name || callee.property?.name;
+      if (!['alert', 'confirm'].includes(calleeName)) return;
+
+      const arg = path.node.arguments[0];
+      if (arg?.type === 'StringLiteral' && isTranslatable(arg.value)) {
+        const key = textKey(arg.value);
+        s.overwrite(arg.start, arg.end, `t('${key}')`);
+        extracted.push({ key, text: arg.value, context: 'call-arg' });
       }
     },
   });
 
-  // Add useTranslation import if needed
-  if (needsImport) {
-    const hasUseTranslation = source.includes('useTranslation');
-    if (!hasUseTranslation) {
-      // Find the first import statement or top of file
-      let insertPos = 0;
-      const importMatch = source.match(/^import\s.+$/m);
-      if (importMatch) {
-        // Insert after all imports
-        const lastImportMatch = [...source.matchAll(/^import\s.+$/gm)];
-        if (lastImportMatch.length > 0) {
-          const last = lastImportMatch[lastImportMatch.length - 1];
-          insertPos = last.index + last[0].length;
-        }
+  // ── Inject import and hook using AST-derived positions ───────────────────────
+  if (extracted.length > 0) {
+    if (!source.includes('useTranslation')) {
+      // Find the last ImportDeclaration node — safe even with 'use client' directives
+      let lastImportEnd = 0;
+      for (const node of ast.program.body) {
+        if (node.type === 'ImportDeclaration') lastImportEnd = node.end;
       }
-
-      s.appendRight(insertPos, `\nimport { useTranslation } from 'react-i18next';\n`);
+      s.appendRight(lastImportEnd, `\nimport { useTranslation } from 'react-i18next';`);
     }
 
-    // Add const { t } = useTranslation() if not present
-    if (!source.includes('useTranslation()')) {
-      // Find the function body
-      const funcMatch = source.match(/(?:function\s+\w+|const\s+\w+\s*=\s*(?:\([^)]*\)\s*=>|\w+\s*=>))\s*\{/);
-      if (funcMatch) {
-        const insertAt = funcMatch.index + funcMatch[0].length;
-        s.appendRight(insertAt, `\n  const { t } = useTranslation();\n`);
-      }
+    if (!source.includes('useTranslation()') && hookInsertPos > 0) {
+      s.appendRight(hookInsertPos, `\n  const { t } = useTranslation();\n`);
     }
   }
 
@@ -150,4 +145,4 @@ export function parseReact(source, filePath) {
     extracted,
     modified: extracted.length > 0,
   };
-}
+}

package/src/parsers/vue.js

@@ -1,6 +1,6 @@
 import * as compiler from '@vue/compiler-dom';
 import MagicString from 'magic-string';
-import { hashKey, isTranslatable, parseInterpolation } from '../utils.js';
+import { textKey, isTranslatable, parseInterpolation } from '../utils.js';
 
 /**
  * Non-translatable attribute names.
@@ -80,7 +80,7 @@ function walkTemplate(nodes, s, baseOffset, extracted) {
     if (node.type === 2) {
       const text = node.content.trim();
       if (isTranslatable(text)) {
-        const key = hashKey(text);
+        const key = textKey(text);
         const start = baseOffset + node.loc.start.offset;
         const end = baseOffset + node.loc.end.offset;
 
@@ -108,7 +108,7 @@ function walkTemplate(nodes, s, baseOffset, extracted) {
 
             if (ATTR_WHITELIST.has(attrName) && isTranslatable(prop.value.content)) {
               const text = prop.value.content;
-              const key = hashKey(text);
+              const key = textKey(text);
               const attrStart = baseOffset + prop.loc.start.offset;
               const attrEnd = baseOffset + prop.loc.end.offset;
 
@@ -168,7 +168,7 @@ function extractScriptStrings(scriptContent, s, baseOffset, extracted, isSetup)
     while ((match = pattern.exec(scriptContent)) !== null) {
       const text = match[3];
       if (isTranslatable(text) && text.length > 1) {
-        const key = hashKey(text);
+        const key = textKey(text);
         const fullMatchStart = baseOffset + match.index;
         const quoteChar = match[2];
         const textStart = baseOffset + match.index + match[0].indexOf(quoteChar + text);
@@ -196,7 +196,7 @@ function extractTemplateRegex(source, s, extracted) {
   while ((match = textPattern.exec(source)) !== null) {
     const text = match[1].trim();
     if (isTranslatable(text)) {
-      const key = hashKey(text);
+      const key = textKey(text);
       const textStart = match.index + 1;
       const textEnd = textStart + match[1].length;
       if (!isAlreadyWrapped(source, textStart, textEnd)) {

package/src/utils.js

@@ -1,18 +1,42 @@
 import { createHash } from 'crypto';
 
 /**
- * Generate a deterministic, short key from a string.
- * Same input always produces the same key — idempotent across runs.
+ * Generate a readable, slug-based i18n key from a string.
+ * "Submit" → "submit"
+ * "Please enter your email" → "please_enter_your_email"
+ * Falls back to a hash prefix for non-Latin or symbol-only strings.
  */
-export function hashKey(text) {
-  const normalized = text.trim().toLowerCase().replace(/\s+/g, ' ');
-  const hash = createHash('sha256').update(normalized).digest('hex').slice(0, 8);
-  return `key_${hash}`;
-}
+export function textKey(text) {
+  const trimmed = text.trim();
+
+  const slug = trimmed
+    .toLowerCase()
+    .replace(/[^\w\s]/g, ' ')   // punctuation → space
+    .replace(/\s+/g, '_')        // spaces → underscores
+    .replace(/^[^a-z]+/, '')     // strip non-alpha prefix
+    .replace(/[^a-z0-9_]/g, '') // remove remaining non-ASCII
+    .replace(/_+/g, '_')         // collapse multiple underscores
+    .replace(/^_|_$/g, '')       // trim underscores
+    .slice(0, 40)
+    .replace(/_+$/, '');
+
+  if (slug && slug.length >= 2 && /[a-z]/.test(slug)) {
+    return slug;
+  }
+
+  // Fallback: hash (for Chinese, Arabic, emoji, symbols, etc.)
+  const hash = createHash('sha256').update(trimmed).digest('hex').slice(0, 8);
+  return `key_${hash}`;
+}
 
 /**
- * Determine if a string is "translatable" — i.e. it contains actual
- * human-readable text and not just whitespace, numbers, symbols, or code.
+ * @deprecated Use textKey() instead. Kept for internal backward compat.
+ */
+export const hashKey = textKey;
+
+/**
+ * Determine if a string is "translatable" — contains actual human-readable
+ * text rather than whitespace, numbers, symbols, or code identifiers.
  */
 export function isTranslatable(text) {
   if (!text || typeof text !== 'string') return false;
@@ -27,15 +51,19 @@ export function isTranslatable(text) {
   if (/^[\d.,]+$/.test(trimmed)) return false;
 
   // Skip single characters that are punctuation/symbols
-  if (trimmed.length === 1 && /[^a-zA-Z\u00C0-\u024F\u0400-\u04FF\u4e00-\u9fff\u3040-\u309f\u30a0-\u30ff]/.test(trimmed)) return false;
+  if (
+    trimmed.length === 1 &&
+    /[^a-zA-Z\u00C0-\u024F\u0400-\u04FF\u4e00-\u9fff\u3040-\u309f\u30a0-\u30ff]/.test(trimmed)
+  )
+    return false;
 
-  // Skip things that look like code identifiers (camelCase, snake_case with no spaces)
+  // Skip code identifiers (camelCase, snake_case with no spaces)
   if (/^[a-zA-Z_$][a-zA-Z0-9_$.]*$/.test(trimmed) && !trimmed.includes(' ') && trimmed.length > 1) {
-    // But allow single real words (check if it has vowels or is a common word)
+    // Allow capitalised real words: "Submit", "Cancel", "Home"
     if (/[aeiouAEIOU]/.test(trimmed) && trimmed.length > 2 && /^[A-Z][a-z]+$/.test(trimmed)) {
-      return true; // Likely a real word like "Submit", "Cancel", "Home"
+      return true;
     }
-    // Allow ALL CAPS short words (likely labels)
+    // Allow ALL-CAPS short labels: "OK", "FAQ"
     if (/^[A-Z]{2,12}$/.test(trimmed)) return true;
     return false;
   }
@@ -44,29 +72,80 @@ export function isTranslatable(text) {
   if (/^(https?:\/\/|\/|\.\/|\.\.\/)/.test(trimmed)) return false;
   if (/^[\w.+-]+@[\w.-]+\.\w+$/.test(trimmed)) return false;
 
-  // Skip template expressions that are purely code ({{ something }})
+  // Skip pure template expressions {{ something }}
   if (/^\{\{[^}]+\}\}$/.test(trimmed)) return false;
 
   // Must contain at least one letter from any script
-  if (!/[a-zA-Z\u00C0-\u024F\u0400-\u04FF\u4e00-\u9fff\u3040-\u309f\u30a0-\u30ff\uAC00-\uD7AF]/.test(trimmed)) return false;
+  if (
+    !/[a-zA-Z\u00C0-\u024F\u0400-\u04FF\u4e00-\u9fff\u3040-\u309f\u30a0-\u30ff\uAC00-\uD7AF]/.test(
+      trimmed
+    )
+  )
+    return false;
 
   return true;
 }
 
 /**
- * Check if a string contains interpolation expressions ({{ }}, {}, ${}).
- * Returns the parts if so.
+ * Shield interpolation variables before sending to Argos Translate.
+ * Replaces {{ name }}, {name}, ${name}, %{name} with XML-like tokens <xi/>
+ * that NMT models are trained to preserve verbatim.
+ *
+ * Returns { shielded, tokens } — call unshieldInterpolations() to restore.
+ */
+export function shieldInterpolations(text) {
+  const tokens = [];
+  let shielded = text;
+
+  // Vue {{ expr }} — must come first to avoid matching inner {
+  shielded = shielded.replace(/\{\{[^}]*\}\}/g, (m) => {
+    const i = tokens.length;
+    tokens.push(m);
+    return `<x${i}/>`;
+  });
+
+  // Template literal ${expr}
+  shielded = shielded.replace(/\$\{[^}]*\}/g, (m) => {
+    const i = tokens.length;
+    tokens.push(m);
+    return `<x${i}/>`;
+  });
+
+  // i18next / vue-i18n {varName} or {0}
+  shielded = shielded.replace(/\{[^{}\s][^{}]*\}/g, (m) => {
+    const i = tokens.length;
+    tokens.push(m);
+    return `<x${i}/>`;
+  });
+
+  // Ruby / Rails %{varName}
+  shielded = shielded.replace(/%\{[^}]+\}/g, (m) => {
+    const i = tokens.length;
+    tokens.push(m);
+    return `<x${i}/>`;
+  });
+
+  return { shielded, tokens };
+}
+
+/**
+ * Restore interpolation variables after translation.
+ * Tolerates minor whitespace changes the MT model may introduce.
+ */
+export function unshieldInterpolations(text, tokens) {
+  if (!tokens || tokens.length === 0) return text;
+  return text.replace(/<x(\d+)\s*\/>/gi, (_, idx) => tokens[parseInt(idx, 10)] ?? '');
+}
+
+/**
+ * Check if a string contains interpolation expressions.
  */
 export function parseInterpolation(text) {
-  // Vue-style {{ expr }}
   const vuePattern = /\{\{\s*([^}]+?)\s*\}\}/g;
-  // React/JS-style {expr} or ${expr}
-  const jsPattern = /\$?\{([^}]+)\}/g;
 
   const parts = [];
   let hasInterpolation = false;
 
-  // Check for Vue interpolation
   if (vuePattern.test(text)) {
     hasInterpolation = true;
     vuePattern.lastIndex = 0;
@@ -88,4 +167,4 @@ export function parseInterpolation(text) {
   }
 
   return { hasInterpolation, parts };
-}
+}