Persistent language selection for users

[ovillegaszen]

Selection of language on the menu is persistent

When language is selected preference is stored in the user preference table.

When you first open the portal a cookie (local storage) is created with the language selection.

Every time a page is loaded the language preference is read from local storage.

When changing language preference on the menu:

• Change on the user preference table
• Change on the local storage
• Change library that uses it

• table "language list"
  ID / Language code
  1 / en
  2 / es
  3 / fr
  4 / pt-br
  5/ ja

• Write db migration to add a user language preference
  add column "language" foreign key referencing language list

migration done!!!

27/1/2021
Queries

• write graphql (query) resolver for user language preference
• DONE added language_name (todo: we still need to update the migration to set that).
• DONE todo: update LanguageGraphType to reflect the new language_name

24/02/21

query MyQuery {
  languages {
    languageCode
    languageName
    id
  }
}

query UserLanguageQuery {
  user(id: 6) {
    preference {
      languageId
    }
  }
}

Query - Read user preference on load

• DONE the query that loads the user data, (such as office id) we'll load the language preference as well.
• DONE if the language preference differs from what we have locally, update, otherwise do nothing
• DONE: Language select menu should be derived from languages query (not hard coded).
• DONE: Language selection is read from the user language profile when opening...
  TODO: Tidy up... do this when PR is up.

Mutations - Write user preference on a menu selection

• DONE! write graphql resolver for user language preference (changes things, in this case, writes data to db)
• DONE: write a mutation, client side (see example below)
• DONE: when a user clicks, we'll update the UI language (via library), send mutation to save preference, save preference locally too

mutation

mutation($id:ID!) {
  updateUserLanguagePreference(id: $id) {
    id
  }
}

variables

{
  "id": 1
}