fix: rename language keys

README.md

@@ -60,16 +60,16 @@ registerLanguageLinkHelper()
 
 All language constants are optional.
 
-- `label_lang_[en/sv]`: Default label for the anchor element's text, if a custom one isn’t provided. Remember that it should be displayed in the opposite language, e.g. if the page is in English the label should be _Svenska_
-- `label_button_close`: The label for the close button in the dialog element. Only used if there’s a dialog.
-- `label_not_translated`: The label for the dialog element's text. Only used if there’s a dialog.
+- `language_link_lang_[en/sv]`: Default label for the anchor element's text, if a custom one isn’t provided. Remember that it should be displayed in the opposite language, e.g. if the page is in English the label should be _Svenska_
+- `language_link_button_close`: The label for the close button in the dialog element. Only used if there’s a dialog.
+- `language_link_not_translated`: The label for the dialog element's text. Only used if there’s a dialog.
 
 ```javascript
 // Example in i18n/messages.se.js
 
-label_lang_en: 'English',
-label_not_translated: 'Den här sidan är ej översatt',
-label_button_close: 'Stäng',
+language_link_lang_en: 'English',
+language_link_not_translated: 'Den här sidan är ej översatt',
+language_link_button_close: 'Stäng',
 ```
 
 ### Styling
@@ -126,7 +126,7 @@ The most common use case is probably that a translated page can be reached by si
 
 1. Include the style from KTH Style, `@use '~@kth/style/scss/components/translation-panel';`
 2. Include the handlebars helper in the header partials template, `{{{languageLink lang}}}`
-3. Add `label_lang_sv: 'Svenska'` and `label_lang_en: 'English'` to `messages.en.js` and `messages.sv.js` respectively
+3. Add `language_link_lang_sv: 'Svenska'` and `language_link_lang_en: 'English'` to `messages.en.js` and `messages.sv.js` respectively
 4. Verify that `lang` is passed to `render` in the controller.
 
 A link to the opposite language page will now appear in the head.

lib/handlebars/helpers/languageLink.js

@@ -13,7 +13,7 @@ function resolveTranslationLanguage(lang) {
 
 function resolveDefaultLabel(lang) {
   const translationLang = resolveTranslationLanguage(lang)
-  return i18n.message(`label_lang_${translationLang}`, lang)
+  return i18n.message(`language_link_lang_${translationLang}`, lang)
 }
 
 function anchorElement(lang, anchorMessageKey, link) {
@@ -29,9 +29,9 @@ function dialogElement(lang, link, dialogMessageKey) {
     <dialog class="kth-translation">
       <div class="kth-translation__content">
         <button class="kth-icon-button close">
-          <span class="kth-visually-hidden">${i18n.message('label_button_close', lang)}</span>
+          <span class="kth-visually-hidden">${i18n.message('language_link_button_close', lang)}</span>
         </button>
-        <span>${i18n.message('label_not_translated', lang)}</span>
+        <span>${i18n.message('language_link_not_translated', lang)}</span>
         <a href="${link}">${i18n.message(dialogMessageKey, lang)}</a>
       </div>
   </dialog>`
@@ -42,9 +42,9 @@ function dialogElement(lang, link, dialogMessageKey) {
  * Generates a language link and an optional dialog element for language selection.
  *
  * Used i18n keys:
- * - `label_lang_[sv/en]` - Default label for the anchor element's text, if a custom one isn’t provided.
- * - `label_button_close` - The label for the close button in the dialog element.
- * - `label_not_translated` - The label for the dialog element's text.
+ * - `language_link_lang_[sv/en]` - Default label for the anchor element's text, if a custom one isn’t provided.
+ * - `language_link_button_close` - The label for the close button in the dialog element.
+ * - `language_link_not_translated` - The label for the dialog element's text.
  *
  * @param {string} lang - The current language.
  * @param {string} [anchorMessageKey] - The i18n key for the anchor element's text. Can be omitted for default label.

lib/handlebars/helpers/languageLink.test.js

@@ -2,19 +2,19 @@ const handlebars = require('handlebars')
 
 const mockTranslations = {
   en: {
-    label_lang_sv: 'Svenska',
+    language_link_lang_sv: 'Svenska',
     label_custom: 'Custom',
     label_locale_select_link_title: 'Visa översättning',
-    label_button_close: 'Close',
-    label_not_translated: 'Den här sidan är inte översatt',
+    language_link_button_close: 'Close',
+    language_link_not_translated: 'Den här sidan är inte översatt',
     label_start_page: 'Startsida på svenska',
   },
   sv: {
-    label_lang_en: 'English',
+    language_link_lang_en: 'English',
     label_custom: 'Anpassad',
     label_locale_select_link_title: 'Show translation',
-    label_button_close: 'Stäng',
-    label_not_translated: 'This page is not translated',
+    language_link_button_close: 'Stäng',
+    language_link_not_translated: 'This page is not translated',
     label_start_page: 'Start page in English',
   },
 }