kaisermann / svelte-i18n

Internationalization library for Svelte
MIT License
1.22k stars 79 forks source link

Different context translations (translation in packages) #252

Closed DeuneB07 closed 1 month ago

DeuneB07 commented 1 month ago

Is your feature request related to a problem? Please describe. I am developing a web platform using SvelteKit with Vite. For i18n, I use this package. The problem I have now is that into the main project, I have installed a package into the project which contain a Svelte component library. These components already use Svelte i18n to translate some labels.

The issue is that, when I test component by its own, labels are correctly translated, but when I install package into the project, package labels appears without translation (eg. key1.key2.value). Debugging the issue, looks like '$isLoading' prop not match with package translation status.

In addition, at least now, I don't think is possible to have a locale selector in the main context (webapp) and use it to define the locale used by the component.

Describe the solution you'd like I think that a possible fix is to sync svelte i18n props to work as a common source when one is already declared. I mean, if webapp is already declaring sveltei18n, being capable to the component to also use that.

How important is this feature to you? I think that being capable of load translations form different sources without repeat any of them or register more than required locales, is useful.

Additional context In this image, this is a component where the label which is not translated is the one inside the component.

image

In the following image, you can see some code inside the component to check why translation is not loaded. This isLoading returns false, so translations should be already available.

image

And finally, if isLoading is false (inside the prev reactive condition), I do this. But label is not translated neither. image

inzanez commented 1 month ago

I am currently working on something similar I think. I am not quite sure if I understand you correctly, but what I currently tested is the following:

DeuneB07 commented 1 month ago

I am currently working on something similar I think. I am not quite sure if I understand you correctly, but what I currently tested is the following:

  • I have a component library that uses svelte-18n
  • This component library exports an initialize method that will register a default en language so that the components do work
  • I use this component library in a main project (also just for testing so far) and call initialize to register the default languages, which works obviously.
  • I can also omit calling initialize from the component library but register my own version of en language (or any other language actually) and as long as the key of the message is correct, the components from my component library do reflect the translation that was registered in the main application,...

Thanks! This is not the solution I request, but it solves my issue. Not register any translations in Component library makes library takes its translations from platform where I use it.