react-admin-i18n

Configure React-Admin i18n with Polyglot.js and translation catalogs.

2|Updated Jul 17, 2025
One-click install
npx skills add https://github.com/SouleymaneSy7/dots-files --skill react-admin-i18n-souleymanesy7
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: react-admin-i18n
Source: https://github.com/SouleymaneSy7/dots-files/tree/main/opencode/skills/react-admin-i18n
Command: npx skills add https://github.com/SouleymaneSy7/dots-files --skill react-admin-i18n-souleymanesy7

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires ra-i18n-polyglot, ra-language-english, ra-language-french, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill addresses the complexities of internationalizing a React-Admin or shadcn admin kit application, ensuring a seamless multi-language experience without the pitfalls of manual translation.

Core Features & Use Cases

  • Internationalization Workflow: Guides through setting up i18n providers, structuring translation catalogs, and converting hardcoded strings.
  • Namespace Conventions: Enforces best practices for naming translation keys, reducing duplication and improving maintainability.
  • Type-Safe Catalogs: Implements type-safe message catalogs for English and other languages, with strict typing for compile-time checks.
  • i18nProvider Setup: Offers a comprehensive guide for configuring the i18nProvider with locale detection and language switching.
  • Component Conversion Process: Provides a systematic approach to converting components for internationalization, ensuring all strings are properly translated.

Quick Start

Run the react-admin-i18n skill to internationalize your React-Admin application, ensuring full support for English and French.

Frequently Asked Questions about react-admin-i18n

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add internationalization to a React-Admin application?

To add internationalization to a React-Admin app, you need to configure an i18n provider using Polyglot.js, structure translation catalogs, and convert hardcoded strings into translation keys. This ensures a seamless multi-language experience.

What is the best way to manage translations in React-Admin?

Managing translations in React-Admin is best handled by using Polyglot.js alongside ra-i18n-polyglot. This approach enforces namespace conventions for translation keys, reducing duplication and improving maintainability across your message catalogs.

Do I need ra-i18n-polyglot to set up localization in React-Admin?

Yes, setting up localization in React-Admin requires ra-i18n-polyglot, along with ra-language-english and ra-language-french. These dependencies provide the necessary providers and default message catalogs for language switching.

How do I structure type-safe translation catalogs for React-Admin?

Structuring type-safe translation catalogs involves implementing strict typing for English and other languages to enable compile-time checks. This systematic approach ensures all component strings are properly converted and correctly mapped to translation keys.

Can I use this internationalization workflow with a shadcn admin kit?

Yes, the internationalization workflow supports both React-Admin and shadcn admin kit applications. It guides you through dependency installation, catalog structuring, and component conversion to achieve full multi-language support.

How does pluralization work with Polyglot.js in React-Admin?

Pluralization with Polyglot.js in React-Admin is handled through configured translation catalogs that provide best practices for localization. The i18nProvider setup automatically manages plural forms based on the detected active locale.