skills.rest
Arnutt-N
Arnutt-NCOMMUNITY
Explore all skills by this author →
GitHub

i18n-helper

Manage Thai and English translations with React hooks for runtime locale switching.

Updated Jan 8, 2026
Search Tags:#frontend#react#formatting#localization#i18n#translations#locale
One-click install
npx skills add https://github.com/Arnutt-N/hr-ims --skill i18n-helper
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: i18n-helper
Source: https://github.com/Arnutt-N/hr-ims/tree/main/.claude/skills/i18n-helper
Command: npx skills add https://github.com/Arnutt-N/hr-ims --skill i18n-helper

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Internationalization (i18n) and localization utilities for HR-IMS are provided to manage translations, locale formatting, and multi-language rendering across the frontend.

Core Features & Use Cases

  • Translation management with a centralized locale map for Thai and English
  • Locale-aware formatting utilities for dates, numbers, and currencies
  • Simple React hooks and services to switch locales at runtime
  • Use Case: Build bilingual UI components by calling t('nav.dashboard') to render the correct language text.

Quick Start

Install and integrate the i18n helper into your frontend, then initialize the provider and begin translating UI texts with t(key, locale, params).

Frequently Asked Questions about i18n-helper

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

FAQPage Schema
How do I add multi-language support for Thai and English in a React frontend?▼

Multi-language support for Thai and English is added by initializing a centralized translation provider and resolving keys via t('nav.dashboard') to render runtime language switching in React components.

What is the best way to manage locale-aware formatting for dates and currencies in a bilingual app?▼

Locale-aware formatting for dates, numbers, and currencies is managed through built-in format helpers that adjust display outputs dynamically based on the active Thai or English locale runtime.

How do I switch UI locales at runtime using React hooks?▼

You switch UI locales at runtime by calling the useI18n hook provided by the i18n service, which dynamically updates the translation map and re-renders localized text without reloading the frontend.

Can I use a centralized translation map for frontend localization in HR systems?▼

Yes, frontend localization in HR systems is handled through a centralized locale map that pairs translation keys with Thai and English strings, ensuring consistent bilingual rendering across UI components.

Do I need external dependencies to implement runtime locale switching in React?▼

No external dependencies are required to implement runtime locale switching; the utility provides a self-contained i18n service, format helpers, and provider hooks natively for your frontend workflow.

Related Skills

Explore More Software Engineering Skills→
btabaskabtabaska
1

Update Translations

Scan React/JSX codebases for missing i18n keys and generate locale patches.

Community
Intermediate
trusted-americantrusted-american

ember-intl

Implement ember-intl internationalization with ICU MessageFormat and YAML translations.

Official
Advanced
StaysrStaysr

i18n

Generate React localization translations from flat dot-notation keys with react-i18next.

Community
Intermediate
Sir-chawakornSir-chawakorn
33

internationalization

Implement internationalization and localization for multi-language applications.

Community
Intermediate