gt-next Lint

ESLint plugin for gt-next components.

GT Next Lint

This is in alpha. Subject to changes.

ESLint plugin that catches common translation errors in gt-next components.

Installation

npm install --save-dev @generaltranslation/gt-next-lint

Configuration

Add to your eslint.config.mjs:

import gtNext from "@generaltranslation/gt-next-lint";

export default [
  {
    plugins: { 'gt-next': gtNext },
    rules: {
      'gt-next/no-dynamic-jsx': 'warn',
      'gt-next/no-dynamic-string': 'warn',
    },
  },
];

Rules

no-dynamic-jsx

Wraps dynamic content in <T> components with variable components.

// ❌ Wrong
<T>Hello {userName}!</T>

// ✅ Correct  
<T>Hello <Var>{userName}</Var>!</T>

no-dynamic-string

Only allows string literals in translation functions.

const t = useGT();

// ❌ Wrong
t(`Hello ${name}`)
t('Hello ' + name)

// ✅ Correct
t('Hello, {name}!', { name })

Supported Components

  • <Var> - Variables
  • <DateTime> - Dates
  • <Num> - Numbers
  • <Currency> - Currency

Supported Functions

  • useGT() - Client translations
  • getGT() - Server translations

How is this guide?