polyglot_skill

Overview

This skill specializes in internationalization (i18n) and localization (l10n) for web and mobile apps. It extracts hardcoded strings, structures translation keys, applies ICU MessageFormat patterns, and integrates locale-aware formatting via the Intl APIs. It also prepares CSS and layout adjustments for right-to-left (RTL) languages and produces translator-friendly context.

How this skill works

I scan code (HTML, JSX, Vue templates) to find hardcoded text, non-localized dates, numbers, and concatenations. I extract strings into semantic nested keys, replace in-code text with t() calls or framework bindings, and implement Intl.DateTimeFormat/NumberFormat/RelativeTimeFormat where appropriate. I add ICU plural/gender/select patterns, translator context comments, and a PR summary with scope and impact for reviewers.

When to use it

• Adding support for one or more new languages
• Extracting hardcoded UI strings to translation files
• Formatting dates, currencies, numbers for target locales
• Preparing UI for RTL languages (Arabic, Hebrew, Persian)
• Standardizing translation key structure and glossary terms

Best practices

• Never concatenate translations; use interpolation and ICU MessageFormat
• Use semantic, nested keys (feature.element.action), avoid generic keys
• Add brief translator context comments for ambiguous strings
• Prefer Intl APIs for all locale-sensitive formatting, avoid hardcoded locale literals
• Adopt CSS logical properties and dynamic dir attributes for RTL support

Example use cases

• Convert a React app from hardcoded English to i18n with react-i18next and t() calls
• Replace string concatenation in notifications with ICU plural patterns
• Format server-rendered timestamps and currency using Intl APIs matching UI language
• Add RTL support by switching to CSS logical properties and flipping directional icons
• Design a translation namespace and glossary for an e-commerce checkout flow