ui(i18n): fixing translation keys removing the dot notation

Call-for-Code-for-Racial-Justice / Five-Fifths-Voter

Five Fifths Voter is a web application tool designed to enable and empower Black people and others to exercise their right to vote by ensuring their voice is heard

Apache License 2.0

67 stars 38 forks source link

ui(i18n): fixing translation keys removing the dot notation #298

Closed dennybiasiolli closed 2 years ago

dennybiasiolli commented 2 years ago

Contributes to #288

What did you do?

ui(i18n): fixing translation keys removing the dot notation

Why did you do it?

The translation strings are not working with the "dot" notation in their key. https://kazupon.github.io/vue-i18n/guide/formatting.html#named-formatting

Were docs updated if needed?

[ ] No
[ ] Yes
[x] N/A

Type of change

[x] Bug fix (non-breaking change which fixes an issue)
[ ] New feature (non-breaking change which adds functionality)
[ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)

Checklist:

[x] My code follows the style guidelines of this project
[x] I have performed a self-review of my own code
[ ] I have commented my code, particularly in hard-to-understand areas
[x] My changes generate no new console logs
[x] Fixes entire issue
[ ] Partial fix for issue

upkarlidder commented 2 years ago

Thanks @dennybiasiolli. Is it standard to use underscore in vue and not the dot notation? I did translations a while ago and we used the dot notation and so I stuck that that. Wondering the reason to use underscore. Thanks.

dennybiasiolli commented 2 years ago

Thanks @dennybiasiolli. Is it standard to use underscore in vue and not the dot notation? I did translations a while ago and we used the dot notation and so I stuck that that. Wondering the reason to use underscore. Thanks.

Well, you can also use the dot notation, but in that case you have to change the translation files acting like objects. Check more here: https://kazupon.github.io/vue-i18n/guide/formatting.html#named-formatting

dennybiasiolli commented 2 years ago

You can use them with the dot notation changing translation files from

  "getInformedDisplay.1": "Acceptable IDs",
  "getInformedDisplay.2": "State voter ID information",
  "getInformedDisplay.3": "More Information from your State",
  "getInformedDisplay.4": "State Voting Info",


  "getInformedDisplay": {
    "1": "Acceptable IDs",
    "2": "State voter ID information",
    "3": "More Information from your State",
    "4": "State Voting Info"
  },

davidnixon commented 2 years ago

@upkarlidder I agree with @dennybiasiolli here. The underscore is better for these particular strings. A nicer why to group the string would be as suggested:

  "getInformedDisplay": {
    "1": "Acceptable IDs",
    "2": "State voter ID information",
    "3": "More Information from your State",
    "4": "State Voting Info"
  },

But in that case I don't think 1,2,3,4 would be used. Instead maybe "acceptable", "stateId", "moreInfo", "stateInfo".

davidnixon commented 2 years ago

@upkarlidder lmk what you think. The newer Spanish translation are causing a merge conflict here but I'll resolve that with when I merge this PR.

dennybiasiolli commented 2 years ago

@davidnixon I can rebase this PR if you want 😉

upkarlidder commented 2 years ago

Sounds good. We also have new translations. We can add that after merging this here. Thank you @dennybiasiolli!