NatLibFi / Skosmos

Thesaurus and controlled vocabulary browser using SKOS and SPARQL
Other
229 stars 95 forks source link

Translate messages shown by Vue components #1523

Open osma opened 1 year ago

osma commented 1 year ago

For Skosmos 3, we have already implemented UI translations for PHP backend code (PR #1466) and Twig templates (PR #1520). But text in Vue components is not yet translated to the UI language, as can be seen for example in the vocab-counts and term-counts components on the vocabulary home page (the texts "Resource counts by type", "Term counts by language" etc. are currently hardcoded and always shown in English):

image

To fix this, we need to add internationalization support to the Vue components, most likely using Vue i18n.

We also need to provide the Vue components with the correct messages for each language. For Skosmos 2, this was done using global JS variables, like this:

<!-- translations needed in javascript -->
var noResultsTranslation = "Ei tuloksia";
var loading_text = "Ladataan sisältöä";
var loading_failed_text = "Virhe: Lisätulosten haku epäonnistui!";
var loading_retry_text = "Yritä uudelleen";
var jstree_loading = "Ladataan ...";
var results_disp = "Näytetään kaikki %d tulosta";
var all_vocabs  = "kaikista sanastoista";
var n_selected = "sanastosta";
var missing_value = "Kenttä on pakollinen";
var expand_paths = "näytä kaikki # polkua";
var expand_propvals = "näytä kaikki # arvoa";
var hiertrans = "Hierarkia";
var depr_trans = "Käytöstä poistettu käsite";
var sr_only_translations = {
  hierarchy_listing: "Hierarkian mukainen lista käsitteistä",
  groups_listing: "Hierarkian mukainen lista käsitteistä ja ryhmistä",
};

A similar but hopefully less ugly mechanism for passing the messages from the backend to the frontend is needed. One option would be to add the necessary messages to the SKOSMOS global object (see #1438 where it was implemented).

osma commented 1 year ago

If we switched to a JSON based message format, it would simplify the implementation of Vue translations as there would be no need to pass specific messages from the backend to the frontend. I opened issue #1525 proposing this.

osma commented 1 month ago

Issue #1656 is a near-duplicate of this. But we can consider this issue to be the broader task of translations in all Vue components, while #1656 is about providing the framework for doing this.