Organize the translation strings (#451)

Author: jgonggrijp

frontend/src/explorer/explorer-event-controller.ts

@@ -172,7 +172,7 @@ class ExplorerEventController {
         const flatItems = new FlatItemCollection(items);
         const filteredItems = new FilteredCollection(flatItems, 'annotation');
         const resultView = new SearchResultListPanel({
-            title:i18next.t('heading.annotations', 'Annotations'),
+            title:i18next.t('annotation.list-title', 'Annotations'),
             model: item,
             collection: filteredItems,
             selectable: false,
@@ -311,14 +311,14 @@ class ExplorerEventController {
             landing = false;
         }
         const title = `${landing ? 'My' : 'Sample'} ${queryMode}`;
-        const i18nKey = title.toLowerCase().replace(' ', '-');
+        const i18nKey = `button.${title.toLowerCase().replace(' ', '-')}`;
         const endpoint = `${queryMode}:${landing ? 'user' : 'sample'}`;
         const collection = new FlatItemCollection(ldChannel.request(endpoint));
         const browsePanel = new SearchResultListPanel({
-            // i18next.t('my-sources', 'My sources');
-            // i18next.t('sample-sources', 'Sample sources');
-            // i18next.t('my-items', 'My items');
-            // i18next.t('sample-items', 'Sample items');
+            // i18next.t('button.my-sources', 'My sources');
+            // i18next.t('button.sample-sources', 'Sample sources');
+            // i18next.t('button.my-items', 'My items');
+            // i18next.t('button.sample-items', 'Sample items');
             title: i18next.t(i18nKey, title),
             collection,
             selectable: false,

frontend/src/feedback/feedback-template.hbs

@@ -3,58 +3,61 @@
     <form class="box register-form is-narrow-modal-form">
         {{#if wasSentSuccessfully}}
         <header>
-            <h3 class="title is-3 page-header">{{#i18n 'feedback-submitted'}}Feedback submitted{{/i18n}}</h3>
+            <h3 class="title is-3 page-header">
+                {{#i18n 'feedback.success-heading'
+                }}Feedback submitted{{/i18n}}
+            </h3>
         </header>
         <div class="field">
-            <p>{{#i18n 'thanks-feedback'}}Thank you very much for your feedback, it is highly appreciated!{{/i18n}}</p>
+            <p>{{#i18n 'feedback.thanks'}}Thank you very much for your feedback, it is highly appreciated!{{/i18n}}</p>
         </div>
         <div class="field is-grouped">
             <div class="control">
-                <button class="button btn-close" type=button>{{#i18n 'close'}}Close{{/i18n}}</button>
+                <button class="button btn-close" type=button>{{#i18n 'button.close'}}Close{{/i18n}}</button>
             </div>
         </div>
         {{else}}
         <header>
-            <h3 class="title is-3 page-header">{{#i18n 'feedback'}}Feedback{{/i18n}}</h3>
+            <h3 class="title is-3 page-header">{{#i18n 'feedback.form-heading'}}Feedback{{/i18n}}</h3>
         </header>
         <div class="field">
-            <label class="label">{{#i18n 'subject'}}Subject{{/i18n}}</label>
+            <label class="label">{{#i18n 'label.subject'}}Subject{{/i18n}}</label>
             <div class="control">
                 <input
                     name="subject"
                     class="input"
                     type="text"
                     name="title"
-                    placeholder="{{#i18n 'about-readit'}}About READ-IT{{/i18n}}"
+                    placeholder="{{#i18n 'placeholder.feedback-subject'}}About READ-IT{{/i18n}}"
                 >
             </div>
         </div>
 
         <div class="field">
             <div class="control">
-                <label class="label">{{#i18n 'feedback'}}Feedback{{/i18n}}</label>
+                <label class="label">{{#i18n 'label.feedback'}}Feedback{{/i18n}}</label>
                 <textarea
                     name="feedback"
                     class="textarea"
-                    placeholder="{{#i18n 'feedback-placeholder'}}e.g. I love READ-IT!{{/i18n}}"
+                    placeholder="{{#i18n 'placeholder.feedback-content'}}e.g. I love READ-IT!{{/i18n}}"
                 ></textarea>
             </div>
         </div>
 
         {{#if hasError}}
         <div class="field form-feedback-bar has-background-danger has-text-white">
-            <p class="help">{{#i18n 'feedback-failed'}}Feedback submission failed. Please try again and if this error keeps occuring, contact the
+            <p class="help">{{#i18n 'feedback.failed'}}Feedback submission failed. Please try again and if this error keeps occuring, contact the
                 site administrator.{{/i18n}}</p>
         </div>
         {{/if}}
 
         <div class="field is-grouped">
             <div class="control">
-                <button class="button is-link btn-submit" type=submit>{{#i18n 'submit'}}Submit{{/i18n}}</button>
+                <button class="button is-link btn-submit" type=submit>{{#i18n 'button.submit'}}Submit{{/i18n}}</button>
             </div>
 
             <div class="control">
-                <button class="button btn-close" type=button>{{#i18n 'close'}}Close{{/i18n}}</button>
+                <button class="button btn-close" type=button>{{#i18n 'button.close'}}Close{{/i18n}}</button>
             </div>
         </div>
         {{/if}}
@@ -65,5 +68,5 @@
 <button
     type=button
     class="modal-close is-large"
-    aria-label="{{#i18n 'close'}}Close{{/i18n}}"
+    aria-label="{{#i18n 'button.close'}}Close{{/i18n}}"
 ></button>

frontend/src/footer/footer-template.hbs

@@ -1,5 +1,5 @@
 <figure class="footer-dh">
-    <p>{{#i18n 'developed-by'}}Developed by{{/i18n}}</p>
+    <p>{{#i18n 'footer.developed-by'}}Developed by{{/i18n}}</p>
     <a href="https://dig.hum.uu.nl" target="_blank"><img class="dhlab"
             src="{{static 'image/dighum-logo-blue.svg'}}"></a>
     <div class="footer-project is-pulled-right">

frontend/src/forms/add-button-template.hbs

@@ -1,4 +1,4 @@
 <button type=button class="button is-success">
-    <span>{{#i18n 'add'}}Add{{/i18n}}</span>
+    <span>{{#i18n 'button.add'}}Add{{/i18n}}</span>
     <span class="icon is-small"><i class="fas fa-plus"></i></span>
 </button>

frontend/src/forms/ontology-class-picker-template.hbs

@@ -1,7 +1,7 @@
 <div class="dropdown">
     <div class="dropdown-trigger">
         <button type=button class="button" aria-haspopup="true" aria-controls="dropdown-menu">
-            <span class="dropdown-label">{{#i18n 'define-category'}}This is a{{/i18n}}
+            <span class="dropdown-label">{{#i18n 'annotation.define-category'}}This is a{{/i18n}}
                 <span class="dropdown-label-tag">...</span>
             </span>
             <span class="icon is-small">

frontend/src/forms/remove-button-template.hbs

@@ -1,4 +1,4 @@
 <button type=button class="button is-danger">
-    <span>{{#i18n 'remove'}}Remove{{/i18n}}</span>
+    <span>{{#i18n 'button.remove'}}Remove{{/i18n}}</span>
     <span class="icon is-small"><i class="fas fa-times"></i></span>
 </button>

frontend/src/global/annotation-hierarchy.ts

@@ -31,27 +31,27 @@ const hierarchyPromise = i18nPromise.then(() => {
         collection: new Collection([{
             model: new Model({
                 id: 'mine',
-                label: i18next.t('filterHierarchy.mine', 'by me'),
+                label: i18next.t('annotation.filters.mine', 'by me'),
                 cssClass: 'rit-self-made',
             }),
         }, {
             model: new Model({
                 id: 'others',
-                label: i18next.t('filterHierarchy.others', 'by others'),
+                label: i18next.t('annotation.filters.others', 'by others'),
                 cssClass: 'rit-other-made',
             }),
         }]),
     }, {
         collection: new Collection([{
             model: new Model({
                 id: 'verified',
-                label: i18next.t('filterHierarchy.verified', 'verified'),
+                label: i18next.t('annotation.filters.verified', 'verified'),
                 cssClass: 'rit-verified',
             }),
         }, {
             model: new Model({
                 id: 'unverified',
-                label: i18next.t('filterHierarchy.unverified', 'unverified'),
+                label: i18next.t('annotation.filters.unverified', 'unverified'),
                 cssClass: 'rit-unverified',
             }),
         }]),
@@ -60,14 +60,14 @@ const hierarchyPromise = i18nPromise.then(() => {
     fullHierarchy.add([{
         model: new Model({
             id: 'semantic',
-            label: i18next.t('filterHierarchy.semantic', 'human'),
+            label: i18next.t('annotation.filters.semantic', 'human'),
             cssClass: 'rit-is-semantic',
         }),
         collection: semanticHierarchy,
     }, {
         model: new Model({
             id: 'nlp',
-            label: i18next.t('filterHierarchy.nlp', 'automated'),
+            label: i18next.t('annotation.filters.nlp', 'automated'),
             cssClass: 'rit-is-nlp',
         }),
         collection: nlpHierarchy,