Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support multiple languages #91

Open
munanadi opened this issue Oct 12, 2021 · 6 comments
Open

Support multiple languages #91

munanadi opened this issue Oct 12, 2021 · 6 comments

Comments

@munanadi
Copy link

munanadi commented Oct 12, 2021

Are there plans to include multiple languages?
Would you accept a PR if I used https://react.i18next.com/ ?

Is there a nice way to do it? Lazy load translations? Anything I can start working with?

PS. Also is there a local dev workflow to make changes in walletkit and use the example dir to see these changes.
Sorry noob here.

@munanadi
Copy link
Author

munanadi commented Oct 14, 2021

This is no where close to a PR
But Here it goes. https://github.com/Aadhinana/walletkit/tree/i18n

it takes a new optional prop on WalletKitProvider itself

  • langOptions which takes the different language options that are passed
  • /public/locales/{lang}/translations.json hold the translated text.

It by default falls back to english, A selector is given as the connect button is presented.

gokimultiwallet

I really like to to contribute to this. Please help.

This currently uses a hacky approach to update for when the language changes, It uses useTranslation imported into the files that actually have no use, this is just so the state changes. Need to figure this out.

Working on how to do this properly.

@munanadi
Copy link
Author

These are the steps I followed to get this working in local env for dev.

I changed the packages/walletkit/package.json to keep watching the files.

"build" : "tsc -w"
  1. Link the package/walletkit using yarn link
  2. In package/walletkit run yarn build (This will watch the ts files for changes and will also build it)
  3. In package/example link this walletkit instead of installing it by npm link @gokiprotocol/walletkit
  4. yarn run to get the example started running!
  5. DEV

@sungoki
Copy link
Contributor

sungoki commented Oct 20, 2021

Thanks @Aadhinana. I'll see how we can include the language selection in the UI-- we should see if we can make it automatically detect the language like Uniswap does.

@munanadi
Copy link
Author

i18next-browser-languagedetector this already does that I guess?
i18n.language can be used to read it from the browser and set it accordingly. But we might need to include the corresponding files for the translations.

@sungoki
Copy link
Contributor

sungoki commented Oct 20, 2021

Great. If there are no locales specified, will the dropdown be displayed? I think we should style that.

Otherwise, I really like the change. Thank you for the code. Please make a pull request!

@munanadi
Copy link
Author

Yes if the langOptions are left empty then by default it shows only english as the sole option.
like this
wihtoutLangOptions

I thought I'll ask you about the styling. Since it should be consistent with the whole thing.
Okay sure! 👍
Thanks!

PS: I would like to contribute more! Let me know what's next!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants