martinandert / counterpart Goto Github PK

View Code? Open in Web Editor NEW

242.0 10.0 25.0 184 KB

A translation and localization library for Node.js and the browser.

License: MIT License

JavaScript 99.61% Makefile 0.39%

javascript internationalization localization translation library nodejs

counterpart's Issues

Locales are inheritance

Why the locale change for all not for current browser # user.

When i get 2 instace of my site and switch language, language is switched in both. Why its isn;t switched for browser window?

onError callback not getting called when interpolation error occurs

var translate = require('counterpart')

translate.onError(function(err, entry, values) {
  // not getting called
});

translate.registerTranslations('en', { hello: 'Hello, %(name)s!' });

// This is a bad call and will throw an error but won't call the onError callback
translate('hello');

The error gets caught as expected, but it throws the standard one instead of calling my custom error handler.

Everything else works fine, so it makes me think it's isolated to this feature.

Great library BTW, the ease of use and simplicity is fantastic. The consistent structure of use in particular makes extracting the key catalog from code much easier!

Passing react dom element to a placeholder

We are using counterpart heavily and it would be great if we can pass react dom element to a placeholder
like so

// imagine the following entry
counterpart.registerTranslations('en', {
 departures: {
      available_of: '%(available)s available of total %(max)s pax'
    }
})

// and display it using
  const available = (count) => {
    return (<b>{count}</b>);
  };
 translate('departures.available_of', {available: available(departure.available), max: departure.max})

Is it possible to implement this, please?

Fallback mechanism automatically searching a default resource file?

The fallback mechanism requires the default parameter to be supplied on each call. It would be nice if we a method could be added which would look up a default translation file if the translation did not exist. In many cases we are happy if the english translation (or another default language) is provided if the translation does not exist in the language. it is cumbersome to have to supply the default param each time.

Bad iteration if language fallback fails

counterpart/index.js

Lines 223 to 224 in e1e4204

    
           for (var ix in fallbackLocales) { 
        
             var fallbackLocale = fallbackLocales[ix];

I'm encountering this using bitshares-ui which uses this library to handle translations.

This library uses for...in to iterate over fallback language array, but if the fallback fail the code will continue to iterate over other objects in the array, like in the picture below. Using other for methods would avoid the problem.

You may want to avoid for...of though as it would possibly break some ES6-incompatible configurations... C-style for works.

Consider switching to a regularly maintained sprintf package

Thank you for your time and effort in creating this awesome package!

It occurred to me that switching to https://github.com/alexei/sprintf.js might be as simple as 2 line changes. This is the lib on which the currently used (https://github.com/maritz/node-sprintf) is based (as mentioned in its docs).

One benefit I can see over the old one (there might be many more) is that interpolations would support computed values (functions). Would have been really useful for me. :)

split confusion

I'm unclear about what the docs are saying about 'splitting'. Can someone explain better? This doesn't seem grammatical to me

The separator option allows you to change what the key gets split via for nested objects. It also allows you to stop counterpart splitting keys if you have a flat object structure:

Use of 'default' keyword causes issues with IE8

Could be addressed easily just by renaming the attribute.

translation file key has dots but is not a nested object

I have a translation service that returns a flat object that is 1 level deep and all keys are namespaced using a dot as seperator for various reasons. Is there an option to tell counterpart to not split via dots?

{
  'namespace.subject' : 'A subject'
}

Would you be open to a PR adding this if it's not already possible?

Fallback does not work with string '0'

I've had to put this check in place to handle strings that are 0 and enable fallback to work successfully.

return label === '0' ? counterpart(table.columns.${label}, { fallback: label }) : label;

Add docs for getFallbackLocale / setFallbackLocale

Just what the title says...

Introduced in commit 38d575b

Error: [sprintf] %

Hey, nice library.

How do I escape a % in the actual string, ie

c=require('counterpart')
c.registerTranslations('en', {'hello':'100%'})
c('hello')

Error: [sprintf] %
    at Function.str_format.parse (~/code/counterpart/node_modules/sprintf/lib/sprintf.js:233:11)
    at str_format (~/code/counterpart/node_modules/sprintf/lib/sprintf.js:77:48)
    at interpolate (~/code/counterpart/index.js:219:10)
    at translate (~/code/counterpart/index.js:140:13)
    at repl:1:2
    at REPLServer.self.eval (repl.js:112:21)
    at Interface.<anonymous> (repl.js:239:12)
    at Interface.EventEmitter.emit (events.js:117:20)
    at Interface._onLine (readline.js:202:10)
    at Interface._line (readline.js:531:8)

Translation of a text with a % character causes "SyntaxError: [sprintf] unexpected placeholder"

I'm using counterpart together with react translate and I am using it as such:

import counterpart from 'counterpart';
counterpart.translate('TOOLTIP_CHECKBOX')

if the TOOLTIP_CHECKBOX equals "About 25% of people..." the %-character will cause

SyntaxError: [sprintf] unexpected placeholder

Anybody know how to solve this?

Emit Event when translation is not found

Is there a way to trigger an event when translation is not found? Basically when the fallback is used.

This is important because missing translations should not be silently ignored but handled appropriately for each case.

ex. Translation not found > send request to server and log an error

Pluralization Issue

With:

module.exports = {
  "greeting": "Hello, %(name)s!",
  "x_nights": {
    "zero": "No Night",
    "one":   "1 Night",
    "other": "%(count) Nights"
  }
}

executing:

translate('x_nights.other', {count: 3}) results in:

Uncaught Error: [sprintf] %(count) Nächte(…)

`translate` as an instance

I'm working on a plugin where it will be possible to have multiple instances on a page using different locales. I couldn't find a way to do it, but I'm proposing something like this:

var translate = new Counterpart();

translate.setLocale('en');
translate.registerTranslations('en', {foo: 'bar'});

translate('foo'); // bar

You can then set the locale per instance, instead of globally.

problem with html content that contains a "%"

Hi,
I'm getting an error when a translation contains a percentage symbol (%).

Uncaught Error: [sprintf] %

Any idea on how I can get around this?

Edit: I tried using the entity "%" but the issue still persists

Add support for more plural forms

Please add support for more plural forms like "few" or "many".
https://unicode-org.github.io/cldr-staging/charts/38.1/supplemental/language_plural_rules.html

Do you plan to update the used counterpart version in your other projects?

We're currently using some of your projects and would like to go to the latest counterpart version and ditch our own forks. But this would need some updates on https://github.com/martinandert/react-translate-component, https://github.com/martinandert/react-ago-component, https://github.com/martinandert/react-interpolate-component and https://github.com/martinandert/damals maybe some more :-/

Most of them have counterpart ~0.11.* as "peer dependencie.

Greetings from Berlin,
cainvommars

Name of the option to select a specific pluralization

Hi!
I have been using your wonderful library (by react-translate-component).
When I used pluralization, I was faced with a problem. I used notationsCount instead of count as name for option to select a specific pluralization and got an error Uncaught Invariant Violation: Interpolate expects either a format string as only child or a 'format' prop with a string value.
It took some time until I figured it out.
Please emphasize in the documentation the fact that the name of the option to select a specific pluralization must be count.

how to handle simple formatting like bold or italic

Would like to emphasis some parts of the translation string.
I don't see any possibility without using to Translate components.
Would be very nice if Translate supports either raw HTML or supports some basic markdown syntax like _italic_ and __bold__ like this library here https://github.com/alexdrel/i18n-react

missing translation: nl.counterpart.pluralize

Have pluralizarions working in English but when switching to dutch I get this error

missing translation: nl.counterpart.pluralize

Registered locale data is here

EN:

  "terms": {
    "item": {
      "one": "Item",
      "other": "Items",
      "zero": "Items",
      "new": "New Item"
    },

NL:

  "terms": {
    "item": {
      "one": "Document",
      "other": "Documenten",
      "zero": "Documenten",
      "new": "Nieuw document"
    },

The EN works fine but NL throws the error

Cannot use Link of 'react-router' as component

I tried to pass a non native HTML element as component like this:

import { Link } from 'react-router'

<Translate to='/courses' component='Link' content='goto-course-list' />

but I got this error, seems like the component was

Warning: link is a void element tag and must not have `children` or use `props.dangerouslySetInnerHTML`. Check the render method of Interpolate.

warning @ warning.js?0260:45assertValidProps @ ReactDOMComponent.js?1302:200ReactDOMComponent.Mixin.mountComponent @ ReactDOMComponent.js?1302:454ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactMultiChild.Mixin.mountChildren @ ReactMultiChild.js?c87d:241ReactDOMComponent.Mixin._createContentMarkup @ ReactDOMComponent.js?1302:591ReactDOMComponent.Mixin.mountComponent @ ReactDOMComponent.js?1302:479ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactMultiChild.Mixin.mountChildren @ ReactMultiChild.js?c87d:241ReactDOMComponent.Mixin._createContentMarkup @ ReactDOMComponent.js?1302:591ReactDOMComponent.Mixin.mountComponent @ ReactDOMComponent.js?1302:479ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactMultiChild.Mixin.mountChildren @ ReactMultiChild.js?c87d:241ReactDOMComponent.Mixin._createContentMarkup @ ReactDOMComponent.js?1302:591ReactDOMComponent.Mixin.mountComponent @ ReactDOMComponent.js?1302:479ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactMultiChild.Mixin.mountChildren @ ReactMultiChild.js?c87d:241ReactDOMComponent.Mixin._createContentMarkup @ ReactDOMComponent.js?1302:591ReactDOMComponent.Mixin.mountComponent @ ReactDOMComponent.js?1302:479ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactMultiChild.Mixin.mountChildren @ ReactMultiChild.js?c87d:241ReactDOMComponent.Mixin._createContentMarkup @ ReactDOMComponent.js?1302:591ReactDOMComponent.Mixin.mountComponent @ ReactDOMComponent.js?1302:479ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactMultiChild.Mixin.mountChildren @ ReactMultiChild.js?c87d:241ReactDOMComponent.Mixin._createContentMarkup @ ReactDOMComponent.js?1302:591ReactDOMComponent.Mixin.mountComponent @ ReactDOMComponent.js?1302:479ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?cd59:225wrapper @ ReactPerf.js?ef93:66ReactReconciler.mountComponent @ ReactReconciler.js?6bfa:37mountComponentIntoNode @ ReactMount.js?2f23:266Mixin.perform @ Transaction.js?6dff:136batchedMountComponentIntoNode @ ReactMount.js?2f23:282Mixin.perform @ Transaction.js?6dff:136ReactDefaultBatchingStrategy.batchedUpdates @ ReactDefaultBatchingStrategy.js?ef70:62batchedUpdates @ ReactUpdates.js?ce09:94ReactMount._renderNewRootComponent @ ReactMount.js?2f23:476wrapper @ ReactPerf.js?ef93:66ReactMount._renderSubtreeIntoContainer @ ReactMount.js?2f23:550ReactMount.render @ ReactMount.js?2f23:570wrapper @ ReactPerf.js?ef93:66(anonymous function) @ index.js?dadc:17(anonymous function) @ bundle.js:3121__webpack_require__ @ bundle.js:521fn @ bundle.js:76(anonymous function) @ bundle.js:552__webpack_require__ @ bundle.js:521(anonymous function) @ bundle.js:544(anonymous function) @ bundle.js:547
client.js?3ac5:53 [HMR] connected

Why is translationnotfound fired only when fallback is provided?

I was wondering, is there some special reasoning behind that decision? Even if I don't provide a fallback, I'd still like to be able to e.g. throw an error when developing or log the information to the server when on production, so that I can find out about the missing translation easily

Interpolations not working

Seems to be unable to interpret %(key) here:

https://github.com/maritz/node-sprintf/blob/master/lib/sprintf.js#L199

I noticed that npm's sprintf module is deprecated in favor of sprintf-js. Haven't tried swapping it in, but it's probably worth a look.

To reproduce in Node,

counterpart = require('counterpart');
counterpart.registerTranslations('en', {foo: 'Foo is %(what).'});
counterpart('foo', {what: 'cool'});

results in

Error: [sprintf] %(what).
    at Function.str_format.parse (/node_modules/counterpart/node_modules/sprintf/lib/sprintf.js:231:11)
    at str_format (/node_modules/counterpart/node_modules/sprintf/lib/sprintf.js:75:48)
    at Counterpart._interpolate (/node_modules/counterpart/index.js:233:10)
    at Counterpart.translate (/node_modules/counterpart/index.js:129:18)
    at translate (/node_modules/counterpart/index.js:286:29)
    at repl:1:2
    at REPLServer.self.eval (repl.js:110:21)
    at Interface.<anonymous> (repl.js:239:12)
    at Interface.emit (events.js:95:17)
    at Interface._onLine (readline.js:202:10)

Issue when using interpolation with numbers

I have the following setup for a table footer with pagination info:

Translations:

app: {
  footer: 'Zeige Einträge %(start)s bis %(end)s von %(total)s'
}

I use the component like this:

<Translate content="app.footer"
  start={this.state.skip + 1}
  end={this.state.skip + this.state.top}
  total={this.state.total}
/>

The translation works perfectly on first load, but when I change the values for either top or skip the calculation fails, instead the numbers get concatenated like strings. See screenshot:

Am I missing something? Is there a possibility to interpolate as a number, like %(start)n instead of
%(start)s?

Missing translation:

My problem: Missing translation: en.null.invoices.payment_termen

code:

const t = require("counterpart");
...
{
  lang : t('payment_termen', {locale: lang});;
}

output:
{
"en": Missing translation: en.null.invoices.payment_termen
}

i have found that scope is set to "null" and i can't understand why

Thanks.

variables doesn't work

I read all documentation and wrote this code:

{
  followAuthor: 'Author %(author) added your subscription list',
}

Language.translate('followAuthor', { author: 'test' });

and get:

SyntaxError: [sprintf] unexpected placeholder

registerInterpolations doesn't seem to work

var translate = require('counterpart');
translate.registerTranslations('en', {'hello':'Hello from %(brand)s!'})
translate.registerInterpolations({brand:'Z'})
translate('hello')
>'Hello from %(brand)s!'

Passing in {brand:'Z'} does work.

Uncaught ReferenceError: isPlainObject is not defined

Hi,

I'm having an issue using counterpart with webpack. When doing:

import counterpart from 'counterpart';

It fails with Google chrome with the following error:

Uncaught ReferenceError: isPlainObject is not defined

When I open the web developer tools console and reload, it works. It only works with the developer tools open, but fails again when I close it. It doesn't fail in Firefox or Safari.

Do you have any ideas about what may be causing this issue?

Thanks in advance

Feature request: Multiple counts

It would be nice to be able to specify multiple counts in case a string needs to report two or more things that may or may not be singular.

Eg.

there is one apple and one pear
there are %(count1)s apples and one pear
there is one apple and %(count2)s pears
there are %(count1)s apples and %(count2)s pears

	for (var ix in fallbackLocales) {
	var fallbackLocale = fallbackLocales[ix];

martinandert / counterpart Goto Github PK

counterpart's Issues

Recommend Projects

Recommend Topics

Recommend Org