[Experiment] feat: add translation-v2 & TranslationProvider-v2 #629
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Update
translation
module & provider to stop depending on sagas and start using redux-toolkit instead. I'm not an expert on react but this seems to be working + has feature parity with the sagas version (tell me if I missed something).Why?
Because I'm working on the editor standalone app and since the ui is based on the actual builder, I'm importing components from there, which depends on
decentraland-dapps
. And since a vast number of the components on builder use thetranslation
module (and it's something we also want to have on the editor), I ported the module to "react 2024".Extra info (just to leave this note somewhere)
Installing
decentraland-dapps/@dcl/ui
in a project with newer versions of react, webpack, etc has some compatibility problems that need to be addressed. We might need to check that out if we plan to eventually update everything to "state of the art" status.Minimal API changes
Since there are no sagas, we lost the "observable" thing that it provides, and that we were using for auto-providing the
fetchTranslation
method for theTranslationProvider
.So now we have a
thunk
creator method calledcreateTranslationFetcher
which receives the translations and returns a thunk. That thunk is then used on the reducer to provide state updates based on the promise resolution and also in theTranslationProvider
to fetch translations whenever thelocale
changes (same behaviour as before)Create translation reducer:
fetchTranslation
as prop forTranslationProvider
:This results in smaller code/less files, since there is not need to manually create some of the actions + we don't need a
TranslationProvider.container.ts
file anymore, and I'm probably missing something else.