Appwrite console internationalization : Typesafe-i18n

[goswamianshuman]

What does this PR do?

• adding i18n feature using typesafe-i18n library

Test Plan

• no code structure was changed

Related PRs and Issues

• PR is a part of draft: 451
• similarity goes with draft: 55

[vercel[bot]]

@goswamianshuman is attempting to deploy a commit to the appwrite Team on Vercel.

A member of the Team first needs to authorize it.

[goswamianshuman]

@TorstenDittmann, @TGlide, @ArmanNik tagging you guys here for a review of typesafe-i18n library for the internationalization on the recommendations of @torstenDittmann.🙂

[TGlide]

Hi @goswamianshuman ! Thanks for the PR. I'm confused though, why are there 2 separate PRs? Does this PR contain code from #451? Or is this PR supposed to be merged only after #451?

[goswamianshuman]

Hi @goswamianshuman ! Thanks for the PR. I'm confused though, why are there 2 separate PRs? Does this PR contain code from #451? Or is this PR supposed to be merged only after #451?

Hey @TGlide actully the following PR is performed with typesafe-i18n library Torsten told me that please create a seperate library for typesafe-i18n ,

#451 is performed by using i18next library.

the method for performing both the libraries are different that is why Torsten recommended to create a new PR.

[goswamianshuman]

Would it be possible if you only include code for typesafe-i18n in this PR so its going to be easier for review? 👍🏻

there is only typesafe-i18n code here as per your recommendation I removed everything just kept typesafe-i18n

[goswamianshuman]

hey, @TGlide have a look here, https://github.com/ivanhofer/typesafe-i18n-demo-svelte/tree/master I think this might resolve many doubts regarding this PR.

[goswamianshuman]

** Hello @TorstenDittmann @TGlide @ArmanNik, I'm sharing a template here for the JSON key structure on the recommendation of @TorstenDittmann so please have a look 🙂: **

• [service] (like login, register, recover, invite, console, auth)
  • [title] (the title of the page)
  • [forms] (the form)
    • [name of the form]
      • [inputs]
        • [inputs name] (name of the input field)
          • [label]
          • [placeholder] (other texts too if required.)
  • [button]
    • [button category] (all button keys and there texts.)
      • [button type] (like submit, signup, signin)
  • [text] (some general text)
    • [text category] (text category, category for the text like, console, auth, privacy policy etc)
      • [text value] (like for what the text is.)
  • [links] (all the texts from links).
    • [links category] (text category, category for the text like, console, auth, privacy policy etc)
      • [links value] (like for what the text is.)
  • [table] (all the table texts here)
    • [table name]
      • [rows]
        • [rows name] (all the rows name)
      • [column]
        • [column name] (all the column name)
  • [components] (like dropdown and other components)
    • [component name]
      • [component text]
  • [array]
    • [array name]
      • [array and it's texts]

[TGlide]

** Hello @TorstenDittmann @TGlide @ArmanNik, I'm sharing a template here for the JSON key structure on the recommendation of @TorstenDittmann so please have a look 🙂: **

Hey @goswamianshuman! I don't think we need to worry too much about setting a global structure for the JSON translations, as the structure could get more complex than that, e.g. We can have sub-services.

The only good thing to have in mind I'd say are commonly defined keys should be separate. e.g. 'Delete' is something we use everywhere. @TorstenDittmann wdyt?

[goswamianshuman]

** Hello @TorstenDittmann @TGlide @ArmanNik, I'm sharing a template here for the JSON key structure on the recommendation of @TorstenDittmann so please have a look 🙂: **

Hey @goswamianshuman! I don't think we need to worry too much about setting a global structure for the JSON translations, as the structure could get more complex than that, e.g. We can have sub-services.

The only good thing to have in mind I'd say are commonly defined keys should be separate. e.g. 'Delete' is something we use everywhere. @TorstenDittmann wdyt?

Actually, Torsten suggested creating a structure that could be easier for developers to understand and modify the data in the future if required.🤔😮

[TGlide]

** Hello @TorstenDittmann @TGlide @ArmanNik, I'm sharing a template here for the JSON key structure on the recommendation of @TorstenDittmann so please have a look 🙂: **

Hey @goswamianshuman! I don't think we need to worry too much about setting a global structure for the JSON translations, as the structure could get more complex than that, e.g. We can have sub-services. The only good thing to have in mind I'd say are commonly defined keys should be separate. e.g. 'Delete' is something we use everywhere. @TorstenDittmann wdyt?

Actually, Torsten suggested creating a structure that could be easier for developers to understand and modify the data in the future if required.🤔😮

Hmm, I see. Then, looking at the structure you suggested:

• I like the service part. I also think we should have another top-level key, for globals (e.g. 'Delete', 'Save', 'Create'...).
• Should we add sub-services inside service?
• I don't think we need a title key for a service, as a single service may have multiple pages.
• What would arrays and components contain? I see usage for links, buttons, forms, text and table, but I'm confused by these ones.
• Another idea: maybe we could do away with a per-route grouping. Wdyt @TorstenDittmann? Meaning, strings from console/onboarding would be:

{
 "console": {
   "onboarding": {
     "title": "Welcome to Appwrite"
   }
 }

If we proceed with this idea, we need to think if we should further categorize it, or just be free-form about it.

[TorstenDittmann]

** Hello @TorstenDittmann @TGlide @ArmanNik, I'm sharing a template here for the JSON key structure on the recommendation of @TorstenDittmann so please have a look 🙂: **

Hey @goswamianshuman! I don't think we need to worry too much about setting a global structure for the JSON translations, as the structure could get more complex than that, e.g. We can have sub-services. The only good thing to have in mind I'd say are commonly defined keys should be separate. e.g. 'Delete' is something we use everywhere. @TorstenDittmann wdyt?

Actually, Torsten suggested creating a structure that could be easier for developers to understand and modify the data in the future if required.🤔😮

Hmm, I see. Then, looking at the structure you suggested:

• I like the service part. I also think we should have another top-level key, for globals (e.g. 'Delete', 'Save', 'Create'...).
• Should we add sub-services inside service?
• I don't think we need a title key for a service, as a single service may have multiple pages.
• What would arrays and components contain? I see usage for links, buttons, forms, text and table, but I'm confused by these ones.
• Another idea: maybe we could do away with a per-route grouping. Wdyt @TorstenDittmann? Meaning, strings from console/onboarding would be:

{
 "console": {
   "onboarding": {
     "title": "Welcome to Appwrite"
   }
 }

If we proceed with this idea, we need to think if we should further categorize it, or just be free-form about it.

• We need to be careful with globals, but some of them we can do
• I dont think we should nest services, the files will get really messy, knowing that from past experiences#459
• the title key is for the title in the header
• could be a possibility, but due to the placeholders they will become too long

[goswamianshuman]

Hey, I did not remove previous data but you can look over the console where I used the new JSON key structure.

you can view the following 3 pages for modification preview.😄

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
console	🔄 Building (Inspect)			Jun 28, 2023 1:24pm
console-cloud	🔄 Building (Inspect)			Jun 28, 2023 1:24pm

[goswamianshuman]

This is looking pretty good ⭐ Small changes requested

Yup I'll make them, also I will now complete editing whole data in the project that we can complete the task as soon as possible. 😄