chore: run prettier, refactor translations

2026-07-07 14:17:09 +02:00 · 2023-03-14 23:53:05 +00:00
parent 0990774b41
commit ad39f4a732
11 changed files with 114 additions and 151 deletions
--- 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"
-            }
-        }
-    ]
-}
+  "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"
+      }
+    }
+  ]
+}
--- 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"
-        }
-    ]
-}
+  "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"
+    }
+  ]
+}
--- 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
-    }
-}
+  "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
+  }
+}
--- 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>
--- 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' }}
--- 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 ? (
--- 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')}
--- 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;

--- 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;
 }
--- 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) => {
--- 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;
+}