From 5f9bc4a94be6b4fe5da6b02500fbdb5bfc34e6a4 Mon Sep 17 00:00:00 2001
From: David Ralph <ohlookitsderpy@protonmail.com>
Date: Wed, 31 Mar 2021 12:21:37 +0100
Subject: [PATCH] fix: Reset modal now works, widget order has reset button etc

---
 src/components/modals/main/scss/index.scss    | 10 +++++
 .../modals/main/settings/ResetModal.jsx       | 15 ++++---
 .../modals/main/settings/sections/About.jsx   | 15 +++++--
 .../main/settings/sections/Advanced.jsx       |  2 +-
 .../modals/main/settings/sections/Order.jsx   | 10 ++++-
 src/components/modals/main/tabs/Settings.jsx  |  5 ++-
 .../modals/main/tabs/backend/Tab.jsx          | 39 ++++++++++++-------
 .../modals/main/tabs/backend/Tabs.jsx         |  2 +-
 src/modules/constants.js                      |  1 +
 src/modules/default_settings.json             |  4 ++
 src/translations/en_GB.json                   |  1 +
 11 files changed, 75 insertions(+), 29 deletions(-)

diff --git a/src/components/modals/main/scss/index.scss b/src/components/modals/main/scss/index.scss
index 9b112c07..a3052a34 100644
--- a/src/components/modals/main/scss/index.scss
+++ b/src/components/modals/main/scss/index.scss
@@ -325,3 +325,13 @@ li {
   border-radius: 50%;
   padding-right: 5px;
 }
+
+.resetmodal {
+  min-height: 300px !important;
+  max-width: 300px !important;
+}
+
+.resetfooter {
+  position: absolute;
+  bottom: 20px;
+}
\ No newline at end of file
diff --git a/src/components/modals/main/settings/ResetModal.jsx b/src/components/modals/main/settings/ResetModal.jsx
index b898cacd..51951193 100644
--- a/src/components/modals/main/settings/ResetModal.jsx
+++ b/src/components/modals/main/settings/ResetModal.jsx
@@ -1,13 +1,16 @@
 import React from 'react';
 
+import SettingsFunctions from '../../../../modules/helpers/settings';
+
 export default function ResetModal(props) {
   return (
-    <div className='welcomeContent'>
-      <span className='closeModal' onClick={props.modalClose}>&times;</span>
-      <div className='welcomeModalText'>
-        reset text
-        <button className='close' onClick={props.modalClose}>yes</button>
-        <button className='close' onClick={props.modalClose}>no</button>
+    <div className='resetmodal'>
+      <h3 style={{'textAlign': 'center'}}>WARNING</h3>
+      <h4>Do you want to reset Mue?</h4>
+      <p>This will delete all data. If you want to keep your data and preferences, please export first.</p>
+      <div className='resetfooter'>
+        <button className='reset' onClick={() => SettingsFunctions.setDefaultSettings('reset')}>Reset</button>
+        <button className='import' onClick={props.modalClose}>Cancel</button>
       </div>
     </div>
   );
diff --git a/src/components/modals/main/settings/sections/About.jsx b/src/components/modals/main/settings/sections/About.jsx
index 0ac658d6..2add4761 100644
--- a/src/components/modals/main/settings/sections/About.jsx
+++ b/src/components/modals/main/settings/sections/About.jsx
@@ -18,10 +18,19 @@ export default class About extends React.PureComponent {
   }
 
   async getGitHubData() {
-    const contributors = await (await fetch('https://api.github.com/repos/mue/mue/contributors')).json();
-    const { sponsors } = await (await fetch(window.constants.SPONSORS_URL + '/list')).json();
+    let contributors, sponsors, versionData;
+    try {
+      contributors = await (await fetch(window.constants.GITHUB_URL + '/repos/mue/mue/contributors')).json();
+      sponsors = (await (await fetch(window.constants.SPONSORS_URL + '/list')).json()).sponsors;
+  
+      versionData = await (await fetch(window.constants.GITHUB_URL + '/repos/mue/mue/releases')).json();
+    } catch (e) {
+      return this.setState({
+        update: 'Failed to get update information',
+        loading: 'An error occurred'
+      });
+    }
 
-    const versionData = await (await fetch('https://api.github.com/repos/mue/mue/releases')).json();
     const newVersion = versionData[0].tag_name;
 
     let updateMsg = this.language.version.no_update;
diff --git a/src/components/modals/main/settings/sections/Advanced.jsx b/src/components/modals/main/settings/sections/Advanced.jsx
index cca59185..fd2fa770 100644
--- a/src/components/modals/main/settings/sections/Advanced.jsx
+++ b/src/components/modals/main/settings/sections/Advanced.jsx
@@ -52,7 +52,7 @@ export default class AdvancedSettings extends React.PureComponent {
         <p>{advanced.experimental_warning}</p>
         <Checkbox name='experimental' text={this.language.enabled} />
 
-        <Modal onRequestClose={() => this.setState({ resetModal: false })} isOpen={this.state.resetModal} className={'modal'} overlayClassName={'Overlay'} ariaHideApp={false}>
+        <Modal onRequestClose={() => this.setState({ resetModal: false })} isOpen={this.state.resetModal} className={'Modal resetmodal'} overlayClassName={'Overlay'} ariaHideApp={false}>
           <ResetModal modalClose={() => this.setState({ resetModal: false })} />
         </Modal>
       </>
diff --git a/src/components/modals/main/settings/sections/Order.jsx b/src/components/modals/main/settings/sections/Order.jsx
index 9f6632f5..beeff2bb 100644
--- a/src/components/modals/main/settings/sections/Order.jsx
+++ b/src/components/modals/main/settings/sections/Order.jsx
@@ -26,7 +26,14 @@ export default class OrderSettings extends React.PureComponent {
     this.setState(({items}) => ({
       items: arrayMove(items, oldIndex, newIndex)
     }));
-  };
+  }
+
+  reset = () => {
+    localStorage.setItem('order', JSON.stringify(['greeting', 'time', 'quote', 'date']));
+    this.setState({
+      items: JSON.parse(localStorage.getItem('order'))
+    });
+  }
 
   componentDidUpdate() {
     localStorage.setItem('order', JSON.stringify(this.state.items));
@@ -36,6 +43,7 @@ export default class OrderSettings extends React.PureComponent {
     return (
       <>
         <h2>Order</h2>
+        <span className='modalLink' onClick={this.reset}>Reset</span>
         <SortableContainer onSortEnd={this.onSortEnd}>
           {this.state.items.map((value, index) => (
             <SortableItem key={`item-${value}`} index={index} value={value} />
diff --git a/src/components/modals/main/tabs/Settings.jsx b/src/components/modals/main/tabs/Settings.jsx
index 97528670..9a7de327 100644
--- a/src/components/modals/main/tabs/Settings.jsx
+++ b/src/components/modals/main/tabs/Settings.jsx
@@ -11,6 +11,7 @@ import Background from '../settings/sections/background/Background';
 import Advanced from '../settings/sections/Advanced';
 import Changelog from '../settings/sections/Changelog';
 import Order from '../settings/sections/Order';
+import Experimental from '../settings/sections/Experimental';
 
 import Tabs from './backend/Tabs';
 
@@ -25,10 +26,10 @@ export default function Settings() {
         <div label={language.background.title}><Background/></div>
         <div label={language.search.title}><Search/></div>
         <div label={language.appearance.title}><Appearance/></div>
-        <div label='Order'><Order/></div>
+        <div label={language.order}><Order/></div>
         <div label={language.language.title}><Language/></div>
         <div label={language.advanced.title}><Advanced/></div>
-        <div label='Experimental'></div>
+        <div label={language.experimental.title}><Experimental/></div>
         <div label={language.changelog}><Changelog/></div>
         <div label={language.about.title}><About/></div>
       </Tabs>
diff --git a/src/components/modals/main/tabs/backend/Tab.jsx b/src/components/modals/main/tabs/backend/Tab.jsx
index 97184053..4cb01c63 100644
--- a/src/components/modals/main/tabs/backend/Tab.jsx
+++ b/src/components/modals/main/tabs/backend/Tab.jsx
@@ -34,26 +34,29 @@ export default function Tab(props) {
     }
   }
 
+  const language = window.language.modals.main.settings.sections;
+  const navbarlanguage = window.language.modals.main.navbar;
+
   let icon, divider;
   switch (props.label) {
     // Navbar
-    case 'Settings': icon = <Settings/>; break;
-    case 'My Add-ons': icon = <Addons/>; break;
-    case 'Marketplace': icon = <Marketplace/>; break;
+    case navbarlanguage.settings: icon = <Settings/>; break;
+    case navbarlanguage.addons: icon = <Addons/>; break;
+    case navbarlanguage.marketplace: icon = <Marketplace/>; break;
 
     // Settings
-    case 'Time': icon = <Time/>; break;
-    case 'Greeting': icon = <Greeting/>; break;
-    case 'Quote': icon = <Quote/>; break;
-    case 'Background': icon = <Background/>; break;
-    case 'Search': icon = <Search/>; break;
-    case 'Appearance': icon = <Appearance/>; break;
-    case 'Order': icon = <Order/>; break;
-    case 'Language': icon = <Language/>; divider = true; break;
-    case 'Advanced': icon = <Settings/>; break;
-    case 'Experimental': icon = <Experimental/>; divider = true; break;
-    case 'Change Log': icon = <Changelog/>; break;
-    case 'About': icon = <About/>; break;
+    case language.time.title: icon = <Time/>; break;
+    case language.greeting.title: icon = <Greeting/>; break;
+    case language.quote.title: icon = <Quote/>; break;
+    case language.background.title: icon = <Background/>; break;
+    case language.search.title: icon = <Search/>; break;
+    case language.appearance.title: icon = <Appearance/>; break;
+    case language.order: icon = <Order/>; break;
+    case language.language.title: icon = <Language/>; divider = true; break;
+    case language.advanced.title: icon = <Settings/>; break;
+    case language.experimental.title: icon = <Experimental/>; divider = true; break;
+    case language.changelog: icon = <Changelog/>; break;
+    case language.about.title: icon = <About/>; break;
 
     // Store
     case 'Photo Packs': icon = <Background/>; break;
@@ -63,6 +66,12 @@ export default function Tab(props) {
     default: break;
   }
 
+  if (props.label === language.experimental.title) {
+    if (localStorage.getItem('experimental') === 'false') {
+      return <hr/>;
+    }
+  }
+
   return (
     <>
       <li className={className} onClick={() => props.onClick(props.label)}>
diff --git a/src/components/modals/main/tabs/backend/Tabs.jsx b/src/components/modals/main/tabs/backend/Tabs.jsx
index bdd12d0e..6b5591a4 100644
--- a/src/components/modals/main/tabs/backend/Tabs.jsx
+++ b/src/components/modals/main/tabs/backend/Tabs.jsx
@@ -21,7 +21,7 @@ export default class Tabs extends React.PureComponent {
   render() {
     let className = 'sidebar';
     let tabClass = 'tab-content';
-    let optionsText = (<h1>Options</h1>);
+    let optionsText = (<h1>{window.language.modals.main.title}</h1>);
 
     if (this.props.navbar) {
       className = 'modalNavbar';
diff --git a/src/modules/constants.js b/src/modules/constants.js
index 1d9a206e..1cebb41c 100644
--- a/src/modules/constants.js
+++ b/src/modules/constants.js
@@ -3,6 +3,7 @@ export const UNSPLASH_URL = 'https://unsplash.muetab.com';
 export const MARKETPLACE_URL = 'http://127.0.0.1:8080';
 export const WEBSITE_URL = 'https://muetab.com';
 export const SPONSORS_URL = 'https://sponsors.muetab.com';
+export const GITHUB_URL = 'https://api.github.com'
 export const OFFLINE_IMAGES = 20;
 export const BETA_VERSION = false;
 export const VERSION = '5.0'; 
diff --git a/src/modules/default_settings.json b/src/modules/default_settings.json
index 068bf0a6..4fd963d9 100644
--- a/src/modules/default_settings.json
+++ b/src/modules/default_settings.json
@@ -138,5 +138,9 @@
   {
     "name": "timeformat",
     "value": "twentyfourhour"
+  },
+  {
+    "name": "experimental",
+    "value": false
   }
 ]
diff --git a/src/translations/en_GB.json b/src/translations/en_GB.json
index c712beba..3ad37453 100644
--- a/src/translations/en_GB.json
+++ b/src/translations/en_GB.json
@@ -142,6 +142,7 @@
               "milliseconds": "milliseconds"
             }
           },
+          "order": "Widget Order",
           "advanced": {
             "title": "Advanced",
             "offline_mode": "Offline Mode",