fix: upgrading from 5.0.1 to latest now works, code style changes etc

manifest/chrome.json

@@ -1,5 +1,5 @@
 {
-  "manifest_version": 3,
+  "manifest_version": 2,
   "offline_enabled": true,
   "name": "Mue",
   "description": "Fast, open and free-to-use new tab page for modern browsers.",

manifest/firefox.json

@@ -1,5 +1,5 @@
 {
-  "manifest_version": 3,
+  "manifest_version": 2,
   "name": "Mue",
   "description": "Fast, open and free-to-use new tab page for modern browsers.",
   "version": "5.0.1",

package.json

@@ -28,7 +28,7 @@
     "weather-icons-react": "1.2.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.14.5",
+    "@babel/core": "^7.14.6",
     "@babel/eslint-parser": "^7.14.5",
     "@babel/plugin-proposal-class-properties": "^7.14.5",
     "@babel/plugin-transform-react-constant-elements": "^7.13.15",
@@ -43,10 +43,10 @@
     "eslint-config-react-app": "^6.0.0",
     "html-webpack-plugin": "^5.3.1",
     "mini-css-extract-plugin": "^1.6.0",
-    "sass": "^1.34.1",
-    "sass-loader": "^12.1.0",
+    "sass": "^1.35.1",
+    "sass-loader": "^7.3.1",
     "source-map-loader": "^3.0.0",
-    "webpack": "^5.38.1",
+    "webpack": "^5.39.1",
     "webpack-cli": "^4.7.2",
     "webpack-dev-server": "^3.11.2"
   },

src/App.jsx

@@ -17,7 +17,8 @@ export default class App extends React.PureComponent {
     }
 
     // 4.0 -> 5.0 (the key below is only on 5.0)
-    if (!localStorage.getItem('order')) {
+    // now featuring 5.0 -> 5.1
+    if (!localStorage.getItem('order') || !localStorage.getItem('autocompleteProvider')) {
       SettingsFunctions.moveSettings();
       window.location.reload();
     }    

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

@@ -28,11 +28,12 @@ export default class About extends React.PureComponent {
     let contributors, sponsors, photographers, versionData;
 
     try {
+      versionData = await (await fetch(window.constants.GITHUB_URL + '/repos/mue/mue/releases', { signal: this.controller.signal })).json();
+
       contributors = await (await fetch(window.constants.GITHUB_URL + '/repos/mue/mue/contributors', { signal: this.controller.signal })).json();
       sponsors = (await (await fetch(window.constants.SPONSORS_URL + '/list', { signal: this.controller.signal })).json()).sponsors;
+
       photographers = await (await fetch(window.constants.API_URL + '/images/photographers', { signal: this.controller.signal })).json();
-  
-      versionData = await (await fetch(window.constants.GITHUB_URL + '/repos/mue/mue/releases', { signal: this.controller.signal })).json();
     } catch (e) {
       if (this.controller.signal.aborted === true) {
         return;

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

@@ -11,16 +11,16 @@ export default function AppearanceSettings() {
 
   const themeOptions = [
     {
-      'name': appearance.theme.auto,
-      'value': 'auto'
+      name: appearance.theme.auto,
+      value: 'auto'
     },
     {
-      'name': appearance.theme.light,
-      'value': 'light'
+      name: appearance.theme.light,
+      value: 'light'
     }, 
     {
-      'name': appearance.theme.dark,
-      'value': 'dark'
+      name: appearance.theme.dark,
+      value: 'dark'
     }
   ];
 

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

@@ -27,7 +27,9 @@ export default class Changelog extends React.PureComponent {
 
     let date = new Date(data.date);
     date = date.toLocaleDateString(window.languagecode.replace('_', '-'), { 
-      year: 'numeric', month: 'long', day: 'numeric' 
+      year: 'numeric', 
+      month: 'long', 
+      day: 'numeric' 
     });
 
     this.setState({

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

@@ -23,12 +23,12 @@ export default class TimeSettings extends React.PureComponent {
 
     const digitalOptions = [
       {
-        'name': time.digital.twentyfourhour,
-        'value': 'twentyfourhour'
+        name: time.digital.twentyfourhour,
+        value: 'twentyfourhour'
       },
       {
-        'name': time.digital.twelvehour,
-        'value': 'twelvehour'
+        name: time.digital.twelvehour,
+        value: 'twelvehour'
       }
     ];
 

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

@@ -49,16 +49,16 @@ export default class TimeSettings extends React.PureComponent {
 
     const tempFormat = [
       {
-        'name': language.temp_format.celsius + ' (°C)',
-        'value': 'celsius'
+        name: language.temp_format.celsius + ' (°C)',
+        value: 'celsius'
       },
       {
-        'name': language.temp_format.fahrenheit + ' (°F)',
-        'value': 'fahrenheit'
+        name: language.temp_format.fahrenheit + ' (°F)',
+        value: 'fahrenheit'
       },
       {
-        'name': language.temp_format.kelvin + ' (K)',
-        'value': 'kelvin'
+        name: language.temp_format.kelvin + ' (K)',
+        value: 'kelvin'
       }
     ];