From 0fd50e949c833c701887c5fac0744cc5feeab116 Mon Sep 17 00:00:00 2001
From: David Ralph <me@davidjcralph.co.uk>
Date: Fri, 17 Sep 2021 14:13:31 +0100
Subject: [PATCH] refactor(translations): cleanup and fix import settings text

---
 src/components/modals/feedback/Feedback.jsx   | 21 +++---
 .../modals/main/marketplace/Item.jsx          | 13 ++--
 .../main/marketplace/sections/Added.jsx       | 21 +++---
 .../main/marketplace/sections/Create.jsx      | 47 ++++++------
 .../main/marketplace/sections/Marketplace.jsx | 27 ++++---
 .../main/marketplace/sections/Sideload.jsx    |  9 +--
 .../modals/main/settings/FileUpload.jsx       |  5 +-
 .../modals/main/settings/sections/About.jsx   | 45 ++++++------
 .../main/settings/sections/Advanced.jsx       | 33 ++++-----
 .../main/settings/sections/Appearance.jsx     | 72 +++++++++---------
 .../main/settings/sections/Changelog.jsx      |  9 +--
 .../modals/main/settings/sections/Order.jsx   | 21 +++---
 .../main/settings/sections/QuickLinks.jsx     | 17 ++---
 .../modals/main/settings/sections/Quote.jsx   | 47 ++++++------
 .../modals/main/settings/sections/Search.jsx  | 23 +++---
 .../modals/main/settings/sections/Stats.jsx   | 27 ++++---
 .../modals/main/settings/sections/Time.jsx    | 73 +++++++++----------
 .../modals/main/settings/sections/Weather.jsx | 41 +++++------
 .../sections/background/Background.jsx        | 15 ++--
 .../settings/sections/background/Colour.jsx   | 13 ++--
 src/components/modals/main/tabs/Addons.jsx    |  9 +--
 .../modals/main/tabs/Marketplace.jsx          |  9 +--
 src/components/modals/main/tabs/Settings.jsx  | 37 +++++-----
 .../modals/main/tabs/backend/Tab.jsx          | 57 +++++++--------
 src/components/modals/welcome/Welcome.jsx     | 17 ++---
 .../modals/welcome/WelcomeSections.jsx        | 69 +++++++++---------
 .../widgets/quicklinks/QuickLinks.jsx         | 17 ++---
 src/modules/helpers/settings/modals.js        |  5 +-
 28 files changed, 386 insertions(+), 413 deletions(-)

diff --git a/src/components/modals/feedback/Feedback.jsx b/src/components/modals/feedback/Feedback.jsx
index 49338492..98fb0126 100644
--- a/src/components/modals/feedback/Feedback.jsx
+++ b/src/components/modals/feedback/Feedback.jsx
@@ -4,8 +4,7 @@ import { PureComponent } from 'react';
 import './feedback.scss';
 
 export default class FeedbackModal extends PureComponent {
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   constructor() {
     super();
@@ -30,11 +29,11 @@ export default class FeedbackModal extends PureComponent {
     let question_two_error, question_four_error;
 
     if (this.state.question_two.value.length <= 0) {
-      question_two_error = this.getMessage(this.languagecode, 'modals.feedback.not_filled');
+      question_two_error = this.getMessage('modals.feedback.not_filled');
     }
 
     if (this.state.question_four.value.length <= 0) {
-      question_four_error = this.getMessage(this.languagecode, 'modals.feedback.not_filled');
+      question_four_error = this.getMessage('modals.feedback.not_filled');
     }
 
     if (question_two_error || question_four_error) {
@@ -61,7 +60,7 @@ export default class FeedbackModal extends PureComponent {
       });
 
       this.setState({
-        formsubmit: this.getMessage(this.languagecode, 'modals.feedback.success')
+        formsubmit: this.getMessage('modals.feedback.success')
       });
 
       setTimeout(() => {
@@ -73,36 +72,36 @@ export default class FeedbackModal extends PureComponent {
   render() {
     return (
       <div className='feedback'>
-        <h1>{this.getMessage(this.languagecode, 'modals.feedback.title')}</h1>
+        <h1>{this.getMessage('modals.feedback.title')}</h1>
         <span className='closeModal' onClick={this.props.modalClose}>&times;</span>
         <form>
           <input type='hidden' name='version' value={window.constants.VERSION} />
           <div className='question'>
-            <label>{this.getMessage(this.languagecode, 'modals.feedback.question_one')}</label>
+            <label>{this.getMessage('modals.feedback.question_one')}</label>
             <br/><br/>
             <label className='values'>0</label>
             <input className='range' type='range' min='0' max='10' name='questionone' value={this.state.question_one} onChange={(e) => this.setState({ question_one: e.target.value })}/>
             <label className='values'>10 ({this.state.question_one})</label>
           </div>
           <div className='question'>
-            <label>{this.getMessage(this.languagecode, 'modals.feedback.question_two')}</label>
+            <label>{this.getMessage('modals.feedback.question_two')}</label>
             <textarea name='questiontwo' onChange={(e) => this.setState({ question_two: { value: e.target.value }})}/>
             <p className='feedbackerror'>{this.state.question_two.error}</p>
           </div>
           <div className='question'>
-            <label>{this.getMessage(this.languagecode, 'modals.feedback.question_three')}</label>
+            <label>{this.getMessage('modals.feedback.question_three')}</label>
             <br/><br/>
             <label className='values'>0</label>
             <input className='range' type='range' min='0' max='10' name='questionthree' value={this.state.question_three} onChange={(e) => this.setState({ question_three: e.target.value })}/>
             <label className='values'>10 ({this.state.question_three})</label>
           </div>
           <div className='question'>
-            <label>{this.getMessage(this.languagecode, 'modals.feedback.question_four')}</label>
+            <label>{this.getMessage('modals.feedback.question_four')}</label>
             <textarea name='questionfour' value={this.state.question_four.value} onChange={(e) => this.setState({ question_four: { value: e.target.value }})}/>
             <p className='feedbackerror'>{this.state.question_four.error}</p>
           </div>
           <p>{this.state.formsubmit}</p>
-          <button onClick={(e) => this.submitForm(e)}>{this.getMessage(this.languagecode, 'modals.feedback.submit')}</button>
+          <button onClick={(e) => this.submitForm(e)}>{this.getMessage('modals.feedback.submit')}</button>
         </form>
       </div>
     );
diff --git a/src/components/modals/main/marketplace/Item.jsx b/src/components/modals/main/marketplace/Item.jsx
index b435638e..e0cd1a77 100644
--- a/src/components/modals/main/marketplace/Item.jsx
+++ b/src/components/modals/main/marketplace/Item.jsx
@@ -27,8 +27,7 @@ export default class Item extends PureComponent {
   }
 
   render() {
-    const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-    const languagecode = variables.languagecode;
+    const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
     if (!this.props.data.display_name) {
       return null;
@@ -39,8 +38,8 @@ export default class Item extends PureComponent {
       warningHTML = (
         <div className='productInformation'>
           <ul>
-            <li className='header'>{getMessage(languagecode, 'modals.main.marketplace.product.quote_warning.title')}</li>
-            <li id='updated'>{getMessage(languagecode, 'modals.main.marketplace.product.quote_warning.description')}</li>
+            <li className='header'>{getMessage('modals.main.marketplace.product.quote_warning.title')}</li>
+            <li id='updated'>{getMessage('modals.main.marketplace.product.quote_warning.description')}</li>
           </ul>
         </div>
       );
@@ -77,10 +76,10 @@ export default class Item extends PureComponent {
         <div className='side'>
           <div className='productInformation'>
             <ul>
-              <li className='header'>{getMessage(languagecode, 'modals.main.marketplace.product.version')}</li>
+              <li className='header'>{getMessage('modals.main.marketplace.product.version')}</li>
               {updateButton ? <li>{this.props.data.version} (Installed: {this.props.data.addonInstalledVersion})</li> : <li>{this.props.data.version}</li>}
               <br/>
-              <li className='header'>{getMessage(languagecode, 'modals.main.marketplace.product.author')}</li>
+              <li className='header'>{getMessage('modals.main.marketplace.product.author')}</li>
               <li>{this.props.data.author}</li>
              </ul>
           </div>
@@ -91,7 +90,7 @@ export default class Item extends PureComponent {
           <br/><br/>
         </div>
         <div className='informationContainer'>
-          <h1 className='overview'>{getMessage(languagecode, 'modals.main.marketplace.product.overview')}</h1>
+          <h1 className='overview'>{getMessage('modals.main.marketplace.product.overview')}</h1>
           <p className='description' dangerouslySetInnerHTML={{ __html: this.props.data.description }}></p>
         </div>
         <Modal closeTimeoutMS={100} onRequestClose={() => this.setState({ showLightbox: false })} isOpen={this.state.showLightbox} className='Modal lightboxmodal' overlayClassName='Overlay resetoverlay' ariaHideApp={false}>
diff --git a/src/components/modals/main/marketplace/sections/Added.jsx b/src/components/modals/main/marketplace/sections/Added.jsx
index ea2c8b9a..f40c2946 100644
--- a/src/components/modals/main/marketplace/sections/Added.jsx
+++ b/src/components/modals/main/marketplace/sections/Added.jsx
@@ -10,8 +10,7 @@ import Dropdown from '../../settings/Dropdown';
 import { uninstall, urlParser } from 'modules/helpers/marketplace';
 
 export default class Added extends PureComponent {
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   constructor() {
     super();
@@ -21,7 +20,7 @@ export default class Added extends PureComponent {
       button: ''
     };
     this.buttons = {
-      uninstall: <button className='removeFromMue' onClick={() => this.uninstall()}>{this.getMessage(this.languagecode, 'modals.main.marketplace.product.buttons.remove')}</button>,
+      uninstall: <button className='removeFromMue' onClick={() => this.uninstall()}>{this.getMessage('modals.main.marketplace.product.buttons.remove')}</button>,
     };
   }
 
@@ -55,7 +54,7 @@ export default class Added extends PureComponent {
   uninstall() {
     uninstall(this.state.item.type, this.state.item.display_name);
     
-    toast(this.getMessage(this.languagecode, 'toasts.uninstalled'));
+    toast(this.getMessage('toasts.uninstalled'));
 
     this.setState({
       button: '',
@@ -119,8 +118,8 @@ export default class Added extends PureComponent {
         <div className='emptyitems'>
           <div className='emptyMessage'>
             <LocalMall/>
-            <h1>{this.getMessage(this.languagecode, 'modals.main.addons.empty.title')}</h1>
-            <p className='description'>{this.getMessage(this.languagecode, 'modals.main.addons.empty.description')}</p>
+            <h1>{this.getMessage('modals.main.addons.empty.title')}</h1>
+            <p className='description'>{this.getMessage('modals.main.addons.empty.description')}</p>
           </div>
         </div>
       );
@@ -132,11 +131,11 @@ export default class Added extends PureComponent {
 
     return (
       <>
-        <Dropdown label={this.getMessage(this.languagecode, 'modals.main.addons.sort.title')} name='sortAddons' onChange={(value) => this.sortAddons(value)}>
-          <option value='newest'>{this.getMessage(this.languagecode, 'modals.main.addons.sort.newest')}</option>
-          <option value='oldest'>{this.getMessage(this.languagecode, 'modals.main.addons.sort.oldest')}</option>
-          <option value='a-z'>{this.getMessage(this.languagecode, 'modals.main.addons.sort.a_z')}</option>
-          <option value='z-a'>{this.getMessage(this.languagecode, 'modals.main.addons.sort.z_a')}</option>
+        <Dropdown label={this.getMessage('modals.main.addons.sort.title')} name='sortAddons' onChange={(value) => this.sortAddons(value)}>
+          <option value='newest'>{this.getMessage('modals.main.addons.sort.newest')}</option>
+          <option value='oldest'>{this.getMessage('modals.main.addons.sort.oldest')}</option>
+          <option value='a-z'>{this.getMessage('modals.main.addons.sort.a_z')}</option>
+          <option value='z-a'>{this.getMessage('modals.main.addons.sort.z_a')}</option>
         </Dropdown>
         <button className='addToMue sideload updateCheck' onClick={() => this.updateCheck()}>Check for updates</button>
         <br/>
diff --git a/src/components/modals/main/marketplace/sections/Create.jsx b/src/components/modals/main/marketplace/sections/Create.jsx
index 9a149e0d..ead3f5a6 100644
--- a/src/components/modals/main/marketplace/sections/Create.jsx
+++ b/src/components/modals/main/marketplace/sections/Create.jsx
@@ -88,12 +88,11 @@ export default class Create extends PureComponent {
   render() {
     let tabContent;
 
-    const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-    const languagecode = variables.languagecode;
+    const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
     const chooseType = (
       <>
-        <h3>{getMessage(languagecode, 'modals.main.settings.sections.time.type')}</h3>
+        <h3>{getMessage('modals.main.settings.sections.time.type')}</h3>
         <div className='themesToggleArea'>
           <div className='options'>
             {/* <div className='toggle lightTheme' onClick={() => this.changeTab(2, 'photos')}>
@@ -107,7 +106,7 @@ export default class Create extends PureComponent {
            */}
             <div className='toggle lightTheme' onClick={() => this.changeTab(2, 'settings')}>
               <Settings/>
-              <span>{getMessage(languagecode, 'modals.main.marketplace.preset_settings')}</span>
+              <span>{getMessage('modals.main.marketplace.preset_settings')}</span>
             </div>
           </div>
         </div>
@@ -137,22 +136,22 @@ export default class Create extends PureComponent {
 
     const writeDescription = ( 
       <>
-        <h3>{getMessage(languagecode, 'modals.main.marketplace.product.information')}</h3>
-        <p>{getMessage(languagecode, 'modals.main.addons.create.metadata.name')}</p>
+        <h3>{getMessage('modals.main.marketplace.product.information')}</h3>
+        <p>{getMessage('modals.main.addons.create.metadata.name')}</p>
         <input type='text' value={this.state.addonMetadata.name} onInput={(e) => setMetadata(e.target.value, 'name')}/>
-        <p>{getMessage(languagecode, 'modals.main.marketplace.product.version')}</p>
+        <p>{getMessage('modals.main.marketplace.product.version')}</p>
         <input type='text' value={this.state.addonMetadata.version} onInput={(e) => setMetadata(e.target.value, 'version')}/>
-        <p>{getMessage(languagecode, 'modals.main.marketplace.product.author')}</p>
+        <p>{getMessage('modals.main.marketplace.product.author')}</p>
         <input type='text' value={this.state.addonMetadata.author} onInput={(e) => setMetadata(e.target.value, 'author')}/>
-        <p>{getMessage(languagecode, 'modals.main.addons.create.metadata.icon_url')}</p>
+        <p>{getMessage('modals.main.addons.create.metadata.icon_url')}</p>
         <input type='text' value={this.state.addonMetadata.icon_url} onInput={(e) => setMetadata(e.target.value, 'icon_url')}/>
-        <p>{getMessage(languagecode, 'modals.main.addons.create.metadata.screenshot_url')}</p>
+        <p>{getMessage('modals.main.addons.create.metadata.screenshot_url')}</p>
         <input type='text' value={this.state.addonMetadata.screenshot_url} onInput={(e) => setMetadata(e.target.value, 'screenshot_url')}/>
-        <p>{getMessage(languagecode, 'modals.main.addons.create.metadata.description')}</p>
+        <p>{getMessage('modals.main.addons.create.metadata.description')}</p>
         <textarea className='settingsTextarea' value={this.state.addonMetadata.description} onInput={(e) => setMetadata(e.target.value, 'description')}/>
         <br/>
-        <button onClick={() => this.changeTab(1)} className='uploadbg' style={{ marginRight: '10px' }}>{getMessage(languagecode, 'modals.welcome.buttons.previous')}</button>
-        <button onClick={() => this.changeTab(this.state.addonMetadata.type)} className='uploadbg' disabled={nextDescriptionDisabled}>{getMessage(languagecode, 'modals.welcome.buttons.next')}</button>
+        <button onClick={() => this.changeTab(1)} className='uploadbg' style={{ marginRight: '10px' }}>{getMessage('modals.welcome.buttons.previous')}</button>
+        <button onClick={() => this.changeTab(this.state.addonMetadata.type)} className='uploadbg' disabled={nextDescriptionDisabled}>{getMessage('modals.welcome.buttons.next')}</button>
       </>
     );
 
@@ -160,44 +159,44 @@ export default class Create extends PureComponent {
     const nextSettingsDisabled = (this.state.addonData === '') ? true : false;
     const importSettings = (
       <>
-        <h3>{getMessage(languagecode, 'modals.mwelcome.sections.title')}</h3>
+        <h3>{getMessage('modals.mwelcome.sections.title')}</h3>
         <div className='themesToggleArea'>
           <div className='options'>
             <div className={this.state.settingsClasses.current} onClick={() => this.importSettings()}>
-              <span>{getMessage(languagecode, 'modals.main.addons.create.settings.current')}</span>
+              <span>{getMessage('modals.main.addons.create.settings.current')}</span>
             </div>
             <div className={this.state.settingsClasses.json} onClick={() => document.getElementById('file-input').click()}>
-              <span>{getMessage(languagecode, 'modals.main.addons.create.settings.json')}</span>
+              <span>{getMessage('modals.main.addons.create.settings.json')}</span>
             </div>
           </div>
         </div>
         <FileUpload id='file-input' type='settings' accept='application/json' loadFunction={(e) => this.importSettings(JSON.parse(e.target.result))} />
         <br/><br/>
-        <button onClick={() => this.changeTab(2)} className='uploadbg' style={{ marginRight: '10px' }}>{getMessage(languagecode, 'modals.welcome.buttons.previous')}</button>
-        <button onClick={() => this.changeTab(3)} className='uploadbg' disabled={nextSettingsDisabled}>{getMessage(languagecode, 'modals.welcome.buttons.next')}</button>
+        <button onClick={() => this.changeTab(2)} className='uploadbg' style={{ marginRight: '10px' }}>{getMessage('modals.welcome.buttons.previous')}</button>
+        <button onClick={() => this.changeTab(3)} className='uploadbg' disabled={nextSettingsDisabled}>{getMessage('modals.welcome.buttons.next')}</button>
       </>
     );
     
     // quotes
     const addQuotes = (
       <>
-        <h3>{getMessage(languagecode, 'modals.main.addons.create.quotes.title')}</h3>
+        <h3>{getMessage('modals.main.addons.create.quotes.title')}</h3>
       </>
     );
 
     // photos
     const addPhotos = (
       <>
-        <h3>{getMessage(languagecode, 'modals.main.addons.create.photos.title')}</h3>
+        <h3>{getMessage('modals.main.addons.create.photos.title')}</h3>
       </>
     );
 
     const downloadAddon = (
       <>
-        <h3>{getMessage(languagecode, 'modals.main.addons.create.finish.title')}</h3>
-        <button onClick={() => this.downloadAddon()} className='upload'>{getMessage(languagecode, 'modals.main.addons.create.finish.download')}</button>
+        <h3>{getMessage('modals.main.addons.create.finish.title')}</h3>
+        <button onClick={() => this.downloadAddon()} className='upload'>{getMessage('modals.main.addons.create.finish.download')}</button>
         <br/><br/>
-        <button onClick={() => this.changeTab(this.state.addonMetadata.type)} className='uploadbg' style={{ marginRight: '10px' }}>{getMessage(languagecode, 'modals.welcome.buttons.previous')}</button>
+        <button onClick={() => this.changeTab(this.state.addonMetadata.type)} className='uploadbg' style={{ marginRight: '10px' }}>{getMessage('modals.welcome.buttons.previous')}</button>
       </>
     );
 
@@ -212,7 +211,7 @@ export default class Create extends PureComponent {
 
     return (
       <>
-        <h2>{getMessage(languagecode, 'modals.main.addons.create.other_title')}</h2>
+        <h2>{getMessage('modals.main.addons.create.other_title')}</h2>
         {tabContent}
       </>
     );
diff --git a/src/components/modals/main/marketplace/sections/Marketplace.jsx b/src/components/modals/main/marketplace/sections/Marketplace.jsx
index 59e8e8ad..d57107c6 100644
--- a/src/components/modals/main/marketplace/sections/Marketplace.jsx
+++ b/src/components/modals/main/marketplace/sections/Marketplace.jsx
@@ -10,8 +10,7 @@ import Dropdown from '../../settings/Dropdown';
 import { install, urlParser, uninstall } from 'modules/helpers/marketplace';
 
 export default class Marketplace extends PureComponent {
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   constructor() {
     super();
@@ -23,8 +22,8 @@ export default class Marketplace extends PureComponent {
       item: {}
     };
     this.buttons = {
-      uninstall: <button className='removeFromMue' onClick={() => this.manage('uninstall')}>{this.getMessage(this.languagecode, 'modals.main.marketplace.product.buttons.remove')}</button>,
-      install: <button className='addToMue' onClick={() => this.manage('install')}>{this.getMessage(this.languagecode, 'modals.main.marketplace.product.buttons.addtomue')}</button>
+      uninstall: <button className='removeFromMue' onClick={() => this.manage('uninstall')}>{this.getMessage('modals.main.marketplace.product.buttons.remove')}</button>,
+      install: <button className='addToMue' onClick={() => this.manage('install')}>{this.getMessage('modals.main.marketplace.product.buttons.addtomue')}</button>
     };
     this.controller = new AbortController();
   }
@@ -37,7 +36,7 @@ export default class Marketplace extends PureComponent {
         info = await (await fetch(`${window.constants.MARKETPLACE_URL}/item/${this.props.type}/${data}`, { signal: this.controller.signal })).json();
       } catch (e) {
         if (this.controller.signal.aborted === false) {
-          return toast(this.getMessage(this.languagecode, 'toasts.error'));
+          return toast(this.getMessage('toasts.error'));
         }
       }
 
@@ -112,7 +111,7 @@ export default class Marketplace extends PureComponent {
       uninstall(this.state.item.type, this.state.item.display_name);
     }
 
-    toast(this.getMessage(this.languagecode, 'toats.' + type + 'ed'));
+    toast(this.getMessage('toats.' + type + 'ed'));
     this.setState({
       button: (type === 'install') ? this.buttons.uninstall : this.buttons.install
     });
@@ -176,13 +175,13 @@ export default class Marketplace extends PureComponent {
     if (navigator.onLine === false || localStorage.getItem('offlineMode') === 'true') {
       return errorMessage(<>
         <WifiOff/>
-        <h1>{this.getMessage(this.languagecode, 'modals.main.marketplace.offline.title')}</h1>
-        <p className='description'>{this.getMessage(this.languagecode, 'modals.main.marketplace.offline.description')}</p>
+        <h1>{this.getMessage('modals.main.marketplace.offline.title')}</h1>
+        <p className='description'>{this.getMessage('modals.main.marketplace.offline.description')}</p>
       </>);
     }
 
     if (this.state.done === false) {
-      return errorMessage(<h1>{this.getMessage(this.languagecode, 'modals.main.loading')}</h1>);
+      return errorMessage(<h1>{this.getMessage('modals.main.loading')}</h1>);
     }
 
     const featured = () => {
@@ -206,8 +205,8 @@ export default class Marketplace extends PureComponent {
           {featured()}
           {errorMessage(<>
             <LocalMall/>
-            <h1>{this.getMessage(this.languagecode, 'modals.main.addons.empty.title')}</h1>
-            <p className='description'>{this.getMessage(this.languagecode, 'modals.main.marketplace.no_items')}</p>
+            <h1>{this.getMessage('modals.main.addons.empty.title')}</h1>
+            <p className='description'>{this.getMessage('modals.main.marketplace.no_items')}</p>
           </>)}
         </>
       );
@@ -221,9 +220,9 @@ export default class Marketplace extends PureComponent {
       <>
         {featured()}
         <br/>
-        <Dropdown label={this.getMessage(this.languagecode, 'modals.main.addons.sort.title')} name='sortMarketplace' onChange={(value) => this.sortMarketplace(value)}>
-          <option value='a-z'>{this.getMessage(this.languagecode, 'modals.main.addons.sort.a_z')}</option>
-          <option value='z-a'>{this.getMessage(this.languagecode, 'modals.main.addons.sort.z_a')}</option>
+        <Dropdown label={this.getMessage('modals.main.addons.sort.title')} name='sortMarketplace' onChange={(value) => this.sortMarketplace(value)}>
+          <option value='a-z'>{this.getMessage('modals.main.addons.sort.a_z')}</option>
+          <option value='z-a'>{this.getMessage('modals.main.addons.sort.z_a')}</option>
         </Dropdown>
         <br/>
         <Items items={this.state.items} toggleFunction={(input) => this.toggle('item', input)} />
diff --git a/src/components/modals/main/marketplace/sections/Sideload.jsx b/src/components/modals/main/marketplace/sections/Sideload.jsx
index a4c55ad1..ce7769cf 100644
--- a/src/components/modals/main/marketplace/sections/Sideload.jsx
+++ b/src/components/modals/main/marketplace/sections/Sideload.jsx
@@ -11,8 +11,7 @@ import FileUpload from '../../settings/FileUpload';
 import { install } from 'modules/helpers/marketplace';
 
 export default class Sideload extends PureComponent {
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   constructor(props) {
     super(props);
@@ -46,7 +45,7 @@ export default class Sideload extends PureComponent {
     }
 
     install(input.type, input);
-    toast(this.getMessage(this.languagecode, 'toasts.installed'));
+    toast(this.getMessage('toasts.installed'));
     window.stats.postEvent('marketplace', 'Sideload');
   }
   
@@ -56,8 +55,8 @@ export default class Sideload extends PureComponent {
         <div className='emptyMessage'>
           <FileUpload id='file-input' type='settings' accept='application/json' loadFunction={(e) => this.installAddon(JSON.parse(e.target.result))} />
           <LocalMall/>
-          <h1>{this.getMessage(this.languagecode, 'modals.main.addons.sideload')}</h1>
-          <button className='addToMue sideload' onClick={() => document.getElementById('file-input').click()}>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.upload')}</button>
+          <h1>{this.getMessage('modals.main.addons.sideload')}</h1>
+          <button className='addToMue sideload' onClick={() => document.getElementById('file-input').click()}>{this.getMessage('modals.main.settings.sections.background.source.upload')}</button>
         </div>
         <Modal closeTimeoutMS={100} onRequestClose={() => this.setState({ showFailed: false })} isOpen={this.state.showFailed} className='Modal resetmodal mainModal sideloadModal' overlayClassName='Overlay resetoverlay' ariaHideApp={false}>
           <SideloadFailedModal modalClose={() => this.setState({ showFailed: false })} reason={this.state.failedReason}/>
diff --git a/src/components/modals/main/settings/FileUpload.jsx b/src/components/modals/main/settings/FileUpload.jsx
index 7056d1ae..9670d1fb 100644
--- a/src/components/modals/main/settings/FileUpload.jsx
+++ b/src/components/modals/main/settings/FileUpload.jsx
@@ -3,8 +3,7 @@ import { PureComponent } from 'react';
 import { toast } from 'react-toastify';
 
 export default class FileUpload extends PureComponent {
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   componentDidMount() {
     document.getElementById(this.props.id).onchange = (e) => {
@@ -16,7 +15,7 @@ export default class FileUpload extends PureComponent {
       } else {
         // background upload
         if (file.size > 2000000) {
-          return toast(this.getMessage(this.languagecode, 'modals.main.file_upload_error'));
+          return toast(this.getMessage('modals.main.file_upload_error'));
         }
 
         reader.readAsDataURL(file);
diff --git a/src/components/modals/main/settings/sections/About.jsx b/src/components/modals/main/settings/sections/About.jsx
index 755fc18b..5f302531 100644
--- a/src/components/modals/main/settings/sections/About.jsx
+++ b/src/components/modals/main/settings/sections/About.jsx
@@ -7,8 +7,7 @@ import Tooltip from 'components/helpers/tooltip/Tooltip';
 const other_contributors = require('modules/other_contributors.json');
 
 export default class About extends PureComponent {
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   constructor() {
     super();
@@ -16,9 +15,9 @@ export default class About extends PureComponent {
       contributors: [],
       sponsors: [],
       other_contributors: [],
-      photographers: this.getMessage(this.languagecode, 'modals.main.loading'),
-      update: this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.checking_update'),
-      loading: this.getMessage(this.languagecode, 'modals.main.loading')
+      photographers: this.getMessage('modals.main.loading'),
+      update: this.getMessage('modals.main.settings.sections.about.version.checking_update'),
+      loading: this.getMessage('modals.main.loading')
     };
     this.controller = new AbortController();
   }
@@ -37,8 +36,8 @@ export default class About extends PureComponent {
       }
 
       return this.setState({
-        update: this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.error.title'),
-        loading: this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.error.description')
+        update: this.getMessage('modals.main.settings.sections.about.version.error.title'),
+        loading: this.getMessage('modals.main.settings.sections.about.version.error.description')
       });
     }
 
@@ -48,9 +47,9 @@ export default class About extends PureComponent {
 
     const newVersion = versionData[0].tag_name;
 
-    let update = this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.no_update');
+    let update = this.getMessage('modals.main.settings.sections.about.version.no_update');
     if (Number(window.constants.VERSION.replaceAll('.', '')) < Number(newVersion.replaceAll('.', ''))) {
-      update = `${this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.update_available')}: ${newVersion}`;
+      update = `${this.getMessage('modals.main.settings.sections.about.version.update_available')}: ${newVersion}`;
     }
 
     this.setState({
@@ -67,8 +66,8 @@ export default class About extends PureComponent {
   componentDidMount() {
     if (navigator.onLine === false || localStorage.getItem('offlineMode') === 'true') {
       this.setState({
-        update: this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.checking_update'),
-        loading: this.getMessage(this.languagecode, 'modals.main.marketplace.offline.description')
+        update: this.getMessage('modals.main.settings.sections.about.version.checking_update'),
+        loading: this.getMessage('modals.main.marketplace.offline.description')
       });
       return;
     }
@@ -84,34 +83,34 @@ export default class About extends PureComponent {
   render() {
     return (
       <>
-        <h2>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.title')}</h2>
+        <h2>{this.getMessage('modals.main.settings.sections.about.title')}</h2>
         <img draggable='false' className='aboutLogo' src='./././icons/logo_horizontal.png' alt='Logo'></img>
-        <p>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.copyright')} {window.constants.COPYRIGHT_YEAR}-{new Date().getFullYear()} <a href={'https://github.com/' + window.constants.ORG_NAME + '/' + window.constants.REPO_NAME + '/graphs/contributors'} className='aboutLink' target='_blank' rel='noopener noreferrer'>{window.constants.COPYRIGHT_NAME}</a> ({window.constants.COPYRIGHT_LICENSE})</p>
-        <p>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.title')} {window.constants.VERSION} ({this.state.update})</p>
-        <a href={window.constants.PRIVACY_URL} className='aboutLink' target='_blank' rel='noopener noreferrer' style={{ fontSize: '1rem' }}>{this.getMessage(this.languagecode, 'modals.welcome.sections.privacy.links.privacy_policy')}</a>
+        <p>{this.getMessage('modals.main.settings.sections.about.copyright')} {window.constants.COPYRIGHT_YEAR}-{new Date().getFullYear()} <a href={'https://github.com/' + window.constants.ORG_NAME + '/' + window.constants.REPO_NAME + '/graphs/contributors'} className='aboutLink' target='_blank' rel='noopener noreferrer'>{window.constants.COPYRIGHT_NAME}</a> ({window.constants.COPYRIGHT_LICENSE})</p>
+        <p>{this.getMessage('modals.main.settings.sections.about.version.title')} {window.constants.VERSION} ({this.state.update})</p>
+        <a href={window.constants.PRIVACY_URL} className='aboutLink' target='_blank' rel='noopener noreferrer' style={{ fontSize: '1rem' }}>{this.getMessage('modals.welcome.sections.privacy.links.privacy_policy')}</a>
 
-        <h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.contact_us')}</h3>
+        <h3>{this.getMessage('modals.main.settings.sections.about.contact_us')}</h3>
         <a href={'mailto:' + window.constants.EMAIL} className='aboutIcon' target='_blank' rel='noopener noreferrer'><Email/></a>
         <a href={'https://twitter.com/' + window.constants.TWITTER_HANDLE} className='aboutIcon' target='_blank' rel='noopener noreferrer'><Twitter/></a>
         <a href={'https://instagram.com/' + window.constants.INSTAGRAM_HANDLE} className='aboutIcon' target='_blank' rel='noopener noreferrer'><Instagram/></a>
         <a href={'https://facebook.com/' + window.constants.FACEBOOK_HANDLE} className='aboutIcon' target='_blank' rel='noopener noreferrer'><Facebook/></a>
         <a href={'https://discord.gg/' + window.constants.DISCORD_SERVER} className='aboutIcon' target='_blank' rel='noopener noreferrer'><Chat/></a>
 
-        <h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.support_mue')}</h3>
+        <h3>{this.getMessage('modals.main.settings.sections.about.support_mue')}</h3>
         <p>
           <a href={'https://github.com/sponsors/' + window.constants.DONATE_USERNAME} className='aboutLink' target='_blank' rel='noopener noreferrer'>GitHub Sponsors</a> 
           &nbsp; • &nbsp;<a href={'https://ko-fi.com/' + window.constants.DONATE_USERNAME} className='aboutLink' target='_blank' rel='noopener noreferrer'>Ko-Fi</a> 
           &nbsp; • &nbsp;<a href={'https://patreon.com/' + window.constants.DONATE_USERNAME} className='aboutLink' target='_blank' rel='noopener noreferrer'>Patreon</a>
         </p>
 
-        <h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.resources_used.title')}</h3>
+        <h3>{this.getMessage('modals.main.settings.sections.about.resources_used.title')}</h3>
         <p>
           <a href='https://www.pexels.com' className='aboutLink' target='_blank' rel='noopener noreferrer'>Pexels</a>
-          , <a href='https://unsplash.com' className='aboutLink' target='_blank' rel='noopener noreferrer'>Unsplash</a> ({this.getMessage(this.languagecode, 'modals.main.settings.sections.about.resources_used.bg_images')})
+          , <a href='https://unsplash.com' className='aboutLink' target='_blank' rel='noopener noreferrer'>Unsplash</a> ({this.getMessage('modals.main.settings.sections.about.resources_used.bg_images')})
         </p>
-        <p><a href='https://undraw.co' className='aboutLink' target='_blank' rel='noopener noreferrer'>Undraw</a> ({this.getMessage(this.languagecode, 'modals.main.settings.sections.about.resources_used.welcome_img')})</p>
+        <p><a href='https://undraw.co' className='aboutLink' target='_blank' rel='noopener noreferrer'>Undraw</a> ({this.getMessage('modals.main.settings.sections.about.resources_used.welcome_img')})</p>
 
-        <h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.contributors')}</h3>
+        <h3>{this.getMessage('modals.main.settings.sections.about.contributors')}</h3>
         <p>{this.state.loading}</p>
         {this.state.contributors.map(({ login, id }) => (
           <Tooltip title={login} key={login}>
@@ -125,7 +124,7 @@ export default class About extends PureComponent {
           </Tooltip>
         ))}
 
-        <h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.supporters')}</h3>
+        <h3>{this.getMessage('modals.main.settings.sections.about.supporters')}</h3>
         <p>{this.state.loading}</p>
         {this.state.sponsors.map(({ handle, avatar }) => (
           <Tooltip title={handle} key={handle}>
@@ -133,7 +132,7 @@ export default class About extends PureComponent {
           </Tooltip>
         ))}
 
-        <h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.photographers')}</h3>
+        <h3>{this.getMessage('modals.main.settings.sections.about.photographers')}</h3>
         <p>{this.state.photographers}</p>
       </>
     );
diff --git a/src/components/modals/main/settings/sections/Advanced.jsx b/src/components/modals/main/settings/sections/Advanced.jsx
index b0faec71..95287078 100644
--- a/src/components/modals/main/settings/sections/Advanced.jsx
+++ b/src/components/modals/main/settings/sections/Advanced.jsx
@@ -22,34 +22,33 @@ export default class AdvancedSettings extends PureComponent {
   }
 
   render() {
-    const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-    const languagecode = variables.languagecode;
+    const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
     return (
       <>
-        <h2>{getMessage(languagecode, 'modals.main.settings.sections.advanced.title')}</h2>
-        <Checkbox name='offlineMode' text={getMessage(languagecode, 'modals.main.settings.sections.advanced.offline_mode')} element='.other' />
-        <Dropdown name='timezone' label={getMessage(languagecode, 'modals.main.settings.sections.advanced.timezone.title')} category='timezone'>
-          <option value='auto'>{getMessage(languagecode, 'modals.main.settings.sections.advanced.timezone.automatic')}</option>
+        <h2>{getMessage('modals.main.settings.sections.advanced.title')}</h2>
+        <Checkbox name='offlineMode' text={getMessage('modals.main.settings.sections.advanced.offline_mode')} element='.other' />
+        <Dropdown name='timezone' label={getMessage('modals.main.settings.sections.advanced.timezone.title')} category='timezone'>
+          <option value='auto'>{getMessage('modals.main.settings.sections.advanced.timezone.automatic')}</option>
           {time_zones.map((timezone) => (
             <option value={timezone} key={timezone}>{timezone}</option>
           ))}
         </Dropdown>
 
-        <h3>{getMessage(languagecode, 'modals.main.settings.sections.advanced.data')}</h3>
-        <button className='reset' onClick={() => this.setState({ resetModal: true })}>{getMessage(languagecode, 'modals.main.settings.buttons.reset')}</button>
-        <button className='export' onClick={() => exportSettings()}>{getMessage(languagecode, 'modals.main.settings.buttons.export')}</button>
-        <button className='import' onClick={() => document.getElementById('file-input').click()}>{getMessage(languagecode, 'modals.main.settings.buttons.import')}</button>
+        <h3>{getMessage('modals.main.settings.sections.advanced.data')}</h3>
+        <button className='reset' onClick={() => this.setState({ resetModal: true })}>{getMessage('modals.main.settings.buttons.reset')}</button>
+        <button className='export' onClick={() => exportSettings()}>{getMessage('modals.main.settings.buttons.export')}</button>
+        <button className='import' onClick={() => document.getElementById('file-input').click()}>{getMessage('modals.main.settings.buttons.import')}</button>
         <FileUpload id='file-input' accept='application/json' type='settings' loadFunction={(e) => importSettings(e)}/>
 
-        <h3>{getMessage(languagecode, 'modals.main.settings.sections.advanced.customisation')}</h3>
-        <Text title={getMessage(languagecode, 'modals.main.settings.sections.advanced.tab_name')} name='tabName' default={getMessage(languagecode, 'tabname')} category='other'/>
-        <Text title={getMessage(languagecode, 'modals.main.settings.sections.advanced.custom_js')} name='customjs' textarea={true} category='other' element='other'/>
-        <Text title={getMessage(languagecode, 'modals.main.settings.sections.advanced.custom_css')} name='customcss' textarea={true} category='other'/>
+        <h3>{getMessage('modals.main.settings.sections.advanced.customisation')}</h3>
+        <Text title={getMessage('modals.main.settings.sections.advanced.tab_name')} name='tabName' default={getMessage('tabname')} category='other'/>
+        <Text title={getMessage('modals.main.settings.sections.advanced.custom_js')} name='customjs' textarea={true} category='other' element='other'/>
+        <Text title={getMessage('modals.main.settings.sections.advanced.custom_css')} name='customcss' textarea={true} category='other'/>
 
-        <h3>{getMessage(languagecode, 'modals.main.settings.sections.experimental.title')}</h3>
-        <p style={{ maxWidth: '75%' }}>{getMessage(languagecode, 'modals.main.settings.sections.advanced.experimental_warning')}</p>
-        <Switch name='experimental' text={getMessage(languagecode, 'modals.main.settings.enabled')} element='.other'/>
+        <h3>{getMessage('modals.main.settings.sections.experimental.title')}</h3>
+        <p style={{ maxWidth: '75%' }}>{getMessage('modals.main.settings.sections.advanced.experimental_warning')}</p>
+        <Switch name='experimental' text={getMessage('modals.main.settings.enabled')} element='.other'/>
 
         <Modal closeTimeoutMS={100} onRequestClose={() => this.setState({ resetModal: false })} isOpen={this.state.resetModal} className='Modal resetmodal mainModal' overlayClassName='Overlay resetoverlay' ariaHideApp={false}>
           <ResetModal modalClose={() => this.setState({ resetModal: false })} />
diff --git a/src/components/modals/main/settings/sections/Appearance.jsx b/src/components/modals/main/settings/sections/Appearance.jsx
index 5ef78759..648974a1 100644
--- a/src/components/modals/main/settings/sections/Appearance.jsx
+++ b/src/components/modals/main/settings/sections/Appearance.jsx
@@ -1,4 +1,5 @@
 import variables from 'modules/variables';
+
 import Checkbox from '../Checkbox';
 import Dropdown from '../Dropdown';
 import Radio from '../Radio';
@@ -6,68 +7,67 @@ import Slider from '../Slider';
 import Text from '../Text';
 
 export default function AppearanceSettings() {
-  const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  const languagecode = variables.languagecode;
+  const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   const themeOptions = [
     {
-      name: getMessage(languagecode, 'modals.main.settings.sections.appearance.theme.auto'),
+      name: getMessage('modals.main.settings.sections.appearance.theme.auto'),
       value: 'auto'
     },
     {
-      name: getMessage(languagecode, 'modals.main.settings.sections.appearance.theme.light'),
+      name: getMessage('modals.main.settings.sections.appearance.theme.light'),
       value: 'light'
     }, 
     {
-      name: getMessage(languagecode, 'modals.main.settings.sections.appearance.theme.dark'),
+      name: getMessage('modals.main.settings.sections.appearance.theme.dark'),
       value: 'dark'
     }
   ];
 
   return (
     <>
-      <h2>{getMessage(languagecode, 'modals.main.settings.sections.appearance.title')}</h2>
-      <Radio name='theme' title={getMessage(languagecode, 'modals.main.settings.sections.appearance.theme.title')} options={themeOptions} category='other' />
+      <h2>{getMessage('modals.main.settings.sections.appearance.title')}</h2>
+      <Radio name='theme' title={getMessage('modals.main.settings.sections.appearance.theme.title')} options={themeOptions} category='other' />
 
-      <h3>{getMessage(languagecode, 'modals.main.settings.sections.appearance.navbar.title')}</h3>
-      <Checkbox name='notesEnabled' text={getMessage(languagecode, 'modals.main.settings.sections.appearance.navbar.notes')} category='navbar' />
-      <Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.appearance.navbar.refresh')} name='refresh' category='navbar'>
-        <option value='false'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.navbar.refresh_options.none')}</option>
-        <option value='background'>{getMessage(languagecode, 'modals.main.settings.sections.background.title')}</option>
-        <option value='quote'>{getMessage(languagecode, 'modals.main.settings.sections.quote.title')}</option>
-        <option value='quotebackground'>{getMessage(languagecode, 'modals.main.settings.sections.quote.title')} + {getMessage(languagecode, 'modals.main.settings.sections.background.title')}</option>
+      <h3>{getMessage('modals.main.settings.sections.appearance.navbar.title')}</h3>
+      <Checkbox name='notesEnabled' text={getMessage('modals.main.settings.sections.appearance.navbar.notes')} category='navbar' />
+      <Dropdown label={getMessage('modals.main.settings.sections.appearance.navbar.refresh')} name='refresh' category='navbar'>
+        <option value='false'>{getMessage('modals.main.settings.sections.appearance.navbar.refresh_options.none')}</option>
+        <option value='background'>{getMessage('modals.main.settings.sections.background.title')}</option>
+        <option value='quote'>{getMessage('modals.main.settings.sections.quote.title')}</option>
+        <option value='quotebackground'>{getMessage('modals.main.settings.sections.quote.title')} + {getMessage('modals.main.settings.sections.background.title')}</option>
         {/* before it was just a checkbox */}
-        <option value='true'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.navbar.refresh_options.page')}</option>
+        <option value='true'>{getMessage('modals.main.settings.sections.appearance.navbar.refresh_options.page')}</option>
       </Dropdown>
       <br/>
-      <Slider title={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomNavbar' min='10' max='400' default='100' display='%' category='navbar' />
+      <Slider title={getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomNavbar' min='10' max='400' default='100' display='%' category='navbar' />
 
-      <h3>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.title')}</h3>
-      <Text title={getMessage(languagecode, 'modals.main.settings.sections.appearance.font.custom')} name='font' upperCaseFirst={true} category='other' />
+      <h3>{getMessage('modals.main.settings.sections.appearance.font.title')}</h3>
+      <Text title={getMessage('modals.main.settings.sections.appearance.font.custom')} name='font' upperCaseFirst={true} category='other' />
       <br/>
-      <Checkbox name='fontGoogle' text={getMessage(languagecode, 'modals.main.settings.sections.appearance.font.google')} category='other' />
-      <Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.title')} name='fontweight' category='other'>
+      <Checkbox name='fontGoogle' text={getMessage('modals.main.settings.sections.appearance.font.google')} category='other' />
+      <Dropdown label={getMessage('modals.main.settings.sections.appearance.font.weight.title')} name='fontweight' category='other'>
         {/* names are taken from https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight */}
-        <option value='100'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.thin')}</option>
-        <option value='200'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.extra_light')}</option>
-        <option value='300'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.light')}</option>
-        <option value='400'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.normal')}</option>
-        <option value='500'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.medium')}</option>
-        <option value='600'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.semi_bold')}</option>
-        <option value='700'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.bold')}</option>
-        <option value='800'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.extra_bold')}</option>
+        <option value='100'>{getMessage('modals.main.settings.sections.appearance.font.weight.thin')}</option>
+        <option value='200'>{getMessage('modals.main.settings.sections.appearance.font.weight.extra_light')}</option>
+        <option value='300'>{getMessage('modals.main.settings.sections.appearance.font.weight.light')}</option>
+        <option value='400'>{getMessage('modals.main.settings.sections.appearance.font.weight.normal')}</option>
+        <option value='500'>{getMessage('modals.main.settings.sections.appearance.font.weight.medium')}</option>
+        <option value='600'>{getMessage('modals.main.settings.sections.appearance.font.weight.semi_bold')}</option>
+        <option value='700'>{getMessage('modals.main.settings.sections.appearance.font.weight.bold')}</option>
+        <option value='800'>{getMessage('modals.main.settings.sections.appearance.font.weight.extra_bold')}</option>
       </Dropdown>
       <br/><br/>
-      <Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.appearance.font.style.title')} name='fontstyle' category='other'>
-        <option value='normal'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.style.normal')}</option>
-        <option value='italic'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.style.italic')}</option>
-        <option value='oblique'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.style.oblique')}</option>
+      <Dropdown label={getMessage('modals.main.settings.sections.appearance.font.style.title')} name='fontstyle' category='other'>
+        <option value='normal'>{getMessage('modals.main.settings.sections.appearance.font.style.normal')}</option>
+        <option value='italic'>{getMessage('modals.main.settings.sections.appearance.font.style.italic')}</option>
+        <option value='oblique'>{getMessage('modals.main.settings.sections.appearance.font.style.oblique')}</option>
       </Dropdown>
 
-      <h3>{getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.title')}</h3>
-      <Checkbox text={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.text_shadow')} name='textBorder' category='other'/>
-      <Checkbox text={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.animations')} name='animations' category='other'/>
-      <Slider title={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.toast_duration')} name='toastDisplayTime' default='2500' step='100' min='500' max='5000' toast={true} display={' ' + getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.miliseconds')} />
+      <h3>{getMessage('modals.main.settings.sections.appearance.accessibility.title')}</h3>
+      <Checkbox text={getMessage('modals.main.settings.sections.appearance.accessibility.text_shadow')} name='textBorder' category='other'/>
+      <Checkbox text={getMessage('modals.main.settings.sections.appearance.accessibility.animations')} name='animations' category='other'/>
+      <Slider title={getMessage('modals.main.settings.sections.appearance.accessibility.toast_duration')} name='toastDisplayTime' default='2500' step='100' min='500' max='5000' toast={true} display={' ' + getMessage('modals.main.settings.sections.appearance.accessibility.miliseconds')} />
     </>
   );
 }
diff --git a/src/components/modals/main/settings/sections/Changelog.jsx b/src/components/modals/main/settings/sections/Changelog.jsx
index 30c111db..40e66011 100644
--- a/src/components/modals/main/settings/sections/Changelog.jsx
+++ b/src/components/modals/main/settings/sections/Changelog.jsx
@@ -75,8 +75,7 @@ export default class Changelog extends PureComponent {
   }
 
   render() {
-    const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-    const languagecode = variables.languagecode;
+    const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
     const errorMessage = (msg) => {
       return (
@@ -91,13 +90,13 @@ export default class Changelog extends PureComponent {
     if (navigator.onLine === false || this.offlineMode) {    
       return errorMessage(<>
         <WifiOff/>
-        <h1>{getMessage(languagecode, 'modals.main.marketplace.offline.title')}</h1>
-        <p className='description'>{getMessage(languagecode, 'modals.main.marketplace.offline.description')}</p>
+        <h1>{getMessage('modals.main.marketplace.offline.title')}</h1>
+        <p className='description'>{getMessage('modals.main.marketplace.offline.description')}</p>
       </>);
     }
   
     if (!this.state.title) {
-      return errorMessage(<h1>{getMessage(languagecode, 'modals.main.loading')}</h1>);
+      return errorMessage(<h1>{getMessage('modals.main.loading')}</h1>);
     }
 
     return (
diff --git a/src/components/modals/main/settings/sections/Order.jsx b/src/components/modals/main/settings/sections/Order.jsx
index 38849b16..04ce1e3a 100644
--- a/src/components/modals/main/settings/sections/Order.jsx
+++ b/src/components/modals/main/settings/sections/Order.jsx
@@ -6,15 +6,14 @@ import { toast } from 'react-toastify';
 
 import EventBus from 'modules/helpers/eventbus';
 
-const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-const languagecode = variables.languagecode;
+const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 const widget_name = {
-  greeting: getMessage(languagecode, 'modals.main.settings.sections.greeting.title'),
-  time: getMessage(languagecode, 'modals.main.settings.sections.time.title'),
-  quicklinks: getMessage(languagecode, 'modals.main.settings.sections.quicklinks.title'),
-  quote: getMessage(languagecode, 'modals.main.settings.sections.quote.title'),
-  date: getMessage(languagecode, 'modals.main.settings.sections.greeting.title'),
-  message: getMessage(languagecode, 'modals.main.settings.sections.message.title')
+  greeting: getMessage('modals.main.settings.sections.greeting.title'),
+  time: getMessage('modals.main.settings.sections.time.title'),
+  quicklinks: getMessage('modals.main.settings.sections.quicklinks.title'),
+  quote: getMessage('modals.main.settings.sections.quote.title'),
+  date: getMessage('modals.main.settings.sections.greeting.title'),
+  message: getMessage('modals.main.settings.sections.message.title')
 };
 
 const SortableItem = sortableElement(({ value }) => (
@@ -67,7 +66,7 @@ export default class OrderSettings extends PureComponent {
       items: JSON.parse(localStorage.getItem('order'))
     });
 
-    toast(getMessage(languagecode, 'toats.reset'));
+    toast(getMessage('toats.reset'));
   }
 
   enabled = (setting) => {
@@ -88,8 +87,8 @@ export default class OrderSettings extends PureComponent {
   render() {
     return (
       <>
-        <h2>{getMessage(languagecode, 'modals.main.settings.sections.order.title')}</h2>
-        <span className='modalLink' onClick={this.reset}>{getMessage(languagecode, 'modals.main.settings.buttons.reset')}</span>
+        <h2>{getMessage('modals.main.settings.sections.order.title')}</h2>
+        <span className='modalLink' onClick={this.reset}>{getMessage('modals.main.settings.buttons.reset')}</span>
         <SortableContainer onSortEnd={this.onSortEnd} lockAxis='y' lockToContainerEdges disableAutoscroll>
           {this.state.items.map((value, index) => {
             if (!this.enabled(value)) { 
diff --git a/src/components/modals/main/settings/sections/QuickLinks.jsx b/src/components/modals/main/settings/sections/QuickLinks.jsx
index 02cb86a8..5b49eeaa 100644
--- a/src/components/modals/main/settings/sections/QuickLinks.jsx
+++ b/src/components/modals/main/settings/sections/QuickLinks.jsx
@@ -5,18 +5,17 @@ import Checkbox from '../Checkbox';
 import Slider from '../Slider';
 
 export default function QuickLinks() {
-  const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  const languagecode = variables.languagecode;
+  const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   return (
     <>
-      <h2>{getMessage(languagecode, 'modals.main.settings.sections.quicklinks.title')}</h2>
-      <Switch name='quicklinksenabled' text={getMessage(languagecode, 'modals.main.settings.enabled')} category='quicklinks' element='.quicklinks-container'/>
-      <Checkbox name='quicklinksText' text={getMessage(languagecode, 'modals.main.settings.sections.quicklinks.text_only')} category='quicklinks'/>
-      <Checkbox name='quicklinksddgProxy' text={getMessage(languagecode, 'modals.main.settings.sections.background.ddg_image_proxy')} category='quicklinks'/>
-      <Checkbox name='quicklinksnewtab' text={getMessage(languagecode, 'modals.main.settings.sections.quicklinks.open_new')} category='quicklinks'/>
-      <Checkbox name='quicklinkstooltip' text={getMessage(languagecode, 'modals.main.settings.sections.quicklinks.tooltip')} category='quicklinks'/>
-      <Slider title={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomQuicklinks' min='10' max='400' default='100' display='%' category='quicklinks'/>
+      <h2>{getMessage('modals.main.settings.sections.quicklinks.title')}</h2>
+      <Switch name='quicklinksenabled' text={getMessage('modals.main.settings.enabled')} category='quicklinks' element='.quicklinks-container'/>
+      <Checkbox name='quicklinksText' text={getMessage('modals.main.settings.sections.quicklinks.text_only')} category='quicklinks'/>
+      <Checkbox name='quicklinksddgProxy' text={getMessage('modals.main.settings.sections.background.ddg_image_proxy')} category='quicklinks'/>
+      <Checkbox name='quicklinksnewtab' text={getMessage('modals.main.settings.sections.quicklinks.open_new')} category='quicklinks'/>
+      <Checkbox name='quicklinkstooltip' text={getMessage('modals.main.settings.sections.quicklinks.tooltip')} category='quicklinks'/>
+      <Slider title={getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomQuicklinks' min='10' max='400' default='100' display='%' category='quicklinks'/>
     </>
   );
 }
diff --git a/src/components/modals/main/settings/sections/Quote.jsx b/src/components/modals/main/settings/sections/Quote.jsx
index 33c3c6b6..d02d6b2f 100644
--- a/src/components/modals/main/settings/sections/Quote.jsx
+++ b/src/components/modals/main/settings/sections/Quote.jsx
@@ -8,8 +8,7 @@ import Slider from '../Slider';
 import Dropdown from '../Dropdown';
 
 export default class QuoteSettings extends PureComponent {
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   constructor() {
     super();
@@ -20,7 +19,7 @@ export default class QuoteSettings extends PureComponent {
 
   marketplaceType = () => {
     if (localStorage.getItem('quote_packs')) {
-      return <option value='quote_pack'>{this.getMessage(this.languagecode, 'modals.main.navbar.marketplace')}</option>;
+      return <option value='quote_pack'>{this.getMessage('modals.main.navbar.marketplace')}</option>;
     }
   }
 
@@ -29,8 +28,8 @@ export default class QuoteSettings extends PureComponent {
     if (this.state.quoteType === 'custom') {
       customSettings = (
         <>
-          <Text title={this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.custom')} name='customQuote' category='quote' />
-          <Text title={this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.custom_author')} name='customQuoteAuthor' category='quote'/>
+          <Text title={this.getMessage('modals.main.settings.sections.quote.custom')} name='customQuote' category='quote' />
+          <Text title={this.getMessage('modals.main.settings.sections.quote.custom_author')} name='customQuoteAuthor' category='quote'/>
         </>
       );
     } else {
@@ -38,14 +37,14 @@ export default class QuoteSettings extends PureComponent {
       customSettings = (
         <>
           <br/><br/>
-          <Dropdown label={this.getMessage(this.languagecode, 'modals.main.settings.sections.background.interval.title')} name='quotechange'>
-            <option value='refresh'>{this.getMessage(this.languagecode, 'tabname')}</option>
-            <option value='60000'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.interval.minute')}</option>
-            <option value='1800000'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.interval.half_hour')}</option>
-            <option value='3600000'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.interval.hour')}</option>
-            <option value='86400000'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.interval.day')}</option>
-            <option value='604800000'>{this.getMessage(this.languagecode, 'widgets.date.week')}</option>
-            <option value='2628000000'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.interval.month')}</option>
+          <Dropdown label={this.getMessage('modals.main.settings.sections.background.interval.title')} name='quotechange'>
+            <option value='refresh'>{this.getMessage('tabname')}</option>
+            <option value='60000'>{this.getMessage('modals.main.settings.sections.background.interval.minute')}</option>
+            <option value='1800000'>{this.getMessage('modals.main.settings.sections.background.interval.half_hour')}</option>
+            <option value='3600000'>{this.getMessage('modals.main.settings.sections.background.interval.hour')}</option>
+            <option value='86400000'>{this.getMessage('modals.main.settings.sections.background.interval.day')}</option>
+            <option value='604800000'>{this.getMessage('widgets.date.week')}</option>
+            <option value='2628000000'>{this.getMessage('modals.main.settings.sections.background.interval.month')}</option>
           </Dropdown>
         </>
       );
@@ -53,21 +52,21 @@ export default class QuoteSettings extends PureComponent {
 
     return (
       <>
-        <h2>{this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.title')}</h2>
-        <Switch name='quote' text={this.getMessage(this.languagecode, 'modals.main.settings.enabled')} category='quote' element='.quotediv' />
-        <Checkbox name='authorLink' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.author_link')} element='.other' />
-        <Dropdown label={this.getMessage(this.languagecode, 'modals.main.settings.sections.background.type.title')} name='quoteType' onChange={(value) => this.setState({ quoteType: value })} category='quote'>
+        <h2>{this.getMessage('modals.main.settings.sections.quote.title')}</h2>
+        <Switch name='quote' text={this.getMessage('modals.main.settings.enabled')} category='quote' element='.quotediv' />
+        <Checkbox name='authorLink' text={this.getMessage('modals.main.settings.sections.quote.author_link')} element='.other' />
+        <Dropdown label={this.getMessage('modals.main.settings.sections.background.type.title')} name='quoteType' onChange={(value) => this.setState({ quoteType: value })} category='quote'>
           {this.marketplaceType()}
-          <option value='api'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.type.api')}</option>
-          <option value='custom'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.custom')}</option>
+          <option value='api'>{this.getMessage('modals.main.settings.sections.background.type.api')}</option>
+          <option value='custom'>{this.getMessage('modals.main.settings.sections.quote.custom')}</option>
         </Dropdown>
         {customSettings}
-        <Slider title={this.getMessage(this.languagecode, 'modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomQuote' min='10' max='400' default='100' display='%' category='quote' />
+        <Slider title={this.getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomQuote' min='10' max='400' default='100' display='%' category='quote' />
   
-        <h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.buttons.title')}</h3>
-        <Checkbox name='copyButton' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.buttons.copy')} category='quote'/>
-        <Checkbox name='tweetButton' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.buttons.tweet')} category='quote'/>
-        <Checkbox name='favouriteQuoteEnabled' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.buttons.favourite')} category='quote'/>
+        <h3>{this.getMessage('modals.main.settings.sections.quote.buttons.title')}</h3>
+        <Checkbox name='copyButton' text={this.getMessage('modals.main.settings.sections.quote.buttons.copy')} category='quote'/>
+        <Checkbox name='tweetButton' text={this.getMessage('modals.main.settings.sections.quote.buttons.tweet')} category='quote'/>
+        <Checkbox name='favouriteQuoteEnabled' text={this.getMessage('modals.main.settings.sections.quote.buttons.favourite')} category='quote'/>
       </>
     );
   }
diff --git a/src/components/modals/main/settings/sections/Search.jsx b/src/components/modals/main/settings/sections/Search.jsx
index 25dbd2f7..08072afa 100644
--- a/src/components/modals/main/settings/sections/Search.jsx
+++ b/src/components/modals/main/settings/sections/Search.jsx
@@ -13,8 +13,7 @@ const searchEngines = require('components/widgets/search/search_engines.json');
 const autocompleteProviders = require('components/widgets/search/autocomplete_providers.json');
 
 export default class SearchSettings extends PureComponent {
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   constructor() {
     super();
@@ -31,7 +30,7 @@ export default class SearchSettings extends PureComponent {
       customValue: ''
     });
 
-    toast(this.getMessage(this.languagecode, 'toasts.reset'));
+    toast(this.getMessage('toasts.reset'));
   }
 
   componentDidMount() {
@@ -73,27 +72,27 @@ export default class SearchSettings extends PureComponent {
   render() {
     return (
       <>
-        <h2>{this.getMessage(this.languagecode, 'modals.main.settings.sections.search.title')}</h2>
-        <Switch name='searchBar' text={this.getMessage(this.languagecode, 'modals.main.settings.enabled')} category='widgets' />
+        <h2>{this.getMessage('modals.main.settings.sections.search.title')}</h2>
+        <Switch name='searchBar' text={this.getMessage('modals.main.settings.enabled')} category='widgets' />
         {/* not supported on firefox */}
         {(navigator.userAgent.includes('Chrome') && typeof InstallTrigger === 'undefined') ? 
-          <Checkbox name='voiceSearch' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.voice_search')} category='search'/> 
+          <Checkbox name='voiceSearch' text={this.getMessage('modals.main.settings.sections.search.voice_search')} category='search'/> 
         : null}
-        <Checkbox name='searchDropdown' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.dropdown')} category='search' element='.other'/>
-        <Dropdown label={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.search_engine')} name='searchEngine' onChange={(value) => this.setSearchEngine(value)}>
+        <Checkbox name='searchDropdown' text={this.getMessage('modals.main.settings.sections.search.dropdown')} category='search' element='.other'/>
+        <Dropdown label={this.getMessage('modals.main.settings.sections.search.search_engine')} name='searchEngine' onChange={(value) => this.setSearchEngine(value)}>
           {searchEngines.map((engine) => (
             <option key={engine.name} value={engine.settingsName}>{engine.name}</option>
           ))}
-          <option value='custom'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.search.custom').split(' ')[0]}</option>
+          <option value='custom'>{this.getMessage('modals.main.settings.sections.search.custom').split(' ')[0]}</option>
         </Dropdown>
         <ul style={{ display: this.state.customDisplay }}>
           <br/>
-          <p style={{ marginTop: '0px' }}>{this.getMessage(this.languagecode, 'modals.main.settings.sections.search.custom')} <span className='modalLink' onClick={() => this.resetSearch()}>{this.getMessage(this.languagecode, 'modals.main.settings.buttons.reset')}</span></p>
+          <p style={{ marginTop: '0px' }}>{this.getMessage('modals.main.settings.sections.search.custom')} <span className='modalLink' onClick={() => this.resetSearch()}>{this.getMessage('modals.main.settings.buttons.reset')}</span></p>
           <input type='text' value={this.state.customValue} onInput={(e) => this.setState({ customValue: e.target.value })}></input>
         </ul>
         <br/>
-        <Checkbox name='autocomplete' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.autocomplete')} category='search' />
-        <Radio title={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.autocomplete_provider')} options={autocompleteProviders} name='autocompleteProvider' category='search'/>
+        <Checkbox name='autocomplete' text={this.getMessage('modals.main.settings.sections.search.autocomplete')} category='search' />
+        <Radio title={this.getMessage('modals.main.settings.sections.search.autocomplete_provider')} options={autocompleteProviders} name='autocompleteProvider' category='search'/>
       </>
     );
   }
diff --git a/src/components/modals/main/settings/sections/Stats.jsx b/src/components/modals/main/settings/sections/Stats.jsx
index 1e078a47..7edf8358 100644
--- a/src/components/modals/main/settings/sections/Stats.jsx
+++ b/src/components/modals/main/settings/sections/Stats.jsx
@@ -32,30 +32,29 @@ export default class Stats extends PureComponent {
   }
 
   render() {
-    const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-    const languagecode = variables.languagecode;
+    const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
     if (localStorage.getItem('stats') === 'false') {
       return (
         <>
-          <h2>{getMessage(languagecode, 'modals.main.settings.reminder.title')}</h2>
-          <p>{getMessage(languagecode, 'modals.main.settings.sections.stats.warning')}</p>
-          <Switch name='stats' text={getMessage(languagecode, 'modals.main.settings.sections.stats.usage')} category='stats'/>
+          <h2>{getMessage('modals.main.settings.reminder.title')}</h2>
+          <p>{getMessage('modals.main.settings.sections.stats.warning')}</p>
+          <Switch name='stats' text={getMessage('modals.main.settings.sections.stats.usage')} category='stats'/>
         </>
       );
     }
 
     return (
       <>
-        <h2>{getMessage(languagecode, 'modals.main.settings.sections.stats.title')}</h2>
-        <p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.tabs_opened')}: {this.state.stats['tabs-opened'] || 0}</p>
-        <p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.backgrounds_favourited')}: {this.state.stats.feature ? this.state.stats.feature['background-favourite'] || 0 : 0}</p>
-        <p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.backgrounds_downloaded')}: {this.state.stats.feature ? this.state.stats.feature['background-download'] || 0 : 0}</p>
-        <p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.quotes_favourited')}: {this.state.stats.feature ? this.state.stats.feature['quoted-favourite'] || 0 : 0}</p>
-        <p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.quicklinks_added')}: {this.state.stats.feature ? this.state.stats.feature['quicklink-add'] || 0 : 0}</p>
-        <p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.settings_changed')}: {this.state.stats.setting ? Object.keys(this.state.stats.setting).length : 0}</p>
-        <p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.addons_installed')}: {this.state.stats.marketplace ? this.state.stats.marketplace['install'] : 0}</p>
-        <Switch name='stats' text={getMessage(languagecode, 'modals.main.settings.sections.stats.usage')} category='stats'/>
+        <h2>{getMessage('modals.main.settings.sections.stats.title')}</h2>
+        <p>{getMessage('modals.main.settings.sections.stats.sections.tabs_opened')}: {this.state.stats['tabs-opened'] || 0}</p>
+        <p>{getMessage('modals.main.settings.sections.stats.sections.backgrounds_favourited')}: {this.state.stats.feature ? this.state.stats.feature['background-favourite'] || 0 : 0}</p>
+        <p>{getMessage('modals.main.settings.sections.stats.sections.backgrounds_downloaded')}: {this.state.stats.feature ? this.state.stats.feature['background-download'] || 0 : 0}</p>
+        <p>{getMessage('modals.main.settings.sections.stats.sections.quotes_favourited')}: {this.state.stats.feature ? this.state.stats.feature['quoted-favourite'] || 0 : 0}</p>
+        <p>{getMessage('modals.main.settings.sections.stats.sections.quicklinks_added')}: {this.state.stats.feature ? this.state.stats.feature['quicklink-add'] || 0 : 0}</p>
+        <p>{getMessage('modals.main.settings.sections.stats.sections.settings_changed')}: {this.state.stats.setting ? Object.keys(this.state.stats.setting).length : 0}</p>
+        <p>{getMessage('modals.main.settings.sections.stats.sections.addons_installed')}: {this.state.stats.marketplace ? this.state.stats.marketplace['install'] : 0}</p>
+        <Switch name='stats' text={getMessage('modals.main.settings.sections.stats.usage')} category='stats'/>
       </>
     );
   }
diff --git a/src/components/modals/main/settings/sections/Time.jsx b/src/components/modals/main/settings/sections/Time.jsx
index 8395ff65..ed492b2e 100644
--- a/src/components/modals/main/settings/sections/Time.jsx
+++ b/src/components/modals/main/settings/sections/Time.jsx
@@ -17,40 +17,39 @@ export default class TimeSettings extends PureComponent {
   }
 
   render() {
-    const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-    const languagecode = variables.languagecode;
+    const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
     let timeSettings;
 
     const digitalOptions = [
       {
-        name: getMessage(languagecode, 'modals.main.settings.sections.time.digital.twentyfourhour'),
+        name: getMessage('modals.main.settings.sections.time.digital.twentyfourhour'),
         value: 'twentyfourhour'
       },
       {
-        name: getMessage(languagecode, 'modals.main.settings.sections.time.digital.twelvehour'),
+        name: getMessage('modals.main.settings.sections.time.digital.twelvehour'),
         value: 'twelvehour'
       }
     ];
 
     const digitalSettings = (
       <>
-        <h3>{getMessage(languagecode, 'modals.main.settings.sections.time.digital.title')}</h3>
-        <Radio title={getMessage(languagecode, 'modals.main.settings.sections.time.format')} name='timeformat' options={digitalOptions} smallTitle={true} category='clock' />
+        <h3>{getMessage('modals.main.settings.sections.time.digital.title')}</h3>
+        <Radio title={getMessage('modals.main.settings.sections.time.format')} name='timeformat' options={digitalOptions} smallTitle={true} category='clock' />
         <br/>
-        <Checkbox name='seconds' text={getMessage(languagecode, 'modals.main.settings.sections.time.digital.seconds')} category='clock' />
-        <Checkbox name='zero' text={getMessage(languagecode, 'modals.main.settings.sections.time.digital.zero')} category='clock' />
+        <Checkbox name='seconds' text={getMessage('modals.main.settings.sections.time.digital.seconds')} category='clock' />
+        <Checkbox name='zero' text={getMessage('modals.main.settings.sections.time.digital.zero')} category='clock' />
       </>
     );
 
     const analogSettings = (
       <>
-        <h3>{getMessage(languagecode, 'modals.main.settings.sections.time.analogue.title')}</h3>
-        <Checkbox name='secondHand' text={getMessage(languagecode, 'modals.main.settings.sections.time.analogue.second_hand')} category='clock' />
-        <Checkbox name='minuteHand' text={getMessage(languagecode, 'modals.main.settings.sections.time.analogue.minute_hand')} category='clock' />
-        <Checkbox name='hourHand' text={getMessage(languagecode, 'modals.main.settings.sections.time.analogue.hour_hand')} category='clock' />
-        <Checkbox name='hourMarks' text={getMessage(languagecode, 'modals.main.settings.sections.time.analogue.hour_marks')} category='clock' />
-        <Checkbox name='minuteMarks' text={getMessage(languagecode, 'modals.main.settings.sections.time.analogue.minute_marks')} category='clock' />
+        <h3>{getMessage('modals.main.settings.sections.time.analogue.title')}</h3>
+        <Checkbox name='secondHand' text={getMessage('modals.main.settings.sections.time.analogue.second_hand')} category='clock' />
+        <Checkbox name='minuteHand' text={getMessage('modals.main.settings.sections.time.analogue.minute_hand')} category='clock' />
+        <Checkbox name='hourHand' text={getMessage('modals.main.settings.sections.time.analogue.hour_hand')} category='clock' />
+        <Checkbox name='hourMarks' text={getMessage('modals.main.settings.sections.time.analogue.hour_marks')} category='clock' />
+        <Checkbox name='minuteMarks' text={getMessage('modals.main.settings.sections.time.analogue.minute_marks')} category='clock' />
       </>
     );
 
@@ -64,25 +63,25 @@ export default class TimeSettings extends PureComponent {
     
     const longSettings = (
       <>
-        <Checkbox name='dayofweek' text={getMessage(languagecode, 'modals.main.settings.sections.time.date.day_of_week')} category='date' />
-        <Checkbox name='datenth' text={getMessage(languagecode, 'modals.main.settings.sections.time.date.datenth')} category='date' />
+        <Checkbox name='dayofweek' text={getMessage('modals.main.settings.sections.time.date.day_of_week')} category='date' />
+        <Checkbox name='datenth' text={getMessage('modals.main.settings.sections.time.date.datenth')} category='date' />
       </>
     );
 
     const shortSettings = (
       <>
         <br/>
-        <Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.time.date.short_format')} name='dateFormat' category='date'>
+        <Dropdown label={getMessage('modals.main.settings.sections.time.date.short_format')} name='dateFormat' category='date'>
           <option value='DMY'>DMY</option>
           <option value='MDY'>MDY</option>
           <option value='YMD'>YMD</option>
         </Dropdown>
         <br/><br/>
-        <Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.time.date.short_separator.title')} name='shortFormat' category='date'>
-          <option value='dash'>{getMessage(languagecode, 'modals.main.settings.sections.time.date.short_separator.dash')}</option>
-          <option value='dots'>{getMessage(languagecode, 'modals.main.settings.sections.time.date.short_separator.dots')}</option>
-          <option value='gaps'>{getMessage(languagecode, 'modals.main.settings.sections.time.date.short_separator.gaps')}</option>
-          <option value='slashes'>{getMessage(languagecode, 'modals.main.settings.sections.time.date.short_separator.slashes')}</option>
+        <Dropdown label={getMessage('modals.main.settings.sections.time.date.short_separator.title')} name='shortFormat' category='date'>
+          <option value='dash'>{getMessage('modals.main.settings.sections.time.date.short_separator.dash')}</option>
+          <option value='dots'>{getMessage('modals.main.settings.sections.time.date.short_separator.dots')}</option>
+          <option value='gaps'>{getMessage('modals.main.settings.sections.time.date.short_separator.gaps')}</option>
+          <option value='slashes'>{getMessage('modals.main.settings.sections.time.date.short_separator.slashes')}</option>
        </Dropdown>
       </>
     );
@@ -95,29 +94,29 @@ export default class TimeSettings extends PureComponent {
 
     return (
       <>
-        <h2>{getMessage(languagecode, 'modals.main.settings.sections.time.title')}</h2>
-        <Switch name='time' text={getMessage(languagecode, 'modals.main.settings.enabled')} category='clock' element='.clock-container' />
-        <Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.time.type')} name='timeType' onChange={(value) => this.setState({ timeType: value })} category='clock'>
-          <option value='digital'>{getMessage(languagecode, 'modals.main.settings.sections.time.digital.title')}</option>
-          <option value='analogue'>{getMessage(languagecode, 'modals.main.settings.sections.time.analogue.title')}</option>
-          <option value='percentageComplete'>{getMessage(languagecode, 'modals.main.settings.sections.time.percentage_complete')}</option>
+        <h2>{getMessage('modals.main.settings.sections.time.title')}</h2>
+        <Switch name='time' text={getMessage('modals.main.settings.enabled')} category='clock' element='.clock-container' />
+        <Dropdown label={getMessage('modals.main.settings.sections.time.type')} name='timeType' onChange={(value) => this.setState({ timeType: value })} category='clock'>
+          <option value='digital'>{getMessage('modals.main.settings.sections.time.digital.title')}</option>
+          <option value='analogue'>{getMessage('modals.main.settings.sections.time.analogue.title')}</option>
+          <option value='percentageComplete'>{getMessage('modals.main.settings.sections.time.percentage_complete')}</option>
         </Dropdown>
         {timeSettings}
         {this.state.timeType !== 'analogue' ? 
-          <Slider title={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomClock' min='10' max='400' default='100' display='%' category='clock'/>
+          <Slider title={getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomClock' min='10' max='400' default='100' display='%' category='clock'/>
         : null}
 
-        <h3>{getMessage(languagecode, 'modals.main.settings.sections.time.date.title')}</h3>
-        <Switch name='date' text={getMessage(languagecode, 'modals.main.settings.enabled')} category='date' element='.date'/>
-        <Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.time.type')} name='dateType' onChange={(value) => this.setState({ dateType: value })} category='date'>
-          <option value='long'>{getMessage(languagecode, 'modals.main.settings.sections.time.date.type.long')}</option>
-          <option value='short'>{getMessage(languagecode, 'modals.main.settings.sections.time.date.type.short')}</option>
+        <h3>{getMessage('modals.main.settings.sections.time.date.title')}</h3>
+        <Switch name='date' text={getMessage('modals.main.settings.enabled')} category='date' element='.date'/>
+        <Dropdown label={getMessage('modals.main.settings.sections.time.type')} name='dateType' onChange={(value) => this.setState({ dateType: value })} category='date'>
+          <option value='long'>{getMessage('modals.main.settings.sections.time.date.type.long')}</option>
+          <option value='short'>{getMessage('modals.main.settings.sections.time.date.type.short')}</option>
         </Dropdown>
         <br/>
-        <Checkbox name='datezero' text={getMessage(languagecode, 'modals.main.settings.sections.time.digital.zero')} category='date'/>
-        <Checkbox name='weeknumber' text={getMessage(languagecode, 'modals.main.settings.sections.time.date.week_number')} category='date'/>
+        <Checkbox name='datezero' text={getMessage('modals.main.settings.sections.time.digital.zero')} category='date'/>
+        <Checkbox name='weeknumber' text={getMessage('modals.main.settings.sections.time.date.week_number')} category='date'/>
         {dateSettings}
-        <Slider title={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomDate' min='10' max='400' default='100' display='%' category='date'/>
+        <Slider title={getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomDate' min='10' max='400' default='100' display='%' category='date'/>
       </>
     );
   }
diff --git a/src/components/modals/main/settings/sections/Weather.jsx b/src/components/modals/main/settings/sections/Weather.jsx
index 441cf6e1..fa726df1 100644
--- a/src/components/modals/main/settings/sections/Weather.jsx
+++ b/src/components/modals/main/settings/sections/Weather.jsx
@@ -48,47 +48,46 @@ export default class TimeSettings extends PureComponent {
   }
 
   render() {
-    const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-    const languagecode = variables.languagecode;
+    const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
     const tempFormat = [
       {
-        name: getMessage(languagecode, 'modals.main.settings.sections.weather.temp_format.celsius') + ' (°C)',
+        name: getMessage('modals.main.settings.sections.weather.temp_format.celsius') + ' (°C)',
         value: 'celsius'
       },
       {
-        name: getMessage(languagecode, 'modals.main.settings.sections.weather.temp_format.fahrenheit') + ' (°F)',
+        name: getMessage('modals.main.settings.sections.weather.temp_format.fahrenheit') + ' (°F)',
         value: 'fahrenheit'
       },
       {
-        name: getMessage(languagecode, 'modals.main.settings.sections.weather.temp_format.kelvin') + ' (K)',
+        name: getMessage('modals.main.settings.sections.weather.temp_format.kelvin') + ' (K)',
         value: 'kelvin'
       }
     ];
       
     return (
       <>
-        <h2>{getMessage(languagecode, 'modals.main.settings.sections.weather.title')}</h2>
-        <Switch name='weatherEnabled' text={getMessage(languagecode, 'modals.main.settings.enabled')} category='widgets'/>
+        <h2>{getMessage('modals.main.settings.sections.weather.title')}</h2>
+        <Switch name='weatherEnabled' text={getMessage('modals.main.settings.enabled')} category='widgets'/>
         <ul>
-          <p>{getMessage(languagecode, 'modals.main.settings.sections.weather.location')} <span className='modalLink' onClick={() => this.getAuto()}>{getMessage(languagecode, 'modals.main.settings.sections.weather.auto')}</span></p>
+          <p>{getMessage('modals.main.settings.sections.weather.location')} <span className='modalLink' onClick={() => this.getAuto()}>{getMessage('modals.main.settings.sections.weather.auto')}</span></p>
           <input type='text' value={this.state.location} onChange={(e) => this.changeLocation(e)}></input>
         </ul>
         <br/>
-        <Radio name='tempformat' title={getMessage(languagecode, 'modals.main.settings.sections.weather.temp_format.title')} options={tempFormat} category='weather'/>
-        <Slider title={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomWeather' min='10' max='400' default='100' display='%' category='weather'/>
+        <Radio name='tempformat' title={getMessage('modals.main.settings.sections.weather.temp_format.title')} options={tempFormat} category='weather'/>
+        <Slider title={getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomWeather' min='10' max='400' default='100' display='%' category='weather'/>
 
-        <h3>{getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.title')}</h3>
-        <Checkbox name='showlocation' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.show_location')} category='weather'/>
-        <Checkbox name='weatherdescription' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.show_description')} category='weather'/>
-        <Checkbox name='cloudiness' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.cloudiness')} category='weather'/>
-        <Checkbox name='humidity' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.humidity')} category='weather'/>
-        <Checkbox name='visibility' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.visibility')} category='weather'/>
-        <Checkbox name='windspeed' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.wind_speed')} category='weather'/>
-        <Checkbox name='windDirection' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.wind_direction')} category='weather'/>
-        <Checkbox name='mintemp' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.min_temp')} category='weather'/>
-        <Checkbox name='maxtemp' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.max_temp')} category='weather'/>
-        <Checkbox name='atmosphericpressure' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.atmospheric_pressure')} category='weather'/>
+        <h3>{getMessage('modals.main.settings.sections.weather.extra_info.title')}</h3>
+        <Checkbox name='showlocation' text={getMessage('modals.main.settings.sections.weather.extra_info.show_location')} category='weather'/>
+        <Checkbox name='weatherdescription' text={getMessage('modals.main.settings.sections.weather.extra_info.show_description')} category='weather'/>
+        <Checkbox name='cloudiness' text={getMessage('modals.main.settings.sections.weather.extra_info.cloudiness')} category='weather'/>
+        <Checkbox name='humidity' text={getMessage('modals.main.settings.sections.weather.extra_info.humidity')} category='weather'/>
+        <Checkbox name='visibility' text={getMessage('modals.main.settings.sections.weather.extra_info.visibility')} category='weather'/>
+        <Checkbox name='windspeed' text={getMessage('modals.main.settings.sections.weather.extra_info.wind_speed')} category='weather'/>
+        <Checkbox name='windDirection' text={getMessage('modals.main.settings.sections.weather.extra_info.wind_direction')} category='weather'/>
+        <Checkbox name='mintemp' text={getMessage('modals.main.settings.sections.weather.extra_info.min_temp')} category='weather'/>
+        <Checkbox name='maxtemp' text={getMessage('modals.main.settings.sections.weather.extra_info.max_temp')} category='weather'/>
+        <Checkbox name='atmosphericpressure' text={getMessage('modals.main.settings.sections.weather.extra_info.atmospheric_pressure')} category='weather'/>
       </>
     );
   }
diff --git a/src/components/modals/main/settings/sections/background/Background.jsx b/src/components/modals/main/settings/sections/background/Background.jsx
index a51467a1..2ea56ca6 100644
--- a/src/components/modals/main/settings/sections/background/Background.jsx
+++ b/src/components/modals/main/settings/sections/background/Background.jsx
@@ -15,15 +15,14 @@ import ColourSettings from './Colour';
 import EventBus from 'modules/helpers/eventbus';
 
 export default class BackgroundSettings extends PureComponent {
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   constructor() {
     super();
     this.state = {
       customBackground: this.getCustom(),
       backgroundType: localStorage.getItem('backgroundType') || 'api',
-      backgroundCategories: [this.getMessage(this.languagecode, 'modals.main.loading')]
+      backgroundCategories: [this.getMessage('modals.main.loading')]
     };
     this.controller = new AbortController();
   }
@@ -33,7 +32,7 @@ export default class BackgroundSettings extends PureComponent {
     this.setState({
       customBackground: ['']
     });
-    toast(this.getMessage(this.languagecode, 'toasts.reset'));
+    toast(this.getMessage('toasts.reset'));
     EventBus.dispatch('refresh', 'background');
   }
 
@@ -73,8 +72,8 @@ export default class BackgroundSettings extends PureComponent {
     if (customBackground.startsWith('data:video/') || customBackground.endsWith('.mp4') || customBackground.endsWith('.webm') || customBackground.endsWith('.ogg')) { 
       return (
         <>
-          <Checkbox name='backgroundVideoLoop' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.loop_video')}/>
-          <Checkbox name='backgroundVideoMute' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.mute_video')}/>
+          <Checkbox name='backgroundVideoLoop' text={this.getMessage('modals.main.settings.sections.background.source.loop_video')}/>
+          <Checkbox name='backgroundVideoMute' text={this.getMessage('modals.main.settings.sections.background.source.mute_video')}/>
         </>
       );
     } else {
@@ -84,7 +83,7 @@ export default class BackgroundSettings extends PureComponent {
 
   marketplaceType = () => {
     if (localStorage.getItem('photo_packs')) {
-      return <option value='photo_pack'>{this.getMessage(this.languagecode, 'modals.main.navbar.marketplace')}</option>;
+      return <option value='photo_pack'>{this.getMessage('modals.main.navbar.marketplace')}</option>;
     }
   }
 
@@ -123,7 +122,7 @@ export default class BackgroundSettings extends PureComponent {
   componentDidMount() {
     if (navigator.onLine === false || localStorage.getItem('offlineMode') === 'true') {
       return this.setState({
-        backgroundCategories: [this.getMessage(this.languagecode, 'modals.update.offline.title')]
+        backgroundCategories: [this.getMessage('modals.update.offline.title')]
       });
     }
 
diff --git a/src/components/modals/main/settings/sections/background/Colour.jsx b/src/components/modals/main/settings/sections/background/Colour.jsx
index c60201d8..33ddbb19 100644
--- a/src/components/modals/main/settings/sections/background/Colour.jsx
+++ b/src/components/modals/main/settings/sections/background/Colour.jsx
@@ -13,8 +13,7 @@ export default class ColourSettings extends PureComponent {
   DefaultGradientSettings = { angle: '180', gradient: [{ colour: '#ffb032', stop: 0 }], type: 'linear' };
   GradientPickerInitalState = undefined;
 
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
   
   constructor() {
     super();
@@ -28,7 +27,7 @@ export default class ColourSettings extends PureComponent {
     this.setState({
       gradientSettings: this.DefaultGradientSettings
     });
-    toast(this.getMessage(this.languagecode, 'toasts.reset'));
+    toast(this.getMessage('toasts.reset'));
   }
 
   initialiseColourPickerState(gradientSettings) {
@@ -105,14 +104,14 @@ export default class ColourSettings extends PureComponent {
   }
 
   currentGradientSettings = () => {
-    if (typeof this.state.gradientSettings === 'object' && this.state.gradientSettings.gradient.every(g => g.colour !== this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.disabled'))) {
+    if (typeof this.state.gradientSettings === 'object' && this.state.gradientSettings.gradient.every(g => g.colour !== this.getMessage('modals.main.settings.sections.background.source.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 this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.disabled');
+    return this.getMessage('modals.main.settings.sections.background.source.disabled');
   }
 
   onColourPickerChange = (attrs, name) => {
@@ -176,14 +175,14 @@ export default class ColourSettings extends PureComponent {
       colourSettings = (
         <>
           {gradientInputs}
-          {!gradientHasMoreThanOneColour ? (<><br/><br/><button type='button' className='add' onClick={this.addColour}>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.add_colour')}</button></>) : null}
+          {!gradientHasMoreThanOneColour ? (<><br/><br/><button type='button' className='add' onClick={this.addColour}>{this.getMessage('modals.main.settings.sections.background.source.add_colour')}</button></>) : null}
         </>
       );
     }
 
     return (
       <>
-        <p>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.custom_colour')} <span className='modalLink' onClick={() => this.resetColour()}>{this.getMessage(this.languagecode, 'modals.main.settings.buttons.reset')}</span></p>
+        <p>{this.getMessage('modals.main.settings.sections.background.source.custom_colour')} <span className='modalLink' onClick={() => this.resetColour()}>{this.getMessage('modals.main.settings.buttons.reset')}</span></p>
         {colourSettings}
       </>
     );
diff --git a/src/components/modals/main/tabs/Addons.jsx b/src/components/modals/main/tabs/Addons.jsx
index 0d598c6e..e070af45 100644
--- a/src/components/modals/main/tabs/Addons.jsx
+++ b/src/components/modals/main/tabs/Addons.jsx
@@ -6,14 +6,13 @@ import Sideload from '../marketplace/sections/Sideload';
 import Create from '../marketplace/sections/Create';
 
 export default function Addons() {
-  const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  const languagecode = variables.languagecode;
+  const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   return (
     <Tabs>
-      <div label={getMessage(languagecode, 'modals.main.addons.added')} name='added'><Added/></div>
-      <div label={getMessage(languagecode, 'modals.main.addons.sideload')} name='sideload'><Sideload/></div>
-      <div label={getMessage(languagecode, 'modals.main.addons.create.title')} name='create'><Create/></div>
+      <div label={getMessage('modals.main.addons.added')} name='added'><Added/></div>
+      <div label={getMessage('modals.main.addons.sideload')} name='sideload'><Sideload/></div>
+      <div label={getMessage('modals.main.addons.create.title')} name='create'><Create/></div>
     </Tabs>
   );
 }
diff --git a/src/components/modals/main/tabs/Marketplace.jsx b/src/components/modals/main/tabs/Marketplace.jsx
index f31310a4..705d4130 100644
--- a/src/components/modals/main/tabs/Marketplace.jsx
+++ b/src/components/modals/main/tabs/Marketplace.jsx
@@ -4,14 +4,13 @@ import Tabs from './backend/Tabs';
 import MarketplaceTab from '../marketplace/sections/Marketplace';
 
 export default function Marketplace() {
-  const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  const languagecode = variables.languagecode;
+  const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   return (
     <Tabs>
-      <div label={getMessage(languagecode, 'modals.main.marketplace.photo_packs')} name='photo_packs'><MarketplaceTab type='photo_packs'/></div>
-      <div label={getMessage(languagecode, 'modals.main.marketplace.quote_packs')} name='quote_packs'><MarketplaceTab type='quote_packs'/></div>
-      <div label={getMessage(languagecode, 'modals.main.marketplace.preset_settings')} name='preset_settings'><MarketplaceTab type='preset_settings'/></div>
+      <div label={getMessage('modals.main.marketplace.photo_packs')} name='photo_packs'><MarketplaceTab type='photo_packs'/></div>
+      <div label={getMessage('modals.main.marketplace.quote_packs')} name='quote_packs'><MarketplaceTab type='quote_packs'/></div>
+      <div label={getMessage('modals.main.marketplace.preset_settings')} name='preset_settings'><MarketplaceTab type='preset_settings'/></div>
     </Tabs>
   );
 }
diff --git a/src/components/modals/main/tabs/Settings.jsx b/src/components/modals/main/tabs/Settings.jsx
index e8f86753..e8c44c96 100644
--- a/src/components/modals/main/tabs/Settings.jsx
+++ b/src/components/modals/main/tabs/Settings.jsx
@@ -20,29 +20,28 @@ import Keybinds from '../settings/sections/Keybinds';
 import Message from '../settings/sections/Message';
 
 export default function Settings() {
-  const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  const languagecode = variables.languagecode;
+  const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   return (
     <>
       <Tabs>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.time.title')} name='time'><Time/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.quote.title')} name='quote'><Quote/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.greeting.title')} name='greeting'><Greeting/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.background.title')} name='background'><Background/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.search.title')} name='search'><Search/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.quicklinks.title')} name='quicklinks'><QuickLinks/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.weather.title')} name='weather'><Weather/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.message.title')} name='message'><Message/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.appearance.title')} name='appearance'><Appearance/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.order.title')} name='order'><Order/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.language.title')} name='language'><Language/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.advanced.title')} name='advanced'><Advanced/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.keybinds.title')} name='keybinds'><Keybinds/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.stats.title')} name='stats'><Stats/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.experimental.title')} name='experimental'><Experimental/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.changelog')} name='changelog'><Changelog/></div>
-        <div label={getMessage(languagecode, 'modals.main.settings.sections.about.title')} name='about'><About/></div>
+        <div label={getMessage('modals.main.settings.sections.time.title')} name='time'><Time/></div>
+        <div label={getMessage('modals.main.settings.sections.quote.title')} name='quote'><Quote/></div>
+        <div label={getMessage('modals.main.settings.sections.greeting.title')} name='greeting'><Greeting/></div>
+        <div label={getMessage('modals.main.settings.sections.background.title')} name='background'><Background/></div>
+        <div label={getMessage('modals.main.settings.sections.search.title')} name='search'><Search/></div>
+        <div label={getMessage('modals.main.settings.sections.quicklinks.title')} name='quicklinks'><QuickLinks/></div>
+        <div label={getMessage('modals.main.settings.sections.weather.title')} name='weather'><Weather/></div>
+        <div label={getMessage('modals.main.settings.sections.message.title')} name='message'><Message/></div>
+        <div label={getMessage('modals.main.settings.sections.appearance.title')} name='appearance'><Appearance/></div>
+        <div label={getMessage('modals.main.settings.sections.order.title')} name='order'><Order/></div>
+        <div label={getMessage('modals.main.settings.sections.language.title')} name='language'><Language/></div>
+        <div label={getMessage('modals.main.settings.sections.advanced.title')} name='advanced'><Advanced/></div>
+        <div label={getMessage('modals.main.settings.sections.keybinds.title')} name='keybinds'><Keybinds/></div>
+        <div label={getMessage('modals.main.settings.sections.stats.title')} name='stats'><Stats/></div>
+        <div label={getMessage('modals.main.settings.sections.experimental.title')} name='experimental'><Experimental/></div>
+        <div label={getMessage('modals.main.settings.sections.changelog')} name='changelog'><Changelog/></div>
+        <div label={getMessage('modals.main.settings.sections.about.title')} name='about'><About/></div>
       </Tabs>
     </>
   );
diff --git a/src/components/modals/main/tabs/backend/Tab.jsx b/src/components/modals/main/tabs/backend/Tab.jsx
index f7efed36..4dc06bbd 100644
--- a/src/components/modals/main/tabs/backend/Tab.jsx
+++ b/src/components/modals/main/tabs/backend/Tab.jsx
@@ -27,8 +27,7 @@ import {
 } from '@mui/icons-material';
 
 function Tab({ label, currentTab, onClick, navbarTab }) {
-  const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  const languagecode = variables.languagecode;
+  const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   let className = 'tab-list-item';
   if (currentTab === label) {
@@ -44,40 +43,40 @@ function Tab({ label, currentTab, onClick, navbarTab }) {
 
   let icon, divider;
   switch (label) {
-    case getMessage(languagecode, 'modals.main.navbar.settings'): icon = <Settings/>; break;
-    case getMessage(languagecode, 'modals.main.navbar.addons'): icon = <Addons/>; break;
-    case getMessage(languagecode, 'modals.main.navbar.marketplace'): icon = <Marketplace/>; break;
+    case getMessage('modals.main.navbar.settings'): icon = <Settings/>; break;
+    case getMessage('modals.main.navbar.addons'): icon = <Addons/>; break;
+    case getMessage('modals.main.navbar.marketplace'): icon = <Marketplace/>; break;
 
-    case getMessage(languagecode, 'modals.main.settings.sections.time.title'): icon = <Time/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.greeting.title'): icon = <Greeting/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.quote.title'): icon = <Quote/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.background.title'): icon = <Background/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.search.title'): icon = <Search/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.weather.title'): icon = <Weather/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.quicklinks.title'): icon = <QuickLinks/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.appearance.title'): icon = <Appearance/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.order.title'): icon = <Order/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.message.title'): icon = <Message/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.language.title'): icon = <Language/>; divider = true; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.advanced.title'): icon = <Advanced/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.keybinds.title'): icon = <Keybinds/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.stats.title'): icon = <Stats/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.experimental.title'): icon = <Experimental/>; divider = true; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.changelog'): icon = <Changelog/>; break;
-    case getMessage(languagecode, 'modals.main.settings.sections.about.title'): icon = <About/>; break;
+    case getMessage('modals.main.settings.sections.time.title'): icon = <Time/>; break;
+    case getMessage('modals.main.settings.sections.greeting.title'): icon = <Greeting/>; break;
+    case getMessage('modals.main.settings.sections.quote.title'): icon = <Quote/>; break;
+    case getMessage('modals.main.settings.sections.background.title'): icon = <Background/>; break;
+    case getMessage('modals.main.settings.sections.search.title'): icon = <Search/>; break;
+    case getMessage('modals.main.settings.sections.weather.title'): icon = <Weather/>; break;
+    case getMessage('modals.main.settings.sections.quicklinks.title'): icon = <QuickLinks/>; break;
+    case getMessage('modals.main.settings.sections.appearance.title'): icon = <Appearance/>; break;
+    case getMessage('modals.main.settings.sections.order.title'): icon = <Order/>; break;
+    case getMessage('modals.main.settings.sections.message.title'): icon = <Message/>; break;
+    case getMessage('modals.main.settings.sections.language.title'): icon = <Language/>; divider = true; break;
+    case getMessage('modals.main.settings.sections.advanced.title'): icon = <Advanced/>; break;
+    case getMessage('modals.main.settings.sections.keybinds.title'): icon = <Keybinds/>; break;
+    case getMessage('modals.main.settings.sections.stats.title'): icon = <Stats/>; break;
+    case getMessage('modals.main.settings.sections.experimental.title'): icon = <Experimental/>; divider = true; break;
+    case getMessage('modals.main.settings.sections.changelog'): icon = <Changelog/>; break;
+    case getMessage('modals.main.settings.sections.about.title'): icon = <About/>; break;
 
-    case getMessage(languagecode, 'modals.main.addons.added'): icon = <Added/>; break;
-    case getMessage(languagecode, 'modals.main.addons.sideload'): icon = <Sideload/>; break;
-    case getMessage(languagecode, 'modals.main.addons.create.title'): icon = <Create/>; break;
+    case getMessage('modals.main.addons.added'): icon = <Added/>; break;
+    case getMessage('modals.main.addons.sideload'): icon = <Sideload/>; break;
+    case getMessage('modals.main.addons.create.title'): icon = <Create/>; break;
 
-    case getMessage(languagecode, 'modals.main.marketplace.photo_packs'): icon = <Background/>; break;
-    case getMessage(languagecode, 'modals.main.marketplace.quote_packs'): icon = <Quote/>; break;
-    case getMessage(languagecode, 'modals.main.marketplace.preset_settings'): icon = <Advanced/>; break;
+    case getMessage('modals.main.marketplace.photo_packs'): icon = <Background/>; break;
+    case getMessage('modals.main.marketplace.quote_packs'): icon = <Quote/>; break;
+    case getMessage('modals.main.marketplace.preset_settings'): icon = <Advanced/>; break;
 
     default: break;
   }
 
-  if (label === getMessage(languagecode, 'modals.main.settings.sections.experimental.title')) {
+  if (label === getMessage('modals.main.settings.sections.experimental.title')) {
     if (localStorage.getItem('experimental') === 'false') {
       return <hr/>;
     }
diff --git a/src/components/modals/welcome/Welcome.jsx b/src/components/modals/welcome/Welcome.jsx
index 934d402f..3ea518a3 100644
--- a/src/components/modals/welcome/Welcome.jsx
+++ b/src/components/modals/welcome/Welcome.jsx
@@ -9,8 +9,7 @@ import ProgressBar from './ProgressBar';
 import './welcome.scss';
 
 export default class WelcomeModal extends PureComponent {
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   constructor() {
     super();
@@ -18,7 +17,7 @@ export default class WelcomeModal extends PureComponent {
       image: './././icons/undraw_celebration.svg',
       currentTab: 0,
       finalTab: 4,
-      buttonText: this.getMessage(this.languagecode, 'modals.welcome.buttons.next')
+      buttonText: this.getMessage('modals.welcome.buttons.next')
     };
     this.images = [
       './././icons/undraw_celebration.svg', 
@@ -38,18 +37,18 @@ export default class WelcomeModal extends PureComponent {
       return this.setState({
         currentTab: this.state.currentTab - 1,
         image: this.images[this.state.currentTab - 1],
-        buttonText: this.getMessage(this.languagecode, 'modals.welcome.buttons.next')
+        buttonText: this.getMessage('modals.welcome.buttons.next')
       });
     }
 
-    if (this.state.buttonText === this.getMessage(this.languagecode, 'modals.welcome.buttons.close')) {
+    if (this.state.buttonText === this.getMessage('modals.welcome.buttons.close')) {
       return this.props.modalClose();
     }
 
     this.setState({
       currentTab: this.state.currentTab + 1,
       image: this.images[this.state.currentTab + 1],
-      buttonText: (this.state.currentTab !== this.state.finalTab) ? this.getMessage(this.languagecode, 'modals.welcome.buttons.next') : this.getMessage(this.languagecode, 'modals.welcome.buttons.close')
+      buttonText: (this.state.currentTab !== this.state.finalTab) ? this.getMessage('modals.welcome.buttons.next') : this.getMessage('modals.welcome.buttons.close')
     });
   }
 
@@ -58,7 +57,7 @@ export default class WelcomeModal extends PureComponent {
     this.setState({
       currentTab: tab,
       image: this.images[tab],
-      buttonText: (tab !== this.state.finalTab + 1) ? this.getMessage(this.languagecode, 'modals.welcome.buttons.next') : this.getMessage(this.languagecode, 'modals.welcome.buttons.close')
+      buttonText: (tab !== this.state.finalTab + 1) ? this.getMessage('modals.welcome.buttons.next') : this.getMessage('modals.welcome.buttons.close')
     });
 
     localStorage.setItem('bgtransition', true);
@@ -71,7 +70,7 @@ export default class WelcomeModal extends PureComponent {
       this.setState({
         currentTab: Number(welcomeTab),
         image: this.images[Number(welcomeTab)],
-        buttonText: (Number(welcomeTab) !== this.state.finalTab + 1) ? this.getMessage(this.languagecode, 'modals.welcome.buttons.next') : this.getMessage(this.languagecode, 'modals.welcome.buttons.close')
+        buttonText: (Number(welcomeTab) !== this.state.finalTab + 1) ? this.getMessage('modals.welcome.buttons.next') : this.getMessage('modals.welcome.buttons.close')
       });
     }
 
@@ -100,7 +99,7 @@ export default class WelcomeModal extends PureComponent {
             <WelcomeSections currentTab={this.state.currentTab} switchTab={(tab) => this.switchTab(tab)}/>
           </div>
           <div className='buttons'>
-            {(this.state.currentTab !== 0) ? <button className='close' style={{ marginRight: '20px' }} onClick={() => this.changeTab(true)}>{this.getMessage(this.languagecode, 'modals.welcome.buttons.previous')}</button> : null}
+            {(this.state.currentTab !== 0) ? <button className='close' style={{ marginRight: '20px' }} onClick={() => this.changeTab(true)}>{this.getMessage('modals.welcome.buttons.previous')}</button> : null}
             <button className='close' onClick={() => this.changeTab()}>{this.state.buttonText}</button>
           </div>
         </section>
diff --git a/src/components/modals/welcome/WelcomeSections.jsx b/src/components/modals/welcome/WelcomeSections.jsx
index fd6393fe..ba1931c2 100644
--- a/src/components/modals/welcome/WelcomeSections.jsx
+++ b/src/components/modals/welcome/WelcomeSections.jsx
@@ -13,8 +13,7 @@ const languages = require('modules/languages.json');
 const default_settings = require('modules/default_settings.json');
 
 export default class WelcomeSections extends PureComponent {
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   constructor() {
     super();
@@ -112,8 +111,8 @@ export default class WelcomeSections extends PureComponent {
   
     const intro = (
       <>
-        <h1>{this.getMessage(this.languagecode, 'modals.welcome.sections.intro.title')}</h1>
-        <p>{this.getMessage(this.languagecode, 'modals.welcome.sections.intro.description')}</p>
+        <h1>{this.getMessage('modals.welcome.sections.intro.title')}</h1>
+        <p>{this.getMessage('modals.welcome.sections.intro.description')}</p>
         <h3 className='quicktip'>#shareyourmue</h3>
         <div className='examples'>
           <img src={this.welcomeImages[this.state.welcomeImage]} alt='Example Mue setup' draggable={false}/>
@@ -123,78 +122,78 @@ export default class WelcomeSections extends PureComponent {
   
     const chooseLanguage = (
       <>
-        <h1>{this.getMessage(this.languagecode, 'modals.welcome.sections.language.title')}</h1>
-        <p>{this.getMessage(this.languagecode, 'modals.welcome.sections.language.description')} <a href={window.constants.TRANSLATIONS_URL} className='resetLink' target='_blank' rel='noopener noreferrer'>GitHub</a>!</p>
+        <h1>{this.getMessage('modals.welcome.sections.language.title')}</h1>
+        <p>{this.getMessage('modals.welcome.sections.language.description')} <a href={window.constants.TRANSLATIONS_URL} className='resetLink' target='_blank' rel='noopener noreferrer'>GitHub</a>!</p>
         <Radio name='language' options={languages} category='welcomeLanguage'/>
       </>
     );
 
     const theme = (
       <>
-        <h1>{this.getMessage(this.languagecode, 'modals.welcome.sections.theme.title')}</h1>
-        <p>{this.getMessage(this.languagecode, 'modals.welcome.sections.theme.description')}</p>
+        <h1>{this.getMessage('modals.welcome.sections.theme.title')}</h1>
+        <p>{this.getMessage('modals.welcome.sections.theme.description')}</p>
         <div className='themesToggleArea'>
           <div className={this.state.autoClass} onClick={() => this.changeTheme('auto')}>
             <AutoAwesome/>
-            <span>{this.getMessage(this.languagecode, 'modals.main.settings.sections.appearance.theme.auto')}</span>
+            <span>{this.getMessage('modals.main.settings.sections.appearance.theme.auto')}</span>
           </div>
           <div className='options'>
             <div className={this.state.lightClass} onClick={() => this.changeTheme('light')}>
               <LightMode/>
-              <span>{this.getMessage(this.languagecode, 'modals.main.settings.sections.appearance.theme.light')}</span>
+              <span>{this.getMessage('modals.main.settings.sections.appearance.theme.light')}</span>
             </div>
             <div className={this.state.darkClass} onClick={() => this.changeTheme('dark')}>
               <DarkMode/>
-              <span>{this.getMessage(this.languagecode, 'modals.main.settings.sections.appearance.theme.dark')}</span>
+              <span>{this.getMessage('modals.main.settings.sections.appearance.theme.dark')}</span>
             </div>
           </div>
-          <h3 className='quicktip'>{this.getMessage(this.languagecode, 'modals.welcome.tip')}</h3>
-          <p>{this.getMessage(this.languagecode, 'modals.welcome.sections.theme.tip')}</p>
+          <h3 className='quicktip'>{this.getMessage('modals.welcome.tip')}</h3>
+          <p>{this.getMessage('modals.welcome.sections.theme.tip')}</p>
         </div>
       </>
     );
   
     const settings = (
       <>
-        <h1>{this.getMessage(this.languagecode, 'modals.welcome.sections.settings.title')}</h1>
-        <p>{this.getMessage(this.languagecode, 'modals.welcome.sections.settings.description')}</p>
+        <h1>{this.getMessage('modals.welcome.sections.settings.title')}</h1>
+        <p>{this.getMessage('modals.welcome.sections.settings.description')}</p>
         <button className='upload' onClick={() => document.getElementById('file-input').click()}>
           <CloudUpload/>
           <br/>
-          <span>{this.getMessage(this.languagecode, 'modals.main.settings.buttons.import')}</span>
+          <span>{this.getMessage('modals.main.settings.buttons.import')}</span>
         </button>
         <FileUpload id='file-input' accept='application/json' type='settings' loadFunction={(e) => this.importSettings(e)}/>
-        <h3 className='quicktip'>{this.getMessage(this.languagecode, 'modals.welcome.tip')}</h3>
-        <p>{this.getMessage(this.languagecode, 'modals.welcome.sections.settings.tip')}</p>
+        <h3 className='quicktip'>{this.getMessage('modals.welcome.tip')}</h3>
+        <p>{this.getMessage('modals.welcome.sections.settings.tip')}</p>
       </>
     );
 
     const privacy = (
       <>
-        <h1>{this.getMessage(this.languagecode, 'modals.welcome.sections.privacy.title')}</h1>
-        <p>{this.getMessage(this.languagecode, 'modals.welcome.sections.privacy.description')}</p>
-        <Checkbox name='offlineMode' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.advanced.offline_mode')} element='.other' />
-        <p>{this.getMessage(this.languagecode, 'modals.welcome.sections.privacy.offline_mode_description')}</p>
-        <Checkbox name='quicklinksddgProxy' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.background.ddg_image_proxy') + ' (' + this.getMessage(this.languagecode, 'modals.main.settings.sections.quicklinks.title') + ')'}/>
-        <Checkbox name='ddgProxy' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.background.ddg_image_proxy') + ' (' +this.getMessage(this.languagecode, 'modals.main.settings.sections.background.title') + ')'}/>
-        <p>{this.getMessage(this.languagecode, 'modals.welcome.sections.privacy.ddg_proxy_description')}</p>
-        <h3 className='quicktip'>{this.getMessage(this.languagecode, 'modals.welcome.sections.privacy.links.title')}</h3>
-        <a className='privacy' href={window.constants.PRIVACY_URL} target='_blank' rel='noopener noreferrer'>{this.getMessage(this.languagecode, 'modals.welcome.sections.privacy.links.privacy_policy')}</a>
+        <h1>{this.getMessage('modals.welcome.sections.privacy.title')}</h1>
+        <p>{this.getMessage('modals.welcome.sections.privacy.description')}</p>
+        <Checkbox name='offlineMode' text={this.getMessage('modals.main.settings.sections.advanced.offline_mode')} element='.other' />
+        <p>{this.getMessage('modals.welcome.sections.privacy.offline_mode_description')}</p>
+        <Checkbox name='quicklinksddgProxy' text={this.getMessage('modals.main.settings.sections.background.ddg_image_proxy') + ' (' + this.getMessage('modals.main.settings.sections.quicklinks.title') + ')'}/>
+        <Checkbox name='ddgProxy' text={this.getMessage('modals.main.settings.sections.background.ddg_image_proxy') + ' (' +this.getMessage('modals.main.settings.sections.background.title') + ')'}/>
+        <p>{this.getMessage('modals.welcome.sections.privacy.ddg_proxy_description')}</p>
+        <h3 className='quicktip'>{this.getMessage('modals.welcome.sections.privacy.links.title')}</h3>
+        <a className='privacy' href={window.constants.PRIVACY_URL} target='_blank' rel='noopener noreferrer'>{this.getMessage('modals.welcome.sections.privacy.links.privacy_policy')}</a>
         <br/><br/>
-        <a className='privacy' href={'https://github.com/' + window.constants.ORG_NAME} target='_blank' rel='noopener noreferrer'>{this.getMessage(this.languagecode, 'modals.welcome.sections.privacy.links.source_code')}</a>
+        <a className='privacy' href={'https://github.com/' + window.constants.ORG_NAME} target='_blank' rel='noopener noreferrer'>{this.getMessage('modals.welcome.sections.privacy.links.source_code')}</a>
       </>
     );
 
     const final = (
       <>
-        <h1>{this.getMessage(this.languagecode, 'modals.welcome.sections.final.title')}</h1>
-        <p>{this.getMessage(this.languagecode, 'modals.welcome.sections.final.description')}</p>
-        <h3 className='quicktip'>{this.getMessage(this.languagecode, 'modals.welcome.sections.final.changes')}</h3>
-        <p>{this.getMessage(this.languagecode, 'modals.welcome.sections.final.changes_description')}</p>
+        <h1>{this.getMessage('modals.welcome.sections.final.title')}</h1>
+        <p>{this.getMessage('modals.welcome.sections.final.description')}</p>
+        <h3 className='quicktip'>{this.getMessage('modals.welcome.sections.final.changes')}</h3>
+        <p>{this.getMessage('modals.welcome.sections.final.changes_description')}</p>
         <div className='themesToggleArea'>
-          <div className='toggle' onClick={() => this.props.switchTab(1)}><span>{this.getMessage(this.languagecode, 'modals.main.settings.sections.language.title')}: {languages.find((i) => i.value === localStorage.getItem('language')).name}</span></div>
-          <div className='toggle' onClick={() => this.props.switchTab(3)}><span>{this.getMessage(this.languagecode, 'modals.main.settings.sections.appearance.theme.title')}: {this.getSetting('theme')}</span></div>
-          {(this.state.importedSettings.length !== 0) ? <div className='toggle' onClick={() => this.props.switchTab(2)}>{this.getMessage(this.languagecode, 'modals.main.settings.sections.final.imported')} {this.state.importedSettings.length} {this.getMessage(this.languagecode, 'modals.welcome.sections.final.settings')}</div> : null}
+          <div className='toggle' onClick={() => this.props.switchTab(1)}><span>{this.getMessage('modals.main.settings.sections.language.title')}: {languages.find((i) => i.value === localStorage.getItem('language')).name}</span></div>
+          <div className='toggle' onClick={() => this.props.switchTab(3)}><span>{this.getMessage('modals.main.settings.sections.appearance.theme.title')}: {this.getSetting('theme')}</span></div>
+          {(this.state.importedSettings.length !== 0) ? <div className='toggle' onClick={() => this.props.switchTab(2)}>{this.getMessage('modals.main.settings.sections.final.imported')} {this.state.importedSettings.length} {this.getMessage('modals.welcome.sections.final.settings')}</div> : null}
         </div>
       </>
     );
diff --git a/src/components/widgets/quicklinks/QuickLinks.jsx b/src/components/widgets/quicklinks/QuickLinks.jsx
index 61b83440..37b02dfa 100644
--- a/src/components/widgets/quicklinks/QuickLinks.jsx
+++ b/src/components/widgets/quicklinks/QuickLinks.jsx
@@ -10,8 +10,7 @@ import EventBus from 'modules/helpers/eventbus';
 import './quicklinks.scss';
 
 export default class QuickLinks extends PureComponent {
-  getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  languagecode = variables.languagecode;
+  getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
 
   constructor() {
     super();
@@ -46,13 +45,13 @@ export default class QuickLinks extends PureComponent {
 
     let nameError, urlError;
     if (this.state.name.length <= 0) {
-      nameError = this.getMessage(this.languagecode, 'widgets.quicklinks.name_error');
+      nameError = this.getMessage('widgets.quicklinks.name_error');
     }
 
     // regex: https://ihateregex.io/expr/url/
     // eslint-disable-next-line no-useless-escape
     if (url.length <= 0 || /https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()!@:%_\+.~#?&\/\/=]*)/.test(url) === false) {
-      urlError = this.getMessage(this.languagecode, 'widgets.quicklinks.url_error');
+      urlError = this.getMessage('widgets.quicklinks.url_error');
     }
 
     if (nameError || urlError) {
@@ -182,14 +181,14 @@ export default class QuickLinks extends PureComponent {
         <button className='quicklinks' onClick={this.toggleAdd}>+</button>
         <span className='quicklinkscontainer' style={{ visibility: this.state.showAddLink, marginTop }}>
           <div className='topbarquicklinks' onKeyDown={this.topbarEnter}>
-            <h4>{this.getMessage(this.languagecode, 'widgets.quicklinks.new')}</h4>
-            <TextareaAutosize rowsmax={1} placeholder={this.getMessage(this.languagecode, 'widgets.quicklinks.name')} value={this.state.name} onChange={(e) => this.setState({ name: e.target.value })} />
+            <h4>{this.getMessage('widgets.quicklinks.new')}</h4>
+            <TextareaAutosize rowsmax={1} placeholder={this.getMessage('widgets.quicklinks.name')} value={this.state.name} onChange={(e) => this.setState({ name: e.target.value })} />
             <p>{this.state.nameError}</p>
-            <TextareaAutosize rowsmax={10} placeholder={this.getMessage(this.languagecode, 'widgets.quicklinks.url')} value={this.state.url} onChange={(e) => this.setState({ url: e.target.value })} />
+            <TextareaAutosize rowsmax={10} placeholder={this.getMessage('widgets.quicklinks.url')} value={this.state.url} onChange={(e) => this.setState({ url: e.target.value })} />
             <p>{this.state.urlError}</p>
-            <TextareaAutosize rowsmax={10} placeholder={this.getMessage(this.languagecode, 'widgets.quicklinks.icon')} value={this.state.icon} onChange={(e) => this.setState({ icon: e.target.value })} />
+            <TextareaAutosize rowsmax={10} placeholder={this.getMessage('widgets.quicklinks.icon')} value={this.state.icon} onChange={(e) => this.setState({ icon: e.target.value })} />
             <p></p>
-            <button className='pinNote' onClick={this.addLink}>{this.getMessage(this.languagecode, 'widgets.quicklinks.add')}</button>
+            <button className='pinNote' onClick={this.addLink}>{this.getMessage('widgets.quicklinks.add')}</button>
           </div>
         </span>
         {window.keybinds.toggleQuicklinks && window.keybinds.toggleQuicklinks !== '' ? <Hotkeys keyName={window.keybinds.toggleQuicklinks} onKeyDown={this.toggleAdd} /> : null}
diff --git a/src/modules/helpers/settings/modals.js b/src/modules/helpers/settings/modals.js
index e95f1e72..ab2de433 100644
--- a/src/modules/helpers/settings/modals.js
+++ b/src/modules/helpers/settings/modals.js
@@ -29,14 +29,13 @@ export function exportSettings() {
 }
 
 export function importSettings(e) {
-  const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
-  const languagecode = variables.languagecode;
+  const getMessage = (languagecode, text) => variables.language.getMessage(variables.languagecode, text);
   const content = JSON.parse(e.target.result);
 
   Object.keys(content).forEach((key) => {
     localStorage.setItem(key, content[key]);
   });
 
-  toast(getMessage(languagecode, 'toats.imported'));
+  toast(getMessage('toasts.imported'));
   window.stats.postEvent('tab', 'Settings imported');
 }