القائمة
Trigger: i18n, translation, i18next, language, locale, new language, translate. spotiarr frontend i18n: key conventions, useLanguageSync override, adding languages.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
Trigger: Docker, docker-compose, deploy, container, volume, DOWNLOADS_DIR, PUID, PGID, update, self-hosted. spotiarr Docker setup: services, volumes, env vars, update flow.
Trigger: Zustand, store, client state, usePlayerStore, usePreferencesStore, playerUISlice, ephemeral state, persist middleware. spotiarr Zustand rules: 2 stores + player UI slice, server state stays in TanStack Query, patterns for selectors and bulk hooks.
Trigger: command, validate, PR, branch, run lint, run build, secrets. Correct pnpm commands, branch naming, PR checklist, and secrets rules for spotiarr.
Trigger: architecture, layer, placement, where does X go, new feature, repo structure. spotiarr layer rules: backend DDD-lite, frontend hooks/store/views.
Trigger: SSE, server-sent events, real-time, useServerEvents, live updates, EventSource. spotiarr SSE pattern: frontend EventSource hook, backend AppEventBus, 4 event types.
Run and configure oxlint — the high-performance JavaScript/TypeScript linter built on the Oxc compiler stack. Use this skill whenever working in a project that has oxlint installed (check for `oxlint` in package.json devDependencies or an `.oxlintrc.json` / `oxlint.config.ts` config file). This includes when you need to lint code after making changes, fix linting errors, configure oxlint rules/plugins, set up or modify `.oxlintrc.json`, or migrate from ESLint.
| name | spotiarr-i18n |
| description | Trigger: i18n, translation, i18next, language, locale, new language, translate. spotiarr frontend i18n: key conventions, useLanguageSync override, adding languages. |
| license | Apache-2.0 |
| metadata | {"author":"gentleman-programming","version":"2.0"} |
Load when adding/modifying translations, working with i18n keys, or adding a new frontend language.
UI_LANGUAGE backend setting via useLanguageSync — it overrides browser detection. Never call i18n.changeLanguage() manually elsewhere.escapeValue: false is configured — HTML in translation strings is NOT escaped. Never put untrusted content in translation values.common.loading, common.errors.pageNotFound, common.trackStatus.errorcommon.dates.todayAt → t("common.dates.todayAt", { time: "14:30" })downloadAll, clearAll, openInSpotifycommon exist (e.g. instanceAuth, player, settings) — check src/locales/en.json for the current group list before adding a new top-level key.| Action | Steps |
|---|---|
| Add keys | Edit src/locales/en.json + src/locales/es.json simultaneously |
| Add new language | Copy en.json → {lang}.json · import in i18n.ts · add to resources · update i18next.d.ts |
| Use in component | const { t } = useTranslation() → t("key.path") |
apps/frontend/src/i18n.tsapps/frontend/src/locales/apps/frontend/src/types/i18next.d.tsapps/frontend/src/hooks/useLanguageSync.ts