Agent skill

Cometchat I18n

by cometchat in cometchat/cometchat-skills

Localize a CometChat integration — set the UI Kit language, register custom/overridden translations, handle RTL, and never leak a raw localization key into the UI.

MITAuto-check passedFrontend & Design

Install Cometchat I18n

skills CLI
$ npx skills add cometchat/cometchat-skills --skill cometchat-i18n -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install cometchat/cometchat-skills cometchat-i18n --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/cometchat/cometchat-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/cometchat-i18n .claude/skills/cometchat-i18n && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
cometchat-i18n
GitHub stars
130
Token cost
~1.9k tokens
SKILL.md length
839 words
Files
1
Skills in repo
97
Repo updated
First seen
Licence
MIT

At a glance

Localize a CometChat integration — set the UI Kit language, register custom/overridden translations, handle RTL, and never leak a raw localization key into the UI.

  • Works in 3 steps: Set the locale — let it auto-detect, or… → Register custom / overridden… → Read a string yourself where you render…
  • Tasks that involve Internationalization
  • SKILL.md covers Use this skill when, The mechanism (per family, one…, Never render a raw key and RTL (Arabic, Hebrew, Farsi,…, plus 3 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Cometchat I18n is an agent skill from cometchat/cometchat-skills. Localize a CometChat integration — set the UI Kit language, register custom/overridden translations, handle RTL, and never leak a raw localization key into the UI. Cross-family: the mechanism is CometChatLocalize on React, Angular, iOS and Android, while React Native uses CometChatI18nProvider (there is no CometChatLocalize in the RN kit); the exact signature is fetched from each family's localize doc. Triggers: 'translate cometchat', 'change chat language', 'localization', 'i18n', 'RTL / Arabic / Hebrew chat'…

Its SKILL.md is about 1.9k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts. Compatibility notes: CometChatLocalize on React v7 · Angular v5 · iOS v5 · Android v6. React Native v5 uses CometChatI18nProvider + the useCometChatTranslation hook (no…

It sits in Frontend & Design, covering Internationalization, Translation and Cross-platform mobile apps. It works with CometChat, React, React Native and Angular. The repository describes itself as: Add CometChat chat & messaging and voice & video calls to any React, Next.js, React Native, Angular, Android, iOS, or Flutter project through your AI coding agent. Works with… The licence is MIT.

When your agent uses it

  • Tasks that involve Internationalization
  • Tasks that involve Translation
  • Tasks that involve Cross-platform mobile apps

Example prompts

  • “s localize doc. Triggers:”
  • “change chat language”
  • “localization”
  • “/cometchat-i18n”

Requirements

  • Compatibility (from SKILL.md): CometChatLocalize on React v7 · Angular v5 · iOS v5 · Android v6. React Native v5 uses CometChatI18nProvider + the useCometChatTranslation hook (no CometChatLocalize in the RN kit). Flutter v6 is moving to CometChatLocalize but the shipping 6.1.0 kit uses Translations (staged). Exact API per family+major from that family's localize docs.

Workflow steps

3 steps, taken from the first numbered list in SKILL.md.

  1. Set the locale — let it auto-detect, or set it explicitly to match your app's language switcher. Do this before the surface renders…
  2. Register custom / overridden translations — add your own strings or override the kit defaults per locale (e.g. React v7…
  3. Read a string yourself where you render kit text in your own markup — use the family's localized-string accessor (React v7…

What it can do on your machine

Read from SKILL.md and the folder at commit 911b108. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md.

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

  • Compatibility

    CometChatLocalize on React v7 · Angular v5 · iOS v5 · Android v6. React Native v5 uses CometChatI18nProvider + the useCometChatTranslation hook (no CometChatLocalize in the RN kit). Flutter v6 is moving to CometChatLocalize but the shipping 6.1.0 kit uses Translations (staged). Exact API per family+major from that family's localize docs.

    From compatibility in the SKILL.md frontmatter.

Context cost

Cometchat I18n loads about 1.9k tokens when it runs. Until then it costs about 158 tokens; SKILL.md has 839 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~158
When it runs · the whole SKILL.md, loaded when a task matches
~1.9k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from cometchat/cometchat-skills at commit 911b108, republished under its MIT licence (© cometchat). 839 words, ~1,896 tokens.

Download SKILL.mdSave it as .claude/skills/cometchat-i18n/SKILL.md (or your agent's skills folder).
name
cometchat-i18n
description
Localize a CometChat integration — set the UI Kit language, register custom/overridden translations, handle RTL, and never leak a raw localization key into the UI. Cross-family: the mechanism is CometChatLocalize on React, Angular, iOS and Android, while React Native uses CometChatI18nProvider (there is no CometChatLocalize in the RN kit); the exact signature is fetched from each family's localize doc. Triggers: 'translate cometchat', 'change chat language', 'localization', 'i18n', 'RTL / Arabic / Hebrew chat', 'my UI shows group_info instead of a label', 'add a language to cometchat', 'custom translations'.
compatibility
CometChatLocalize on React v7 · Angular v5 · iOS v5 · Android v6. React Native v5 uses CometChatI18nProvider + the useCometChatTranslation hook (no CometChatLocalize in the RN kit). Flutter v6 is moving to CometChatLocalize but the shipping 6.1.0 kit uses Translations (staged). Exact API per family+major from that family's localize docs.
license
MIT
metadata.author
CometChat
metadata.version
1.0.0
metadata.tags
cometchat i18n localization localize rtl language translations cometchatlocalize

Ground truth: localization is the CometChatLocalize class on React, Angular, iOS and Android. Two exceptions: React Native uses CometChatI18nProvider + the useCometChatTranslation hook (there is no CometChatLocalize in the RN kit — catalog-confirmed), and Flutter is moving to CometChatLocalize but the shipping 6.1.0 kit still exposes Translations (see cometchat-flutter-v6-customization → Localization — STAGED pending the kit). Exact methods and built-in string keys differ by family and major — FETCH the signature from the resolved family's localize doc via cometchat-<family>-core/references/docs-map.md (intent: localization / localize). Do not carry an API across families or majors (v6 React, for one, renamed language codes and keys). Never assert a key set from memory — look it up in the kit's resources/<lang>/translation.json / the localize page.

Use this skill when

Making the chat speak another language, shipping to a multi-locale or RTL market, adding/overriding wording, or fixing a UI that shows a raw key (e.g. group_info) instead of text.

The mechanism (per family, one shape)

Most UI Kits localize through CometChatLocalize (React Native is the exception — it uses CometChatI18nProvider + the useCometChatTranslation hook): it can detect the user's browser/device language and set the active locale, and it exposes the current locale to components (which read their strings from it). The three things you do:

  1. Set the locale — let it auto-detect, or set it explicitly to match your app's language switcher. Do this before the surface renders (alongside init), so components mount already localized. (React v7: pass the locale prop on CometChatProvider — <CometChatProvider locale="fr"> — applied on mount/change.)
  2. Register custom / overridden translations — add your own strings or override the kit defaults per locale (e.g. React v7: CometChatLocalize.getSharedInstance()?.addTranslation({ "en-us": { key: "value" } }) — an INSTANCE method taking a nested per-language map; reach the live instance via getSharedInstance(), never new CometChatLocalize(); other families have the equivalent — React Native instead uses the CometChatI18nProvider translations prop, keyed on the active language code: under the default auto-detect that's the 2-letter device code, so use translations={{ "en": { KEY: "value" } }} — a regional key like en-US is ignored unless you also pass selectedLanguage="en-US", and codes must match the kit's keys exactly (case-sensitive) — e.g. zh-tw is lowercase but en-US/en-GB are uppercase-region; not addTranslation. Provider props: selectedLanguage · autoDetectLanguage · translations · fallbackLanguage — {DOCS_BASE}/ui-kit/react-native/localize). Fetch the exact call for your family.
  3. Read a string yourself where you render kit text in your own markup — use the family's localized-string accessor (React v7: useLocale().getLocalizedString(key)), never a hardcoded English literal.

The exact class methods, the supported language list, and the key namespace are per family+major — fetch them; this file is the discipline, the docs are the signatures.

Never render a raw key

A snake_case token in the UI (group_info, add_members, sample_*) means a missing or wrong key — the localizer returns the key on a miss. Causes and fixes:

  • The component isn't inside the kit provider/localization context → wrap it (the provider auto-wires localization).
  • The key changed across majors (v5→v6/v7 moved keys, some under sample_*) → look up the CURRENT key in the kit's resources/<lang>/translation.json or the localize doc; don't guess.
  • You hardcoded a raw key as a label → use the component or the localized-string accessor.
Show full SKILL.md (338 more words)Show less

RTL (Arabic, Hebrew, Farsi, Urdu)

  • Set the document/layout direction to RTL for RTL locales (web: dir="rtl" on the app root or the locale-driven wrapper; native: the platform's RTL layout support). The kit follows the surrounding direction; your host must set it.
  • React Native exception: the RN kit ships no RTL locale — its built-in languages (≈18, plus English regional aliases; {DOCS_BASE}/ui-kit/react-native/localize → Supported Languages) are all LTR (no Arabic/Hebrew/Farsi/Urdu). An RTL language is only possible as a custom translations entry + a matching selectedLanguage, with the host handling layout direction — re-check that page before promising RTL chat on React Native.
  • Don't hard-code left/right margins/paddings on the kit's ancestors — use logical properties (margin-inline-start, etc.) so your chrome mirrors correctly.
  • Verify icons/affordances that imply direction (back, send) read correctly mirrored.

Also

  • Dates/times/numbers localize with the locale; confirm the family's date-format option (v6+ added date-format controls) matches the user's region.
  • User-generated content is not translated by localization — that's the message-translation feature (per-message, cometchat-<family>-features), a different thing from UI-Kit localization.
  • Keep host i18n and kit i18n in sync — when your app switches language, also switch the kit's language so the chat doesn't stay in the old one: set CometChatLocalize (React · Angular · iOS · Android), or change the selectedLanguage prop on CometChatI18nProvider (React Native — there is no CometChatLocalize setter there).

Common pitfalls

  1. Raw keys in the UI — missing/renamed key or missing provider; look up the current key, don't guess.
  2. Carrying an API across families/majors — v6 React changed codes/keys; fetch per family.
  3. Locale set after render — set it before/with init so the surface mounts localized.
  4. RTL not applied by the host — the kit mirrors within the direction you set; set dir/layout direction yourself.
  5. Confusing UI localization with message translation — different features.

Verify it works

Switching the app language re-renders the chat in that language · no snake_case keys appear in the UI · custom/overridden strings show · an RTL locale mirrors layout and direction-sensitive icons · dates/times read in the locale · your language switcher and the kit's language (CometChatLocalize, or React Native's selectedLanguage prop) stay in sync.

© cometchat, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in skills/cometchat-i18n of cometchat/cometchat-skills.

Open the folder on GitHubat commit 911b108

Compare with similar skills

Cometchat I18n next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Cometchat I18n compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Cometchat I18n this skillcometchat/cometchat-skills130—~1.9kAutomated safety check: PassMIT
Screenmapaleqsio/screenmap242—~7.2kAutomated safety check: PassMIT
ThemingCode-with-Beto/skills141—~2.5kAutomated safety check: PassNone
AccessibilityGetStream/stream-chat-react-native1.2k—~6.5kAutomated safety check: PassCustom licence
Solar Iconssaoudi-h/solar-icons184—~2.1kAutomated safety check: PassMIT
Frontend UI StandardsMaxHan7/frontend-ui-standards-skill106—~2.4kAutomated safety check: PassMIT

Similar skills

  • Screenmap

    aleqsio/screenmap

    Generate a visual navigation map of an Expo / React Native or NativeScript app.

    242 GitHub stars~7.2k tokensUpdated 3 days ago
    MobileAuto-check passed
  • Theming

    Code-with-Beto/skills

    Scaffold a unified, cross-platform color theme system into an Expo Router app.

    141 GitHub stars~2.5k tokensUpdated 2 mo ago
    MobileAuto-check passed
  • Accessibility

    GetStream/stream-chat-react-native

    Maintain VoiceOver/TalkBack-focused accessibility in stream-chat-react-native.

    1.2k GitHub stars~6.5k tokensUpdated yesterday
    Frontend & DesignAuto-check passed
  • Solar Icons

    saoudi-h/solar-icons

    Add Solar Icons via @solar-icons/cli to any React, Vue, Svelte, Solid, Angular, React Native, Nuxt, Static, vanilla JS, or Laravel Blade project.

    184 GitHub stars~2.1k tokensUpdated today
    Frontend & DesignAuto-check passed
  • Frontend UI Standards

    MaxHan7/frontend-ui-standards-skill

    A skill your agent uses when implementing, refactoring, or reviewing frontend UI across SwiftUI, React, React Native, Flutter, web, or mobile apps.

    106 GitHub stars~2.4k tokensUpdated 3 mo ago
    Frontend & DesignAuto-check passed
  • Frontend Design

    avibebuilder/claude-prime

    Builds distinctive, production-grade UIs that avoid generic AI aesthetics.

    120 GitHub stars~2.1k tokensUpdated 4 mo ago
    Frontend & DesignAuto-check passed

More from cometchat/cometchat-skills

All 97 skills in this repo
  • CometChat Android Calls SDK v5

    cometchat/cometchat-skills

    Adds voice and video calling to an Android app in Kotlin with the headless CometChat Calls SDK v5, covering meeting-style rooms, 1:1 ringing calls, call logs and recording.

    130 GitHub stars~5.2k tokensUpdated 3 days ago
    Auto-check passed
  • CometChat Android v5 Headless SDK

    cometchat/cometchat-skills

    Builds chat on Android with your own UI against the headless CometChat Chat SDK v5, covering install, Jetifier conflicts, credentials and init-before-login ordering.

    130 GitHub stars~4k tokensUpdated 3 days ago
    Auto-check passed
  • CometChat Angular Component Picker

    cometchat/cometchat-skills

    Picks and customizes CometChat's Angular UI Kit components by their verified component list, exact input and output event names, and the surfaces that have no kit component at all.

    130 GitHub stars~2.6k tokensUpdated 3 days ago
    Auto-check passed
  • CometChat Angular Features

    cometchat/cometchat-skills

    Enables or builds CometChat features such as polls, reactions, smart replies and pinned messages in an Angular app, first classifying how much client code each one needs.

    130 GitHub stars~2.6k tokensUpdated 3 days ago
    Auto-check passed
  • CometChat Angular Chat Placement

    cometchat/cometchat-skills

    Decides where CometChat chat UI goes in an Angular app: a dedicated route, a dashboard panel, a support widget or the full multi-pane app, with thread and search panels.

    130 GitHub stars~2.2k tokensUpdated 3 days ago
    Auto-check passed
  • Cometchat iOS V5 SDK

    cometchat/cometchat-skills

    Add voice & video calling to any iOS app FROM SCRATCH with the headless CometChat Calls SDK v5 (CometChatCallsSDK, via Swift Package Manager) — no UI Kit.

    130 GitHub stars~5.2k tokensUpdated 3 days ago
    Auto-check passed

Questions about Cometchat I18n

What does Cometchat I18n do?

Localize a CometChat integration — set the UI Kit language, register custom/overridden translations, handle RTL, and never leak a raw localization key into the UI. Cometchat I18n is an agent skill from cometchat/cometchat-skills. Localize a CometChat integration — set the UI Kit language, register custom/overridden translations, handle RTL, and never leak a raw localization key into the UI.

When should I use Cometchat I18n?

Cometchat I18n fits situations like: tasks that involve Internationalization; tasks that involve Translation; tasks that involve Cross-platform mobile apps.

How do I install Cometchat I18n in Claude Code?

Run `npx skills add cometchat/cometchat-skills --skill cometchat-i18n -a claude-code`. Or copy the skill folder (skills/cometchat-i18n in cometchat/cometchat-skills) into .claude/skills/cometchat-i18n in your project. Claude Code loads it when a task matches its description.

How do I install Cometchat I18n in Codex?

Run `npx skills add cometchat/cometchat-skills --skill cometchat-i18n -a codex`. Or copy the skill folder (skills/cometchat-i18n in cometchat/cometchat-skills) into .agents/skills/cometchat-i18n in your project. Codex loads it when a task matches its description.

Can I use Cometchat I18n in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add cometchat/cometchat-skills --skill cometchat-i18n -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/cometchat-i18n, .gemini/skills/cometchat-i18n, .github/skills/cometchat-i18n and .opencode/skills/cometchat-i18n in your project.

What does Cometchat I18n need to run?

SKILL.md names no scripts, command-line tools or credentials: Cometchat I18n is instructions for the agent only. Compatibility (from SKILL.md): CometChatLocalize on React v7 · Angular v5 · iOS v5 · Android v6. React Native v5 uses CometChatI18nProvider + the useCometChatTranslation hook (no CometChatLocalize in the RN kit). Flutter v6 is moving to CometChatLocalize but the shipping 6.1.0 kit uses Translations (staged). Exact API per family+major from that family's localize docs..

Does Cometchat I18n access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Cometchat I18n safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Cometchat I18n use?

Cometchat I18n is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Cometchat I18n use?

About 1.9k tokens (SKILL.md is roughly 7.6k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Cometchat I18n?

Skills that share tags, products or a category with Cometchat I18n: Screenmap (aleqsio/screenmap, 242 stars), Theming (Code-with-Beto/skills, 141 stars), Accessibility (GetStream/stream-chat-react-native, 1.2k stars) and Solar Icons (saoudi-h/solar-icons, 184 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Cometchat I18n?

cometchat (a GitHub organization) maintains it in cometchat/cometchat-skills, which has 130 GitHub stars. The repository holds 97 skills in this directory. The repository was last updated on October 5, 2026.

Source: cometchat/cometchat-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.