tsh-i18n

Coordinates English and Arabic translations for the TSH Client Console with JSON namespaces and RTL layouts.

Updated Nov 26, 2025
One-click install
npx skills add https://github.com/Qmop1967/Clients-Console --skill tsh-i18n
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: tsh-i18n
Source: https://github.com/Qmop1967/Clients-Console/tree/main/.claude/skills/tsh-i18n
Command: npx skills add https://github.com/Qmop1967/Clients-Console --skill tsh-i18n

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill eliminates the complexity of manually managing translations, ensuring RTL support, and integrating internationalization into various components and pages, saving development time and reducing errors.

Core Features & Use Cases

  • Bilingual Support: Seamlessly integrate English and Arabic with full RTL layout handling, ensuring a native experience for all users.
  • Component-Level Translations: Easily add translations to both client and server components, simplifying content management across your application.
  • SEO Metadata Translation: Ensure your app's metadata is correctly translated for global search engines, boosting international discoverability.
  • Use Case: When launching your app in a new region, use this Skill to quickly add a new language, ensuring all UI elements, content, and SEO metadata are correctly translated and displayed without manual oversight.

Quick Start

Use the tsh-i18n skill to add a new translation key 'welcomeMessage' with the English text 'Welcome!' and Arabic text 'أهلاً وسهلاً!' to the 'common' namespace.

Frequently Asked Questions about tsh-i18n

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

FAQPage Schema
How do I add multilingual support to a Next.js app with English and Arabic?

Multilingual support in Next.js involves setting up i18n with JSON translation namespaces for each language. This Skill provides pre-configured English and Arabic translations across common, navigation, products, orders, auth, dashboard, and errors namespaces, plus RTL layout utilities, enabling you to render content in both languages with automatic direction handling.

How do I manage translations for RTL languages like Arabic in Next.js?

RTL language management requires layout direction awareness and logical property styling. This Skill includes RTL-aware layout utilities and direction-aware components that automatically adjust your UI for Arabic, ensuring text, icons, and spacing flow correctly without manual CSS overrides.

Can I translate SEO metadata for international search visibility?

Yes, SEO metadata translation ensures search engines index your content correctly for each language market. This Skill integrates metadata translation into your Next.js workflow, allowing you to translate page titles, descriptions, and structured data alongside your UI text.

How do I use translations in both Next.js client and server components?

Translation access differs between client and server contexts in Next.js. This Skill provides type-safe hooks—useTranslations for client components and getTranslations for server components—enabling consistent translation usage across your entire application with TypeScript support.

What's the fastest way to add a new language to an existing Next.js app?

Adding a language requires creating translation files and updating i18n configuration. This Skill accelerates the process by providing structured JSON namespaces and integration patterns, so you add new language files and configure routing without rebuilding translation infrastructure.

Do I need a separate CMS to manage translations, or can I store them locally?

Local JSON-based translation storage works well for smaller teams and tightly coupled content. This Skill uses JSON namespaces stored alongside your codebase, giving you version control and no external dependencies, though it requires rebuilding to update translations.