skills.rest
AHMADJAN-New
AHMADJAN-NewCOMMUNITY
Explore all skills by this author →
GitHub

nazim-i18n

Manage translations and RTL layouts across English, Pashto, Arabic and Farsi using the useLanguage hook and titleKey navigation items.

Updated Nov 15, 2025
Search Tags:#frontend#localization#translation#i18n#internationalization#rtl
One-click install
npx skills add https://github.com/AHMADJAN-New/nazim-web --skill nazim-i18n
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: nazim-i18n
Source: https://github.com/AHMADJAN-New/nazim-web/tree/main/.cursor/skills/nazim-i18n
Command: npx skills add https://github.com/AHMADJAN-New/nazim-web --skill nazim-i18n

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill simplifies the process of internationalizing your application by managing translations and ensuring proper Right-to-Left (RTL) layout support for multiple languages.

Core Features & Use Cases

  • Multi-language Support: Integrates English, Pashto, Farsi, and Arabic translations.
  • RTL Layout Handling: Automatically adjusts UI direction and styling for RTL languages.
  • Translation Management: Provides a clear structure for adding new keys and managing language files.
  • Use Case: When developing new UI components, ensure all user-facing text is translated and that the layout correctly adapts for Arabic or Farsi users.

Quick Start

Use the nazim-i18n skill to add a new translation key for 'dashboard.welcomeMessage' to all supported languages.

Frequently Asked Questions about nazim-i18n

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

FAQPage Schema
How do I add new translation keys for multiple languages in a frontend app?▼

You add new translation keys by updating the structured language files for English, Pashto, Farsi, and Arabic. This internationalization process ensures all user-facing text is properly mapped and managed across supported languages.

What is the best way to implement Right-to-Left RTL layout for Arabic and Farsi UI components?▼

Implementing RTL layout requires using the useLanguage hook to automatically adjust UI direction and apply conditional classes. This ensures your frontend components correctly adapt styling for RTL languages like Arabic and Farsi.

Can I use a useLanguage hook to manage both translations and RTL direction?▼

Yes, the useLanguage hook handles both internationalization translations and RTL layout adjustments. It provides conditional class application and translates navigation items via titleKey for English, Pashto, Farsi, and Arabic.

How do I translate navigation items using a titleKey in an internationalized application?▼

Translate navigation items by referencing a specific translation key through the titleKey property. This links your navigation structure directly to the language files, allowing the useLanguage hook to render the correct localized text.

Does this internationalization approach support conditional CSS classes for RTL languages?▼

Yes, this internationalization approach supports conditional class application for RTL languages. By utilizing the useLanguage hook, you can dynamically apply CSS classes to adjust UI direction and styling based on the active language.

Related Skills

Explore More Software Engineering Skills→
praveenpererapraveenperera
4

shadcn-baseui

Catalog shadcn/ui/Base UI components and Radix-to-Base UI migration guides for React projects.

Community
Advanced
AribSudiaAribSudia
2

arib-docs-language

Audit web components for RTL, CJK, Indic, and LTR locale compliance.

Community
Advanced
ekremmkasapekremmkasap

web-component-design

Design reusable UI components compatible across React, Vue, and Svelte.

Community
Advanced
CrazyDubyaCrazyDubya

internationalization-helper

Extract hardcoded strings and manage translation files across locales.

Community
Intermediate