From ad39f4a732f193db9efa9f20d0fe4f9ab27b4b4f Mon Sep 17 00:00:00 2001
From: David Ralph <me@davidcralph.co.uk>
Date: Tue, 14 Mar 2023 23:53:05 +0000
Subject: [PATCH] chore: run prettier, refactor translations

---
 .../main/marketplace/examples/photos.json     | 48 +++++++++----------
 .../main/marketplace/examples/quotes.json     | 38 +++++++--------
 .../main/marketplace/examples/settings.json   | 24 +++++-----
 .../main/marketplace/sections/Create.jsx      |  9 +++-
 .../main/settings/sections/Experimental.jsx   |  7 +--
 .../settings/sections/quicklinks/AddModal.jsx |  6 +--
 .../widgets/background/PhotoInformation.jsx   | 31 ++++--------
 .../background/scss/_photoinformation.scss    | 29 +++++------
 src/index.jsx                                 | 36 ++------------
 src/modules/helpers/experimental.js           |  1 -
 src/modules/translations.js                   | 36 +++++++-------
 11 files changed, 114 insertions(+), 151 deletions(-)

diff --git a/src/components/modals/main/marketplace/examples/photos.json b/src/components/modals/main/marketplace/examples/photos.json
index fc934c32..bf3dc38c 100644
--- a/src/components/modals/main/marketplace/examples/photos.json
+++ b/src/components/modals/main/marketplace/examples/photos.json
@@ -1,25 +1,25 @@
 {
-    "name": "Example Photos",
-    "description": "This is an example.",
-    "type": "photos",
-    "version": "1.0.0",
-    "author": "Mue",
-    "icon_url": "https://raw.githubusercontent.com/mue/branding/main/logo/logo_square.png",
-    "screenshot_url": "https://github.com/mue/mue/raw/main/assets/screenshot.webp",
-    "photos": [
-        {
-            "photographer": "Example photographer",
-            "location": "Example location",
-            "url": {
-                "default": "https://github.com/mue/mue/raw/main/assets/screenshot.webp"
-            }
-        },
-        {
-            "photographer": "Example photographer 2",
-            "location": "Example location 2",
-            "url": {
-                "default": "https://github.com/mue/mue/raw/main/assets/screenshot2.webp"
-            }
-        }
-    ]
-}
\ No newline at end of file
+  "name": "Example Photos",
+  "description": "This is an example.",
+  "type": "photos",
+  "version": "1.0.0",
+  "author": "Mue",
+  "icon_url": "https://raw.githubusercontent.com/mue/branding/main/logo/logo_square.png",
+  "screenshot_url": "https://github.com/mue/mue/raw/main/assets/screenshot.webp",
+  "photos": [
+    {
+      "photographer": "Example photographer",
+      "location": "Example location",
+      "url": {
+        "default": "https://github.com/mue/mue/raw/main/assets/screenshot.webp"
+      }
+    },
+    {
+      "photographer": "Example photographer 2",
+      "location": "Example location 2",
+      "url": {
+        "default": "https://github.com/mue/mue/raw/main/assets/screenshot2.webp"
+      }
+    }
+  ]
+}
diff --git a/src/components/modals/main/marketplace/examples/quotes.json b/src/components/modals/main/marketplace/examples/quotes.json
index ce9f91cc..577e1eb7 100644
--- a/src/components/modals/main/marketplace/examples/quotes.json
+++ b/src/components/modals/main/marketplace/examples/quotes.json
@@ -1,20 +1,20 @@
 {
-    "name": "Example Quotes",
-    "description": "This is an example.",
-    "type": "quotes",
-    "version": "1.0.0",
-    "author": "Mue",
-    "icon_url": "https://raw.githubusercontent.com/mue/branding/main/logo/logo_square.png",
-    "screenshot_url": "https://github.com/mue/mue/raw/main/assets/screenshot.webp",
-    "language": "en",
-    "quotes": [
-        {
-            "quote": "This is an example quote.",
-            "author": "Example 1"
-        },
-        {
-            "quote": "This is another example quote.",
-            "author": "Example 2"
-        }
-    ]
-}
\ No newline at end of file
+  "name": "Example Quotes",
+  "description": "This is an example.",
+  "type": "quotes",
+  "version": "1.0.0",
+  "author": "Mue",
+  "icon_url": "https://raw.githubusercontent.com/mue/branding/main/logo/logo_square.png",
+  "screenshot_url": "https://github.com/mue/mue/raw/main/assets/screenshot.webp",
+  "language": "en",
+  "quotes": [
+    {
+      "quote": "This is an example quote.",
+      "author": "Example 1"
+    },
+    {
+      "quote": "This is another example quote.",
+      "author": "Example 2"
+    }
+  ]
+}
diff --git a/src/components/modals/main/marketplace/examples/settings.json b/src/components/modals/main/marketplace/examples/settings.json
index e965f3b8..df07ff22 100644
--- a/src/components/modals/main/marketplace/examples/settings.json
+++ b/src/components/modals/main/marketplace/examples/settings.json
@@ -1,13 +1,13 @@
 {
-    "name": "Example Settings",
-    "description": "This is an example.",
-    "type": "settings",
-    "version": "1.0.0",
-    "author": "Mue",
-    "icon_url": "https://raw.githubusercontent.com/mue/branding/main/logo/logo_square.png",
-    "screenshot_url": "https://github.com/mue/mue/raw/main/assets/screenshot.webp",
-    "settings": {
-        "searchBar": false,
-        "weather": true
-    }
-}
\ No newline at end of file
+  "name": "Example Settings",
+  "description": "This is an example.",
+  "type": "settings",
+  "version": "1.0.0",
+  "author": "Mue",
+  "icon_url": "https://raw.githubusercontent.com/mue/branding/main/logo/logo_square.png",
+  "screenshot_url": "https://github.com/mue/mue/raw/main/assets/screenshot.webp",
+  "settings": {
+    "searchBar": false,
+    "weather": true
+  }
+}
diff --git a/src/components/modals/main/marketplace/sections/Create.jsx b/src/components/modals/main/marketplace/sections/Create.jsx
index 5010ceeb..90f8ecf0 100644
--- a/src/components/modals/main/marketplace/sections/Create.jsx
+++ b/src/components/modals/main/marketplace/sections/Create.jsx
@@ -226,7 +226,14 @@ export default class Create extends PureComponent {
               ) || 'marketplace'}
             </span>
           </div>
-          <button onClick={() => saveFile(this.state.addonMetadata.type, `mue-marketplace-${this.state.addonMetadata.type}.json`)}>
+          <button
+            onClick={() =>
+              saveFile(
+                this.state.addonMetadata.type,
+                `mue-marketplace-${this.state.addonMetadata.type}.json`,
+              )
+            }
+          >
             {variables.getMessage('modals.main.addons.create.metadata.example')}
             <MdDownload />
           </button>
diff --git a/src/components/modals/main/settings/sections/Experimental.jsx b/src/components/modals/main/settings/sections/Experimental.jsx
index f3f6b7c9..c9391e02 100644
--- a/src/components/modals/main/settings/sections/Experimental.jsx
+++ b/src/components/modals/main/settings/sections/Experimental.jsx
@@ -51,14 +51,11 @@ function ExperimentalSettings() {
           varient="outlined"
           InputLabelProps={{ shrink: true }}
         />
-                <button className="uploadbg" onClick={() => EventBus.dispatch(eventType, eventName)}>
+        <button className="uploadbg" onClick={() => EventBus.dispatch(eventType, eventName)}>
           Send
         </button>
       </SettingsItem>
-      <SettingsItem
-        title='Data'
-        final={true}
-      >
+      <SettingsItem title="Data" final={true}>
         <button
           className="reset"
           style={{ marginLeft: '0px' }}
diff --git a/src/components/modals/main/settings/sections/quicklinks/AddModal.jsx b/src/components/modals/main/settings/sections/quicklinks/AddModal.jsx
index d03a02ab..3883ff7b 100644
--- a/src/components/modals/main/settings/sections/quicklinks/AddModal.jsx
+++ b/src/components/modals/main/settings/sections/quicklinks/AddModal.jsx
@@ -25,14 +25,14 @@ function AddModal({ urlError, iconError, addLink, closeModal, edit, editData, ed
           maxRows={1}
           placeholder={variables.getMessage('widgets.quicklinks.name')}
           value={name}
-          onChange={(e) => setName(e.target.value.replace(/(\r\n|\n|\r)/gm, ""))}
+          onChange={(e) => setName(e.target.value.replace(/(\r\n|\n|\r)/gm, ''))}
         />
         <span className="dropdown-error" />
         <TextareaAutosize
           maxRows={10}
           placeholder={variables.getMessage('widgets.quicklinks.url')}
           value={url}
-          onChange={(e) => setUrl(e.target.value.replace(/(\r\n|\n|\r)/gm, ""))}
+          onChange={(e) => setUrl(e.target.value.replace(/(\r\n|\n|\r)/gm, ''))}
         />
         <span className="dropdown-error">{urlError}</span>
         <TextareaAutosize
@@ -40,7 +40,7 @@ function AddModal({ urlError, iconError, addLink, closeModal, edit, editData, ed
           maxLines={1}
           placeholder={variables.getMessage('widgets.quicklinks.icon')}
           value={icon}
-          onChange={(e) => setIcon(e.target.value.replace(/(\r\n|\n|\r)/gm, ""))}
+          onChange={(e) => setIcon(e.target.value.replace(/(\r\n|\n|\r)/gm, ''))}
         />
         <span className="dropdown-error">{iconError}</span>
         {edit ? (
diff --git a/src/components/widgets/background/PhotoInformation.jsx b/src/components/widgets/background/PhotoInformation.jsx
index 498ce3fc..5d438091 100644
--- a/src/components/widgets/background/PhotoInformation.jsx
+++ b/src/components/widgets/background/PhotoInformation.jsx
@@ -215,7 +215,7 @@ function PhotoInformation({ info, url, api }) {
             {photoMap()}
           </div>
           {showingPhotoMap ? (
-            <div className="concept-copyright">
+            <div className="copyright">
               <a
                 href="https://www.mapbox.com/about/maps/"
                 target="_blank"
@@ -256,7 +256,7 @@ function PhotoInformation({ info, url, api }) {
               {photo} {credit}
             </span>
             {info.views && info.downloads !== null ? (
-              <div className="concept-stats">
+              <div className="stats">
                 <div title={variables.getMessage('widgets.background.views')}>
                   <Views />
                   <span>{info.views.toLocaleString()}</span>
@@ -282,37 +282,25 @@ function PhotoInformation({ info, url, api }) {
                   {variables.getMessage('widgets.background.information')}
                 </span>
                 {info.location && info.location !== 'N/A' ? (
-                  <div
-                    className="concept-row"
-                    title={variables.getMessage('widgets.background.location')}
-                  >
+                  <div className="row" title={variables.getMessage('widgets.background.location')}>
                     <MdLocationOn />
                     <span id="infoLocation">{info.location}</span>
                   </div>
                 ) : null}
                 {info.camera && info.camera !== 'N/A' ? (
-                  <div
-                    className="concept-row"
-                    title={variables.getMessage('widgets.background.camera')}
-                  >
+                  <div className="row" title={variables.getMessage('widgets.background.camera')}>
                     <MdPhotoCamera />
                     <span id="infoCamera">{info.camera}</span>
                   </div>
                 ) : null}
-                <div
-                  className="concept-row"
-                  title={variables.getMessage('widgets.background.resolution')}
-                >
+                <div className="row" title={variables.getMessage('widgets.background.resolution')}>
                   <Resolution />
                   <span id="infoResolution">
                     {width}x{height}
                   </span>
                 </div>
                 {info.category ? (
-                  <div
-                    className="concept-row"
-                    title={variables.getMessage('widgets.background.category')}
-                  >
+                  <div className="row" title={variables.getMessage('widgets.background.category')}>
                     <Category />
                     <span id="infoCategory">
                       {info.category[0].toUpperCase() + info.category.slice(1)}
@@ -320,10 +308,7 @@ function PhotoInformation({ info, url, api }) {
                   </div>
                 ) : null}
                 {api ? (
-                  <div
-                    className="concept-row"
-                    title={variables.getMessage('widgets.background.source')}
-                  >
+                  <div className="row" title={variables.getMessage('widgets.background.source')}>
                     <Source />
                     <span id="infoSource">
                       {info.photoURL ? (
@@ -349,7 +334,7 @@ function PhotoInformation({ info, url, api }) {
                   </div>
                 ) : null}
               </div>
-              <div className="concept-buttons">
+              <div className="buttons">
                 {!info.offline ? (
                   <Tooltip
                     title={variables.getMessage('widgets.quote.share')}
diff --git a/src/components/widgets/background/scss/_photoinformation.scss b/src/components/widgets/background/scss/_photoinformation.scss
index f19ffe53..247d56eb 100644
--- a/src/components/widgets/background/scss/_photoinformation.scss
+++ b/src/components/widgets/background/scss/_photoinformation.scss
@@ -13,7 +13,7 @@
       align-items: flex-start;
       flex-flow: column;
 
-      .concept-buttons {
+      .buttons {
         padding: 30px 0 0;
         display: flex;
       }
@@ -25,7 +25,7 @@
         transition: 0.8s;
       }
 
-      .concept-stats {
+      .stats {
         display: flex;
         padding-top: 5px;
         gap: 20px;
@@ -46,7 +46,7 @@
         }
       }
 
-      .concept-copyright {
+      .copyright {
         display: flex;
         margin-top: 10px;
         gap: 10px;
@@ -124,7 +124,7 @@
     }
   }
 
-  +.photoInformation {
+  + .photoInformation {
     animation: none !important;
   }
 }
@@ -247,7 +247,7 @@
     align-items: flex-start;
     flex-flow: column;
 
-    .concept-buttons {
+    .buttons {
       padding: 30px 0 0;
       display: flex;
     }
@@ -259,7 +259,7 @@
       transition: 0.8s;
     }
 
-    .concept-stats {
+    .stats {
       display: flex;
       gap: 15px;
       @include themed {
@@ -279,7 +279,7 @@
       }
     }
 
-    .concept-copyright {
+    .copyright {
       display: flex;
       margin-top: 10px;
       gap: 10px;
@@ -326,11 +326,11 @@
     }
   }
 
-  .concept-location {
+  .location {
     font-size: 1.9em;
   }
 
-  .concept-credit {
+  .credit {
     font-size: 1.4em;
     @include themed {
       color: t($subColor);
@@ -374,7 +374,7 @@
   width: 100%;
   transition: 1s;
 
-  .concept-row {
+  .row {
     display: flex;
     align-items: center;
     gap: 20px;
@@ -388,15 +388,15 @@
   }
 }
 
-.concept-copyright {
+.copyright {
   display: none;
 }
 
-.concept-stats {
+.stats {
   display: none;
 }
 
-.concept-buttons {
+.buttons {
   align-items: center;
   gap: 20px;
   padding: 20px 20px 0 0;
@@ -428,7 +428,8 @@
   }
 }
 
-.photoInformation:hover, .photoInformation-legacy +.photoInformation {
+.photoInformation:hover,
+.photoInformation-legacy + .photoInformation {
   .photoMap {
     height: auto !important;
 
diff --git a/src/index.jsx b/src/index.jsx
index 5baa88d3..1f777953 100644
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -8,48 +8,18 @@ import './scss/index.scss';
 // the toast css is based on default so we need to import it
 import 'react-toastify/dist/ReactToastify.min.css';
 
-// local stats
 import Stats from 'modules/helpers/stats';
 
-// language
-import I18n from '@eartharoid/i18n';
-
-// this is because of vite
 import translations from 'modules/translations';
 
 const languagecode = localStorage.getItem('language') || 'en_GB';
-
-// we set things to variables. so we avoid passing the translation strings etc as props to each component
-variables.languagecode = languagecode.replace('-', '_');
-
-if (languagecode === 'en') {
-  variables.languagecode = 'en_GB';
-}
-
-variables.language = new I18n(variables.languagecode, {
-  de_DE: translations.de_DE,
-  en_GB: translations.en_GB,
-  en_US: translations.en_US,
-  es: translations.es,
-  es_419: translations.es_419,
-  fr: translations.fr,
-  nl: translations.nl,
-  no: translations.no,
-  ru: translations.ru,
-  zh_CN: translations.zh_CN,
-  id_ID: translations.id_ID,
-  tr_TR: translations.tr_TR,
-  pt_BR: translations.pt_BR,
-});
+variables.language = translations(languagecode);
+variables.languagecode = languagecode;
+document.documentElement.lang = languagecode.replace('_', '-');
 
 variables.getMessage = (text, optional) =>
   variables.language.getMessage(variables.languagecode, text, optional || {});
 
-// set html language tag
-if (variables.languagecode !== 'en_GB' || variables.languagecode !== 'en_US') {
-  document.documentElement.lang = variables.languagecode.split('_')[0];
-}
-
 if (localStorage.getItem('stats') === 'true') {
   variables.stats = Stats;
 }
diff --git a/src/modules/helpers/experimental.js b/src/modules/helpers/experimental.js
index 3755d952..dcae1bdd 100644
--- a/src/modules/helpers/experimental.js
+++ b/src/modules/helpers/experimental.js
@@ -1,4 +1,3 @@
-// mainly this is just to make life easier when debugging stuff like hover
 export default function ExperimentalInit() {
   if (localStorage.getItem('debug') === 'true') {
     document.onkeydown = (e) => {
diff --git a/src/modules/translations.js b/src/modules/translations.js
index d95da6cb..52e3ec15 100644
--- a/src/modules/translations.js
+++ b/src/modules/translations.js
@@ -1,3 +1,5 @@
+import I18n from '@eartharoid/i18n';
+
 import * as de_DE from '../translations/de_DE.json';
 import * as en_GB from '../translations/en_GB.json';
 import * as en_US from '../translations/en_US.json';
@@ -12,20 +14,22 @@ import * as id_ID from '../translations/id_ID.json';
 import * as tr_TR from '../translations/tr_TR.json';
 import * as pt_BR from '../translations/pt_BR.json';
 
-const translations = {
-  de_DE,
-  en_GB,
-  en_US,
-  es,
-  es_419,
-  fr,
-  nl,
-  no,
-  ru,
-  zh_CN,
-  id_ID,
-  tr_TR,
-  pt_BR,
-};
+export default function initTranslations(locale) {
+  const i18n = new I18n(locale, {
+    de_DE,
+    en_GB,
+    en_US,
+    es,
+    es_419,
+    fr,
+    nl,
+    no,
+    ru,
+    zh_CN,
+    id_ID,
+    tr_TR,
+    pt_BR,
+  });
 
-export default translations;
+  return i18n;
+}