Agent skill
1k-i18n
Internationalization and translation management for OneKey. Use when adding translations, displaying text, handling locales, or managing translation keys. NEVER modify auto-generated translation files. Triggers on i18n, translation, locale, formatMessage, useIntl, ETranslations, text, string, hardcode, intl, translate, language, localization, internationalization.
Stars
163
Forks
31
Install this agent skill to your Project
npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/data/1k-i18n
SKILL.md
Internationalization (i18n)
Guidelines for internationalization and translation management in OneKey.
Critical Restrictions
ABSOLUTELY FORBIDDEN (auto-generated files):
typescript
// ❌ NEVER modify these files - they are AUTO-GENERATED
// @onekeyhq/shared/src/locale/enum/translations.ts
// @onekeyhq/shared/src/locale/json/*.json
// ❌ NEVER hardcode text strings
<Text>Confirm</Text>
// ✅ CORRECT - Always use translation keys
import { ETranslations } from '@onekeyhq/shared/src/locale';
intl.formatMessage({ id: ETranslations.global__confirm })
Consequences of violation:
- Translation system corruption
- Loss of translation work
- Build failures in i18n pipeline
- Breaking localization for international users
Quick Reference
Using Translations in Components
typescript
import { useIntl } from 'react-intl';
import { ETranslations } from '@onekeyhq/shared/src/locale';
function MyComponent() {
const intl = useIntl();
return (
<SizableText>
{intl.formatMessage({ id: ETranslations.global__confirm })}
</SizableText>
);
}
Using formatMessage Outside Components
typescript
import { appLocale } from '@onekeyhq/shared/src/locale/appLocale';
import { ETranslations } from '@onekeyhq/shared/src/locale';
const message = appLocale.intl.formatMessage({
id: ETranslations.global__cancel,
});
Translation Workflow
- Design provides translation key like
prime::restore_purchases - Run sync command:
yarn fetch:locale - Convert key format:
prime::restore_purchases→ETranslations.prime_restore_purchases - Use in code:
tsx
{intl.formatMessage({ id: ETranslations.prime_restore_purchases })}
Translation Key Naming Pattern
namespace__action_description
Examples:
- global__confirm
- global__cancel
- swap__select_token
- wallet__create_wallet
- settings__dark_mode
Detailed Guide
For comprehensive i18n guidelines and examples, see i18n.md.
Topics covered:
- Translation management restrictions
- Using translations in components
- Translation key naming conventions
- Locale handling and fallbacks
- Code examples
- Workflow summary
Key Files
| Purpose | File Path |
|---|---|
| Translation enum (auto-generated) | packages/shared/src/locale/enum/translations.ts |
| Locale JSON (auto-generated) | packages/shared/src/locale/json/ |
| App locale | packages/shared/src/locale/appLocale.ts |
| Default locale | packages/shared/src/locale/getDefaultLocale.ts |
Related Skills
/1k-date-formatting- Date formatting with locale support/1k-coding-patterns- General coding patterns
Didn't find tool you were looking for?