Fix: Various bugs

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

src/features/misc/sections/Advanced.jsx

@@ -24,34 +24,36 @@ function AdvancedOptions() {
 
   const Data = () => {
     return (
-      <>
-        {localStorage.getItem('welcomePreview') !== 'true' && (
-          <div className="settingsRow">
-            <div className="content">
-              <span className="title">
-                {variables.getMessage('modals.main.settings.sections.advanced.data')}
-              </span>
-              <span className="subtitle">
-                {variables.getMessage('modals.main.settings.sections.advanced.data_subtitle')}
-              </span>
-            </div>
-            <div className="action activityButtons">
-              <button onClick={() => setResetModal(true)}>
-                {variables.getMessage('modals.main.settings.buttons.reset')}
-                <ResetIcon />
-              </button>
-              <button onClick={() => exportSettings()}>
-                {variables.getMessage('modals.main.settings.buttons.export')}
-                <ExportIcon />
-              </button>
-              <button onClick={() => document.getElementById('file-input').click()}>
-                {variables.getMessage('modals.main.settings.buttons.import')}
-                <ImportIcon />
-              </button>
-            </div>
+      localStorage.getItem('welcomePreview') !== 'true' && (
+        <Row final={true}>
+          <Content
+            title={variables.getMessage('modals.main.settings.sections.advanced.data')}
+            subtitle={variables.getMessage(
+              'modals.main.settings.sections.advanced.data_description',
+            )}
+          />
+          <div className="action activityButtons">
+            <button onClick={() => setResetModal(true)}>
+              {variables.getMessage('modals.main.settings.buttons.reset')}
+              <ResetIcon />
+            </button>
+            <button onClick={() => exportSettings()}>
+              {variables.getMessage('modals.main.settings.buttons.export')}
+              <ExportIcon />
+            </button>
+            <button onClick={() => document.getElementById('file-input').click()}>
+              {variables.getMessage('modals.main.settings.buttons.import')}
+              <ImportIcon />
+            </button>
           </div>
-        )}
-      </>
+          <FileUpload
+            id="file-input"
+            accept="application/json"
+            type="settings"
+            loadFunction={(e) => importSettings(e)}
+          />
+        </Row>
+      )
     );
   };
 
@@ -90,9 +92,7 @@ function AdvancedOptions() {
         <>
           <Section
             title={variables.getMessage(`${ADVANCED_SECTION}.data`)}
-            subtitle={variables.getMessage(
-              'modals.main.settings.sections.appearance.accessibility.description',
-            )}
+            subtitle={variables.getMessage(`${ADVANCED_SECTION}.data_subtitle`)}
             onClick={() => setData(true)}
             icon={<MdDataUsage />}
           />
@@ -142,12 +142,6 @@ function AdvancedOptions() {
               <Text name="tabName" default={variables.getMessage('tabname')} category="other" />
             </Action>
           </Row>
-          <FileUpload
-            id="file-input"
-            accept="application/json"
-            type="settings"
-            loadFunction={(e) => importSettings(e)}
-          />
           <Row>
             <Content
               title={variables.getMessage('modals.main.settings.sections.advanced.custom_css')}

src/features/misc/sections/Appearance.jsx

@@ -143,7 +143,7 @@ function AppearanceOptions() {
 
   const WidgetStyle = () => {
     return (
-      <Row>
+      <Row final={true}>
         <Content
           title={variables.getMessage('modals.main.settings.sections.appearance.style.title')}
           subtitle={variables.getMessage(

src/features/misc/sections/Stats.jsx

@@ -14,7 +14,7 @@ import { getLocalisedAchievementData, achievements, checkAchievements } from 'ut
 
 class Stats extends PureComponent {
   constructor() {
-    super();
+  super();
     this.state = {
       stats: JSON.parse(localStorage.getItem('statsData')) || {},
       achievements,
@@ -193,7 +193,7 @@ class Stats extends PureComponent {
                 }
               })}
             </div>
-            <span className="title">Locked</span>
+            <span className="title">{variables.getMessage(`${STATS_SECTION}.locked`)}</span>
             <div className="achievementsGrid preferencesInactive">
               {this.state.achievements.map((achievement, index) => {
                 if (!achievement.achieved) {