Add translation support for custom background colour disabled text

src/components/modals/Settings.jsx

@@ -106,7 +106,7 @@ export default class Settings extends React.PureComponent {
           </Section>
           <LanguageSettings language={this.props.language} />
 
-          <button className='apply' onClick={() => SettingsFunctions.saveStuff()}>{this.props.language.apply}</button>
+          <button className='apply' onClick={() => SettingsFunctions.saveStuff(this.props.language.background.disabled)}>{this.props.language.apply}</button>
           <button className='reset' onClick={() => this.props.setDefaultSettings()}>{this.props.language.reset}</button>
           <button className='export' onClick={() => SettingsFunctions.exportSettings()}>{this.props.language.export}</button>
           <button className='import' onClick={() => document.getElementById('file-input').click()}>{this.props.language.import}</button>

src/components/modals/settings/sections/BackgroundSettings.jsx

@@ -3,7 +3,7 @@ import { toast } from 'react-toastify';
 import Checkbox from '../Checkbox';
 
 export default class BackgroundSettings extends React.PureComponent {
-  DefaultGradientSettings = { "angle": "180", "gradient": [{ "colour": "Disabled", "stop": 0 }], "type": "linear" };
+  DefaultGradientSettings = { "angle": "180", "gradient": [{ "colour": this.props.language.background.disabled, "stop": 0 }], "type": "linear" };
 
   constructor(...args) {
     super(...args);
@@ -118,14 +118,14 @@ export default class BackgroundSettings extends React.PureComponent {
   }
 
   currentGradientSettings = () => {
-    if (typeof this.state.gradientSettings === 'object' && this.state.gradientSettings.gradient.every(g => g.colour !== 'Disabled')) {
+    if (typeof this.state.gradientSettings === 'object' && this.state.gradientSettings.gradient.every(g => g.colour !== this.props.language.background.disabled)) {
       const clampNumber = (num, a, b) => Math.max(Math.min(num, Math.max(a, b)), Math.min(a, b));
       return JSON.stringify({
         ...this.state.gradientSettings,
         gradient: [...this.state.gradientSettings.gradient.map(g => { return { ...g, stop: clampNumber(+g.stop, 0, 100) } })].sort((a, b) => (a.stop > b.stop) ? 1 : -1)
       });
     }
-    return 'Disabled';
+    return this.props.language.background.disabled;
   }
 
   render() {
@@ -146,7 +146,7 @@ export default class BackgroundSettings extends React.PureComponent {
       colourSettings = (
         <div>
           {gradientInputs}
-          {this.state.gradientSettings.gradient[0].colour !== 'Disabled' ? (<button type="button" className="add" onClick={this.addColour}>{this.props.language.background.addcolour}</button>) : null}
+          {this.state.gradientSettings.gradient[0].colour !== this.props.language.background.disabled ? (<button type="button" className="add" onClick={this.addColour}>{this.props.language.background.addcolour}</button>) : null}
         </div>);
     }
 

src/modules/settingsFunctions.js

@@ -47,12 +47,12 @@ export default class SettingsFunctions {
         }
     }
 
-    static saveStuff() {
+    static saveStuff(hexDisabled) {
         localStorage.setItem('blur', document.getElementById('blurRange').value);  // this is better than inline onChange for performance
         localStorage.setItem('brightness', document.getElementById('brightnessRange').value);
         localStorage.setItem('greetingName', document.getElementById('greetingName').value);
         localStorage.setItem('customBackground', document.getElementById('customBackground').value);
-        if (document.getElementById('customBackgroundHex').value !== 'Disabled') {
+        if (document.getElementById('customBackgroundHex').value !== hexDisabled) {
             localStorage.setItem('customBackgroundColour', document.getElementById('customBackgroundHex').value);
         }
         if (document.getElementById('searchEngineInput').enabled === 'true') {

src/translations/en.json

@@ -48,7 +48,8 @@
             "addcolour": "Add colour",
             "favourite": "Favourite",
             "view": "View",
-            "refresh": "Refresh"
+            "refresh": "Refresh",
+            "disabled": "Disabled"
         },
         "searchbar": {
             "title": "Search Bar",
@@ -67,8 +68,7 @@
         "apply": "Apply",
         "reset": "Reset",
         "import": "Import",
-        "export": "Export",
-        "imported_settings": "Imported settings"
+        "export": "Export"
     },
     "update": {
         "title": "Update",

src/translations/fr.json

@@ -68,8 +68,7 @@
         "apply": "Appliquer",
         "reset": "Réinitialiser",
         "import": "Importer",
-        "export": "Exporter",
-        "imported_settings": "Paramètres importés"
+        "export": "Exporter"
     },
     "update": {
         "title": "Mise à jour",

src/translations/ru.json

@@ -60,8 +60,7 @@
         "apply": "Применить",
         "reset": "Сбросить",
         "import": "Импорт",
-        "export": "Экспорт",
-        "imported_settings": "Импортированные настройки"
+        "export": "Экспорт"
     },
     "update": {
         "title": "Обновление",