(EPROC-20549) Make translation keys unique (#169)

OpusCapita · Jun 24, 2021 · 5b336d1 · 5b336d1
1 parent d085608
commit 5b336d1
Show file tree

Hide file tree

Showing 10 changed files with 47 additions and 40 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@opuscapita/react-markdown",
-  "version": "2.3.13",
+  "version": "2.3.13-EPROC-20549-SNAPSHOT",
   "description": "React markdown editor component",
   "scripts": {
     "link-mode": "cross-env NODE_ENV=link webpack --config ./config/webpack.config.js",

diff --git a/src/client/components/PlainMarkdownInput/PlainMarkdownInput.react.js b/src/client/components/PlainMarkdownInput/PlainMarkdownInput.react.js
@@ -420,7 +420,7 @@ class PlainMarkdownInput extends PureComponent {
    * @returns {*}
    */
   getHeaderButtons = ({ disabled, locale }) => (
-    <div className="btn-group" title={getMessage(locale, 'insertHeader')}>
+    <div className="btn-group" title={getMessage(locale, 'common.PlainMarkdownInput.insertHeader')}>
       <DropdownButton
         id="oc-md--toolbar__headers-dropdown"
         title={<i className="fa fa-header"/>}

diff --git a/src/client/components/PlainMarkdownInput/buttons/ActionButton.js b/src/client/components/PlainMarkdownInput/buttons/ActionButton.js
@@ -18,7 +18,7 @@ const ActionButton = ({ onClick, disabled, locale, accent, active }) => (
     disabled={disabled}
     onClick={e => onClick(accent)}
     type="button"
-    title={getMessage(locale, TITLES[accent] ? TITLES[accent] : accent)}
+    title={getMessage(locale, `common.PlainMarkdownInput.${TITLES[accent] ? TITLES[accent] : accent}`)}
   >
     <i className={`fa fa-${CLASSNAMES[accent] ? CLASSNAMES[accent] : accent}`}/>
   </button>

diff --git a/src/client/components/PlainMarkdownInput/buttons/FullScreenButton.js b/src/client/components/PlainMarkdownInput/buttons/FullScreenButton.js
@@ -7,7 +7,11 @@ import getMessage from '../../translations';
 
 const FullScreenButton = function({ onClick, fullScreen, locale }) {
   const msgKey = fullScreen ? 'Minimize' : 'Maximize';
-  const tooltip = <Tooltip id="switch-tp" className="fullscreen-tp">{getMessage(locale, msgKey)}</Tooltip>;
+  const tooltip = (
+    <Tooltip id="switch-tp" className="fullscreen-tp">
+      {getMessage(locale, `common.PlainMarkdownInput.${msgKey}`)}
+    </Tooltip>
+  );
   return (
     <OverlayTrigger placement="bottom" overlay={tooltip}>
       <button type="button" className={classnames('btn btn-default')} onClick={onClick}>

diff --git a/src/client/components/PlainMarkdownInput/buttons/LinkButton.js b/src/client/components/PlainMarkdownInput/buttons/LinkButton.js
@@ -8,7 +8,7 @@ const LinkButton = ({ onClick, disabled, locale }) => (
     disabled={disabled}
     onClick={e => onClick()}
     type="button"
-    title={getMessage(locale, 'insertLink')}
+    title={getMessage(locale, 'common.PlainMarkdownInput.insertLink')}
   >
     <i className="fa fa-link"/>
   </button>

diff --git a/src/client/components/PlainMarkdownInput/buttons/__specs__/ActionButton.spec.js b/src/client/components/PlainMarkdownInput/buttons/__specs__/ActionButton.spec.js
@@ -8,12 +8,13 @@ import getMessage from '../../../translations';
 describe('<ActionButton/>', () => {
   it('check default button', () => {
     const accent = 'bold';
+    const translationKey = 'common.PlainMarkdownInput.bold';
     const component = <ActionButton accent={accent} onClick={() => {}} />;
     const wrapper = shallow(component);
     expect(wrapper.find('.active')).to.have.length(0);
     expect(wrapper.find('.fa')).to.have.length(1);
     expect(wrapper.find(`.fa-${accent}`)).to.have.length(1);
-    expect(wrapper.find(`[title="${getMessage('en', accent)}"]`)).to.have.length(1);
+    expect(wrapper.find(`[title="${getMessage('en', translationKey)}"]`)).to.have.length(1);
     const props = component.props;
     expect(props.active).to.equal(false);
     expect(props.disabled).to.equal(false);
@@ -44,7 +45,7 @@ describe('<ActionButton/>', () => {
     expect(wrapper.find('.active')).to.have.length(0);
     expect(wrapper.find('.fa')).to.have.length(1);
     expect(wrapper.find('.fa-list-ul')).to.have.length(1);
-    expect(wrapper.find(`[title="${getMessage('en', 'bulletedList')}"]`)).to.have.length(1);
+    expect(wrapper.find(`[title="${getMessage('en', 'common.PlainMarkdownInput.bulletedList')}"]`)).to.have.length(1);
   });
 
   it('check numberedList button', () => {
@@ -53,6 +54,6 @@ describe('<ActionButton/>', () => {
     expect(wrapper.find('.active')).to.have.length(0);
     expect(wrapper.find('.fa')).to.have.length(1);
     expect(wrapper.find('.fa-list-ol')).to.have.length(1);
-    expect(wrapper.find(`[title="${getMessage('en', 'numberedList')}"]`)).to.have.length(1);
+    expect(wrapper.find(`[title="${getMessage('en', 'common.PlainMarkdownInput.numberedList')}"]`)).to.have.length(1);
   });
 });
diff --git a/src/client/components/PlainMarkdownInput/buttons/__specs__/LinkButton.spec.js b/src/client/components/PlainMarkdownInput/buttons/__specs__/LinkButton.spec.js
@@ -13,7 +13,7 @@ describe('<LinkButton/>', () => {
     expect(wrapper.find(`.btn-default`)).to.have.length(1);
     expect(wrapper.find('.fa')).to.have.length(1);
     expect(wrapper.find(`.fa-link`)).to.have.length(1);
-    expect(wrapper.find(`[title="${getMessage('en', 'insertLink')}"]`)).to.have.length(1);
+    expect(wrapper.find(`[title="${getMessage('en', 'common.PlainMarkdownInput.insertLink')}"]`)).to.have.length(1);
     const props = component.props;
     expect(props.disabled).to.equal(false);
     expect(props.locale).to.equal('en');

diff --git a/...ent/components/PlainMarkdownInput/plugins/slate-autocomplete-plugin/AutocompleteWidget.js b/...ent/components/PlainMarkdownInput/plugins/slate-autocomplete-plugin/AutocompleteWidget.js
@@ -144,15 +144,17 @@ export default class AutocompleteWidget extends PureComponent {
           className="react-markdown--autocomplete-widget"
         >
           <div className="react-markdown--autocomplete-widget__item">
-            <span>{getMessage(locale, 'searching')}</span>
+            <span>{getMessage(locale, 'common.PlainMarkdownInput.searching')}</span>
             <i className="fa fa-spinner fa-spin pull-right" style={{ marginTop: '3px' }}></i>
           </div>
         </div>
       );
     }
 
     const notFoundElement = items.length === 0 && !loading ? (
-      <div className="react-markdown--autocomplete-widget__item">{getMessage(locale, 'noMatchesFound')}</div>
+      <div className="react-markdown--autocomplete-widget__item">
+        {getMessage(locale, 'common.PlainMarkdownInput.noMatchesFound')}
+      </div>
     ) : null;
 
     const itemsElement = items.map((item, index) => {

diff --git a/src/client/components/translations.js b/src/client/components/translations.js
@@ -1,35 +1,35 @@
 const translations = {
   en: {
-    insertHeader: 'Insert header',
-    insertLink: 'Insert link',
-    numberedList: 'Numbered list',
-    bulletedList: 'Bulleted list',
-    bold: 'Bold (Ctrl + B)',
-    italic: 'Italic (Ctrl + I)',
-    strikethrough: 'Strikethrough (Ctrl + S)',
-    noMatchesFound: 'No matches found',
-    fullscreen: 'Fullscreen',
-    Product: 'Product',
-    Term: 'Term',
-    Maximize: 'Maximize',
-    Minimize: 'Minimize',
-    searching: 'Searching'
+    "common.PlainMarkdownInput.insertHeader": 'Insert header',
+    "common.PlainMarkdownInput.insertLink": 'Insert link',
+    "common.PlainMarkdownInput.numberedList": 'Numbered list',
+    "common.PlainMarkdownInput.bulletedList": 'Bulleted list',
+    "common.PlainMarkdownInput.bold": 'Bold (Ctrl + B)',
+    "common.PlainMarkdownInput.italic": 'Italic (Ctrl + I)',
+    "common.PlainMarkdownInput.strikethrough": 'Strikethrough (Ctrl + S)',
+    "common.PlainMarkdownInput.noMatchesFound": 'No matches found',
+    "common.PlainMarkdownInput.fullscreen": 'Fullscreen',
+    "common.PlainMarkdownInput.Product": 'Product',
+    "common.PlainMarkdownInput.Term": 'Term',
+    "common.PlainMarkdownInput.Maximize": 'Maximize',
+    "common.PlainMarkdownInput.Minimize": 'Minimize',
+    "common.PlainMarkdownInput.searching": 'Searching'
   },
   de: {
-    insertHeader: 'Kopfzeile einfügen',
-    insertLink: 'Link einfügen',
-    numberedList: 'Nummerierte Liste',
-    bulletedList: 'Aufzählung',
-    bold: 'Fett (Strg + B)',
-    italic: 'Kursiv (Strg + I)',
-    strikethrough: 'Durchgestrichen (Strg + S)',
-    noMatchesFound: 'Keine Treffer gefunden',
-    fullscreen: 'Vollbild',
-    Product: 'Product',
-    Term: 'Term',
-    Maximize: 'Maximieren',
-    Minimize: 'Minimieren',
-    searching: 'Suchen'
+    "common.PlainMarkdownInput.insertHeader": 'Kopfzeile einfügen',
+    "common.PlainMarkdownInput.insertLink": 'Link einfügen',
+    "common.PlainMarkdownInput.numberedList": 'Nummerierte Liste',
+    "common.PlainMarkdownInput.bulletedList": 'Aufzählung',
+    "common.PlainMarkdownInput.bold": 'Fett (Strg + B)',
+    "common.PlainMarkdownInput.italic": 'Kursiv (Strg + I)',
+    "common.PlainMarkdownInput.strikethrough": 'Durchgestrichen (Strg + S)',
+    "common.PlainMarkdownInput.noMatchesFound": 'Keine Treffer gefunden',
+    "common.PlainMarkdownInput.fullscreen": 'Vollbild',
+    "common.PlainMarkdownInput.Product": 'Product',
+    "common.PlainMarkdownInput.Term": 'Term',
+    "common.PlainMarkdownInput.Maximize": 'Maximieren',
+    "common.PlainMarkdownInput.Minimize": 'Minimieren',
+    "common.PlainMarkdownInput.searching": 'Suchen'
   }
 };
 

diff --git a/src/client/components/translations.spec.js b/src/client/components/translations.spec.js
@@ -3,7 +3,7 @@ import getMessage from './translations';
 
 describe('translations.js', () => {
   it('getMessage(locale, key)', () => {
-    const key = 'insertHeader';
+    const key = 'common.PlainMarkdownInput.insertHeader';
     const patternEn = 'Insert header';
     const patternDe = 'Kopfzeile einfügen';