From 6461d77da2c68677fbc7679fb92f66d4bf8d6da4 Mon Sep 17 00:00:00 2001
From: Kenneth Bruskiewicz <kbruskie@sfu.ca>
Date: Wed, 15 Nov 2023 08:42:15 -0800
Subject: [PATCH] prettier, translations

---
 lib/editors/KeyValueEditor.js      |   2 +-
 lib/toolbar.html                   |  55 ++++++++++-----
 lib/utils/i18n.js                  |  21 +++---
 web/index.js                       | 105 ++++++++++++++++-------------
 web/translations/translations.json |  50 +++++++-------
 5 files changed, 136 insertions(+), 97 deletions(-)

diff --git a/lib/editors/KeyValueEditor.js b/lib/editors/KeyValueEditor.js
index 36347559..5ad23b00 100644
--- a/lib/editors/KeyValueEditor.js
+++ b/lib/editors/KeyValueEditor.js
@@ -41,7 +41,7 @@ export default class KeyValueListEditor extends Handsontable.editors
         if (instance) {
           const _id = instance.getDataAtRowProp(row, '_id');
           const label = instance.getDataAtRowProp(row, 'label');
-          console.log(`${_id}, ${label}`)
+          console.log(`${_id}, ${label}`);
           const translated_value =
             i18next.t(_id) !== _id ? i18next.t(_id) : label;
           return translated_value;
diff --git a/lib/toolbar.html b/lib/toolbar.html
index 6a394f4a..5b2b7421 100644
--- a/lib/toolbar.html
+++ b/lib/toolbar.html
@@ -32,9 +32,12 @@
           class="form-control-file"
           id="upload-template-input"
         />
-        <span class="dropdown-item" 
-        id="new-dropdown-item" 
-        data-i18n="new-dropdown-item">New</span>
+        <span
+          class="dropdown-item"
+          id="new-dropdown-item"
+          data-i18n="new-dropdown-item"
+          >New</span
+        >
         <label
           for="open-file-input"
           class="dropdown-item mb-0"
@@ -77,17 +80,22 @@
         Settings
       </button>
       <div class="dropdown-menu">
-        <span class="dropdown-item disabled" 
-        id="show-all-cols-dropdown-item"
-        data-i18n="show-all-cols-dropdown-item"
+        <span
+          class="dropdown-item disabled"
+          id="show-all-cols-dropdown-item"
+          data-i18n="show-all-cols-dropdown-item"
           >Show all columns</span
         >
-        <span class="dropdown-item" id="show-required-cols-dropdown-item"
-        data-i18n="show-required-cols-dropdown-item"
+        <span
+          class="dropdown-item"
+          id="show-required-cols-dropdown-item"
+          data-i18n="show-required-cols-dropdown-item"
           >Show required columns</span
         >
-        <span class="dropdown-item" id="show-recommended-cols-dropdown-item"
-        data-i18n="show-recommended-cols-dropdown-item"
+        <span
+          class="dropdown-item"
+          id="show-recommended-cols-dropdown-item"
+          data-i18n="show-recommended-cols-dropdown-item"
           >Show required + recommended columns</span
         >
         <div style="padding: 0.25rem 1.5rem">
@@ -134,7 +142,12 @@
         <span class="dropdown-item disabled" id="version-dropdown-item"></span>
       </div>
     </div>
-    <button type="button" class="btn btn-primary" id="validate-btn" data-i18n="validate-btn">
+    <button
+      type="button"
+      class="btn btn-primary"
+      id="validate-btn"
+      data-i18n="validate-btn"
+    >
       Validate
     </button>
   </div>
@@ -402,13 +415,22 @@
                     type="checkbox"
                     id="save-as-json-use-index"
                   />
-                  <label class="form-check-label" for="save-as-json-use-index" data-i18n="save-as-json-use-index">
+                  <label
+                    class="form-check-label"
+                    for="save-as-json-use-index"
+                    data-i18n="save-as-json-use-index"
+                  >
                     Save as object with index key
                   </label>
                 </div>
               </div>
               <div class="col-4">
-                <label class="sr-only" for="save-as-json-index-key" data-i18n="save-as-json-use-index-key">Name</label>
+                <label
+                  class="sr-only"
+                  for="save-as-json-index-key"
+                  data-i18n="save-as-json-use-index-key"
+                  >Name</label
+                >
                 <input
                   type="text"
                   class="form-control mt-2"
@@ -607,7 +629,9 @@
             <div class="row">
               <div class="col">
                 <div>
-                  <label for="jump-to-input" data-i18n="jump-to-input">Jump to...</label>
+                  <label for="jump-to-input" data-i18n="jump-to-input"
+                    >Jump to...</label
+                  >
                   <select id="jump-to-input" class="form-control"></select>
                 </div>
               </div>
@@ -625,8 +649,7 @@
             <div class="row">
               <div class="col-sm-6">
                 <div>
-                  <label for="fill-column-input"
-                    data-i18n="fill-column-input"
+                  <label for="fill-column-input" data-i18n="fill-column-input"
                     >Fill cells in column ...</label
                   >
                   <select id="fill-column-input" class="form-control"></select>
diff --git a/lib/utils/i18n.js b/lib/utils/i18n.js
index 0cc8bc9b..677edf05 100644
--- a/lib/utils/i18n.js
+++ b/lib/utils/i18n.js
@@ -20,15 +20,17 @@ export const languages = {
 };
 
 export const labels = transformStructFirstSpec(label_translations_file);
-const withNamespace = (namespace) => 
-  (obj) => Object.entries(obj).reduce(
+const withNamespace = (namespace) => (obj) =>
+  Object.entries(obj).reduce(
     (acc, [lang, translation]) => ({
-    ...Object.assign(acc, {
-      [lang]: {
-        [namespace]: translation
-      }
-    })
-  }), {});
+      ...Object.assign(acc, {
+        [lang]: {
+          [namespace]: translation,
+        },
+      }),
+    }),
+    {}
+  );
 
 console.log(withNamespace('translation')(labels));
 
@@ -52,7 +54,7 @@ export function initI18n(langChangeCallback = () => {}) {
       {
         debug: true,
         fallbackLng: 'en',
-        resources: withNamespace('translation')(labels),  // initial resources
+        resources: withNamespace('translation')(labels), // initial resources
         interpolation: {
           escapeValue: false,
         },
@@ -219,5 +221,4 @@ function transformStructFirstSpec(obj) {
 //   // ... other languages
 // };
 
-
 export { transformLangFirstSpec, transformStructFirstSpec };
diff --git a/web/index.js b/web/index.js
index f3a4cced..8124c35a 100644
--- a/web/index.js
+++ b/web/index.js
@@ -43,7 +43,6 @@ document.addEventListener('DOMContentLoaded', function () {
     releasesURL: 'https://github.com/cidgoh/pathogen-genomics-package/releases',
     // TODO: reduce duplication of the Template.create(); object
     getLanguages: async (schema) => {
-
       // Consolidate function for reducing objects
       function consolidate(iterable, reducer) {
         return Object.entries(iterable).reduce(reducer, {});
@@ -57,54 +56,70 @@ document.addEventListener('DOMContentLoaded', function () {
       const locales = {
         default: defaultLocale,
       };
-    
+
       template.locales.forEach((locale) => {
         const langcode = locale.split('-')[0];
-        const nativeName = tags.language(langcode).data.record.Description[0] || 'Default';
+        const nativeName =
+          tags.language(langcode).data.record.Description[0] || 'Default';
         locales[langcode] = { langcode, nativeName };
       });
-    
-      Object.entries(template.translations).forEach(([langcode, translation]) => {
-        const schema_resource = consolidate(translation.schema.slots, (acc, [slot_symbol, { name }]) => ({
-          ...acc,
-          [slot_symbol.replace(/ /g, '_')]: name,
-        }));
-    
-        const enum_resource = consolidate(translation.schema.enums, (acc, [enum_symbol, { permissible_values }]) => {
-          for (const [enum_value, { text }] of Object.entries(permissible_values)) {
-            acc[enum_value] = text;
-          }
-          return acc;
-        });
-    
-        const translated_sections = consolidate(
-          translation.schema.classes[template.default.schema.name].slot_usage,
-          (acc, [translation_slot_name, { slot_group }]) => ({
-            ...acc,
-            [translation_slot_name]: slot_group,
-          })
-        );
-    
-        const default_sections = consolidate(
-          template.default.schema.classes[template.default.schema.name].slot_usage,
-          (acc, [default_slot_name, { slot_group }]) => ({
-            ...acc,
-            [default_slot_name]: slot_group,
-          })
-        );
-    
-        const section_resource = consolidate(translated_sections, (acc, [translation_slot_name]) => ({
-          ...acc,
-          [default_sections[translation_slot_name]]: translated_sections[translation_slot_name],
-        }));
-    
-        i18n.addResources(langcode.split('-')[0], 'translation', {
-          ...section_resource,
-          ...schema_resource,
-          ...enum_resource,
-        });
-      });
-    
+
+      Object.entries(template.translations).forEach(
+        ([langcode, translation]) => {
+          const schema_resource = consolidate(
+            translation.schema.slots,
+            (acc, [slot_symbol, { name }]) => ({
+              ...acc,
+              [slot_symbol.replace(/ /g, '_')]: name,
+            })
+          );
+
+          const enum_resource = consolidate(
+            translation.schema.enums,
+            (acc, [enum_symbol, { permissible_values }]) => {
+              for (const [enum_value, { text }] of Object.entries(
+                permissible_values
+              )) {
+                acc[enum_value] = text;
+              }
+              return acc;
+            }
+          );
+
+          const translated_sections = consolidate(
+            translation.schema.classes[template.default.schema.name].slot_usage,
+            (acc, [translation_slot_name, { slot_group }]) => ({
+              ...acc,
+              [translation_slot_name]: slot_group,
+            })
+          );
+
+          const default_sections = consolidate(
+            template.default.schema.classes[template.default.schema.name]
+              .slot_usage,
+            (acc, [default_slot_name, { slot_group }]) => ({
+              ...acc,
+              [default_slot_name]: slot_group,
+            })
+          );
+
+          const section_resource = consolidate(
+            translated_sections,
+            (acc, [translation_slot_name]) => ({
+              ...acc,
+              [default_sections[translation_slot_name]]:
+                translated_sections[translation_slot_name],
+            })
+          );
+
+          i18n.addResources(langcode.split('-')[0], 'translation', {
+            ...section_resource,
+            ...schema_resource,
+            ...enum_resource,
+          });
+        }
+      );
+
       return locales;
     },
     getSchema: async (schema) => {
diff --git a/web/translations/translations.json b/web/translations/translations.json
index cf36e0b0..e4b1c450 100644
--- a/web/translations/translations.json
+++ b/web/translations/translations.json
@@ -1,27 +1,27 @@
 {
-    "open-dropdown-item": {
-        "fr": "Ouvrir"
-    },
-    "upload-template-dropdown-item": {},
-    "select-template-modal-button": {},
-    "new-dropdown-item": {},
-    "open-file-input": {},
-    "save-as-dropdown-item": {},
-    "export-to-dropdown-item": {},
-    "show-all-cols-dropdown-item": {},
-    "show-required-cols-dropdown-item": {},
-    "show-all-rows-dropdown-item": {},
-    "show-valid-rows-dropdown-item": {},
-    "show-invalid-rows-dropdown-item": {},
-    "jump-to-dropdown-item": {},
-    "fill-dropdown-item": {},
-    "validate-btn": {},
-    "save-as-modal": {},
-    "export-to-modal-btn": {},
-    "export-to-confirm-btn": {},
-    "jump-to-input": {},
-    "fill-column-input": {},
-    "help_release": {},
-    "template_name_display": {},
-    "getting-started-modal-menu": {}
+  "open-dropdown-item": {
+    "fr": "Ouvrir"
+  },
+  "upload-template-dropdown-item": {},
+  "select-template-modal-button": {},
+  "new-dropdown-item": {},
+  "open-file-input": {},
+  "save-as-dropdown-item": {},
+  "export-to-dropdown-item": {},
+  "show-all-cols-dropdown-item": {},
+  "show-required-cols-dropdown-item": {},
+  "show-all-rows-dropdown-item": {},
+  "show-valid-rows-dropdown-item": {},
+  "show-invalid-rows-dropdown-item": {},
+  "jump-to-dropdown-item": {},
+  "fill-dropdown-item": {},
+  "validate-btn": {},
+  "save-as-modal": {},
+  "export-to-modal-btn": {},
+  "export-to-confirm-btn": {},
+  "jump-to-input": {},
+  "fill-column-input": {},
+  "help_release": {},
+  "template_name_display": {},
+  "getting-started-modal-menu": {}
 }