fix: translations

Co-authored-by: David Ralph <me@davidcralph.co.uk>

src/components/modals/main/settings/Radio.jsx

@@ -10,7 +10,7 @@ import {
 } from '@mui/material';
 
 import EventBus from 'modules/helpers/eventbus';
-import translations from 'modules/translations';
+import { translations } from 'modules/translations';
 
 class Radio extends PureComponent {
   constructor(props) {

src/components/modals/main/settings/sections/Stats.jsx

@@ -1,8 +1,9 @@
 /* eslint-disable array-callback-return */
 import variables from 'modules/variables';
 import { PureComponent } from 'preact/compat';
-import { MdShowChart } from 'react-icons/md';
+import { MdShowChart, MdRestartAlt } from 'react-icons/md';
 import { FaTrophy } from 'react-icons/fa';
+import { toast } from 'react-toastify';
 
 import achievementsData from 'modules/helpers/settings/achievements.json';
 import translations from 'modules/helpers/settings/achievement_translations/index';
@@ -66,6 +67,16 @@ export default class Stats extends PureComponent {
     return count;
   }
 
+  resetStats() {
+    localStorage.setItem('statsData', JSON.stringify({}));
+    this.setState({
+      stats: {},
+    });
+    toast.success('Stats reset');
+    this.getAchievements();
+    this.forceUpdate();
+  }
+
   componentDidMount() {
     this.getAchievements();
     this.forceUpdate();
@@ -167,6 +178,9 @@ export default class Stats extends PureComponent {
               </div>
             </div>
           </div>
+          <div className="statsReset">
+          <button onClick={() => this.resetStats()}><MdRestartAlt /> {variables.getMessage('modals.main.settings.buttons.reset')}</button>
+        </div>
           <div className="statSection leftPanel">
             <span className="title">
               {variables.getMessage('modals.main.settings.sections.stats.achievements')}

src/components/modals/welcome/welcome.scss

@@ -140,7 +140,7 @@
       .darkTheme,
       .legacyStyle,
       .newStyle {
-        width: 40%;
+        width: 50%;
         padding: 50px;
 
         span {

src/index.jsx

@@ -13,10 +13,10 @@ import './scss/index.scss';
 // the toast css is based on default so we need to import it
 import 'react-toastify/dist/ReactToastify.min.css';
 
-import translations from './modules/translations';
+import { initTranslations } from './modules/translations';
 
 const languagecode = localStorage.getItem('language') || 'en_GB';
-variables.language = translations(languagecode);
+variables.language = initTranslations(languagecode);
 variables.languagecode = languagecode;
 document.documentElement.lang = languagecode.replace('_', '-');
 

src/modules/translations.js

@@ -14,14 +14,13 @@ 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';
 
-
 /**
  * Initialise the i18n object.
  * The i18n object is then returned.
  * @param locale - The locale to use.
  * @returns The i18n object.
  */
-export default function initTranslations(locale) {
+export function initTranslations(locale) {
   const i18n = new I18n(locale, {
     de_DE,
     en_GB,
@@ -39,4 +38,20 @@ export default function initTranslations(locale) {
   });
 
   return i18n;
+}
+
+export const translations = {
+    de_DE,
+    en_GB,
+    en_US,
+    es,
+    es_419,
+    fr,
+    nl,
+    no,
+    ru,
+    zh_CN,
+    id_ID,
+    tr_TR,
+    pt_BR,
 }