Creates i18n infrastructure

[gbdubs]

• Adds vue-i18n and nuxt-i18n, configured such that:
  • we'll have the locale in the url (/fr/admin) etc. This is easy to change if RMI wants to later.
  • we store the user's preference in a cookie, and that cookie works (at least locally) to deliver an SSR'ed i18n page.
  • we guess the user's location based on accept-lang and a few other heuristics, but honor a user's choice once made.
  • we offer english pages without prefix (/admin and /en/admin go to the same place)
  • the language files are lazy-loaded, so only current language gets pulled in by using VueI18nVitePlugin - you can see in the network tab when we switch langauges we fetch the lang/*.json?import file.
  • configures the fallback to be English, with the expectation that we won't actually write any of the other-language strings until the pre-launch stage of the project.
• Creates a pattern that I hope we use everywhere for i18n.
  • uses objectNotation: true to allow Prefix.Suffix to be a nested property in JSON.
  • Groups language strings by file prefix - seems like an appropriate thing for now.
  • uses prefix with t in the template to create a helper tt to avoid having to write prefixes.
  • Generally uses the full string as the translation key, but uses a placeholder for longer strings.
  • Implements this pattern on the Nav + Footer + a few other places so you can see what it looks like.
• Re-configures the footer to support a language selector. I decided on the footer over the header because as a I looked around and most functional websites put the selector in the footer, while most informational/one-time websites put it in the header.
• I went with flags in the selector mostly for visibility/legibility. Without flags it's hard to draw the eye to the selector. I don't love it for a bunch of colonial reasons, but I think given how out-of-view it is after the first selection, I think it's probably a reasonable tradeoff.
• Creates a one-time toast to alert folks to the fact that we support multiple languages.

[bcspragu]

Looks great, main general comment is that not all links have been updated [1], so you occassionally just get dumped back to the default language.

Is there a scheme (within vue/nuxt-i18n) we can use that's a little more bulletproof? It's easy to forget localePath when adding links/buttons/general nav

[1] /pages/admin/index.vue and /pages/admin/pacta-version/index.vue were the two I noticed

[bcspragu]

remove? This should get logged up the stack if it's thrown correctly

[gbdubs]

These aren't showing up in logs, and it's proving challenging to debug stack traces without them.

[bcspragu]

But we do have a base URL! In dev, it's https://pacta.dev.rmi.siliconally.dev. Seems like this should be populated from envs/ like other env-specific config

[gbdubs]

GC fixed

[gbdubs]

Looks great, main general comment is that not all links have been updated [1], so you occassionally just get dumped back to the default language.

Is there a scheme (within vue/nuxt-i18n) we can use that's a little more bulletproof? It's easy to forget localePath when adding links/buttons/general nav

[1] /pages/admin/index.vue and /pages/admin/pacta-version/index.vue were the two I noticed

Great question + suggestion. I ended up creating some middleware that tests for this, and logs in the console when we fail to meet it. We can beef that up if/when we need to. That (in tandem with making the prefix consistent) will make these navigation errors a lot easier to spot and remediate, though I wish we could do something more compiley.