Translation API for multiple keys

[ViktorDimitrievski]

Hi everyone,

I have a JSON file with messages that need to be translated into a TypeScript (.ts) file. Currently, I'm using the following code for translation:

.json

"common": {
    "successful": "{{item}} would be {{action}}.",
     "action": {
	   "delete": "deleted",
	    "copy": "copied",`
      }
}

.ts

translate('common.successful', {
	item: translate('common.action.delete'),
	action: translate('common.action.copy'),
})

However, I find this approach a bit lengthy and complex. I'm looking for a more readable and concise way to achieve the same translation but with less code. Can anyone suggest a better approach or provide some tips on improving the existing code?

Thanks in advance for your help!
.
.
.
.
.
.

P.S better approach can be if if if possible

translate('common.successful', {
				item: 'common.action.delete',
				action: 'common.action.copy',
			})

P.S real real case was following

this.toastrService.success(
			this.translocoService.translate('common.successful', {
				item: this.translocoService.translate('common.action.delete'),
				action: this.translocoService.translate('common.action.copy'),
			})
		);

[ViktorDimitrievski]

@shaharkazaz Do you maybe know something more regarding this topic?

[ViktorDimitrievski]

Thanks for the answer first of all.
Using 4 curly brackets in front {{{{ and 4 at the end }}}} can be good syntax as well, its also clean and clear what you can do with 2 and with 4 curly brackets. I like the approach.

[shaharkazaz]

It's not a special syntax for referencing, the transpilation order is as follows:
Starting point:

Params
item: 'some item'
action: 'common.action.copy'

{{item}} would be {{{{action}}}}

1. Match {{item}} and replace with param value:

Params
action: 'common.action.copy'

some item would be {{{{action}}}}

2. Match {{action}} and replace with param value:

some item would be {{common.action.copy}}

3. Match {{common.action.copy}}, no param found, found matching key, replace with key value:

some item would be copied

The nesting could go on.

You can even shorten the passed key, the following will work as well:

{{item}} would be {{common.action.{{action}}}}

But I think providing the full key is better.

The idea is to change the matching algo to start from the beginning after each swap instead of scanning it once (via replace)

[ViktorDimitrievski]

I'm willing to help to solve this, but how can I help? I'm getting where to be changed but not sure.
We can jump on a Zoom call to get in touch to solve this.

I like idea with full key. result would be
translate('common.successful', { item: 'Team 432', action: 'common.action.copy' });

[shaharkazaz]

@ViktorDimitrievski I appreciate your willingness to assist! 😀
I've already made the change and I'll release a new major today as this is a breaking change (a good one, but still 😉)
I would love to see you contribute to other issues we have here.
Thanks!

[ViktorDimitrievski]

@shaharkazaz That's great. When we can expect new version available on npm?

[ViktorDimitrievski]

@shaharkazaz Do you maybe know when can we expect a new version with braking changes?

[shaharkazaz]

@ViktorDimitrievski I was in reserve duty and therefore not available.
Transloco is going through some changes, beyond moving to a new organization, I'm thinking about the future of this library which I almost entirely maintain with no actual support from the community not to say sponsorships.

That said, I'll finish the change and release the version whenever I have free time.
Sorry if that's not the answer you were hoping to hear.

Out of curiosity, are you working on a personal project or using Transloco as part of your job?

[ViktorDimitrievski]

I appreciate your response, and yes figure out that limited information available on Transloco's future plans. I had hoped to delve deeper into the potential changes but encountered challenges in finding relevant details independently. I am open to receiving guidelines that could aid me in contributing to its improvement.

Concerning the community size, I acknowledge the potential for growth through strategic publications in prominent JavaScript development newsletters and platforms such as Medium and Dev.to. Building a strong community is essential, and I believe increased visibility can attract more contributors and users.

Sponsorships indeed pose a significant challenge, but as the community expands, attracting sponsorships may become more feasible.

Thank you, and stay safe!

[shaharkazaz]

@ViktorDimitrievski Thanks for addressing this.
Not sure if the root cause here is publication, this repo has almost 2k stars and a solid 120k weekly npm downloads.

Out of curiosity, are you working on a personal project or using Transloco as part of your job?

[ViktorDimitrievski]

Sorry I have miss the last question, yeah I'm using it as part of my daily job.