feat(translations): first half of 7.0 translation support

src/components/modals/ErrorBoundary.jsx

@@ -49,9 +49,19 @@ export default class ErrorBoundary extends PureComponent {
             </span>
             <div className="buttonsRow">
               {this.state.showReport ? (
-                <button onClick={() => this.reportError()}>Send Error Report</button>
+                <button onClick={() => this.reportError()}>
+                  {variables.language.getMessage(
+                    variables.languagecode,
+                    'modals.main.error_boundary.report_error',
+                  )}
+                </button>
               ) : (
-                <span className="subtitle">Sent!</span>
+                <span className="subtitle">
+                  {variables.language.getMessage(
+                    variables.languagecode,
+                    'modals.main.error_boundary.sent',
+                  )}
+                </span>
               )}
               <button className="refresh" onClick={() => window.location.reload()}>
                 {variables.language.getMessage(

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

@@ -25,7 +25,7 @@ export default class FileUpload extends PureComponent {
         const settingsSize = new TextEncoder().encode(JSON.stringify(settings)).length;
         if (videoCheck(file) === true) {
           if (settingsSize + file.size > 4850000) {
-            return toast('Not enough storage!');
+            return toast(this.getMessage('toasts.no_storage'));
           }
 
           return this.props.loadFunction(file);
@@ -34,7 +34,7 @@ export default class FileUpload extends PureComponent {
         // todo: change number
         compressAccurately(file, 200).then(async (res) => {
           if (settingsSize + res.size > 4850000) {
-            return toast('Not enough storage!');
+            return toast(this.getMessage('toasts.no_storage'));
           }
 
           this.props.loadFunction({

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

@@ -38,7 +38,7 @@ export default class Header extends PureComponent {
               )
             }
           >
-            <MdHelpOutline /> More Info
+            <MdHelpOutline /> {getMessage('modals.main.settings.sections.header.more_info')}
           </span>
           <span
             className="link"
@@ -49,13 +49,13 @@ export default class Header extends PureComponent {
               )
             }
           >
-            <MdFlag /> Report Issue
+            <MdFlag /> {getMessage('modals.main.settings.sections.header.report_issue')}
           </span>
         </div>
         {this.props.switch ? (
           <SettingsItem
             title={getMessage('modals.main.settings.enabled')}
-            subtitle="Choose whether or not to show this widget"
+            subtitle={getMessage('modals.main.settings.sections.header.enabled')}
           >
             <Switch
               name={this.props.setting}
@@ -69,7 +69,7 @@ export default class Header extends PureComponent {
         {this.props.zoomSetting ? (
           <SettingsItem
             title={getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')}
-            subtitle="Slider to control how large the widget is"
+            subtitle={getMessage('modals.main.settings.sections.header.size')}
           >
             <Slider
               name={this.props.zoomSetting}

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

@@ -19,7 +19,12 @@ export default function ResetModal({ modalClose }) {
             'modals.main.settings.sections.advanced.reset_modal.title',
           )}
         </span>
-        <Tooltip title="Close">
+        <Tooltip
+          title={variables.language.getMessage(
+            variables.languagecode,
+            'modals.main.settings.sections.advanced.reset_modal.cancel',
+          )}
+        >
           <div className="close" onClick={modalClose}>
             <MdClose />
           </div>
@@ -40,11 +45,17 @@ export default function ResetModal({ modalClose }) {
       <div className="resetFooter">
         <button className="textButton" onClick={modalClose}>
           <MdClose />
-          Close
+          {variables.language.getMessage(
+            variables.languagecode,
+            'modals.main.settings.sections.advanced.reset_modal.cancel',
+          )}
         </button>
         <button onClick={() => reset()}>
           <MdRestartAlt />
-          Reset
+          {variables.language.getMessage(
+            variables.languagecode,
+            'modals.main.settings.buttons.reset',
+          )}
         </button>
       </div>
     </div>

src/components/modals/main/tabs/backend/Tabs.jsx

@@ -89,21 +89,37 @@ export default class Tabs extends PureComponent {
                 onClick={() => this.props.changeTab('settings')}
               >
                 <MdSettings />
-                <span>Settings</span>
+                <span>
+                  {' '}
+                  {variables.language.getMessage(
+                    variables.languagecode,
+                    'modals.main.navbar.settings',
+                  )}
+                </span>
               </button>
               <button
                 className={'navbar-item' + addonsActive}
                 onClick={() => this.props.changeTab('addons')}
               >
                 <MdOutlineExtension />
-                <span>Add-ons</span>
+                <span>
+                  {variables.language.getMessage(
+                    variables.languagecode,
+                    'modals.main.navbar.addons',
+                  )}
+                </span>
               </button>
               <button
                 className={'navbar-item' + marketplaceActive}
                 onClick={() => this.props.changeTab('marketplace')}
               >
                 <MdOutlineShoppingBasket />
-                <span>Marketplace</span>
+                <span>
+                  {variables.language.getMessage(
+                    variables.languagecode,
+                    'modals.main.navbar.marketplace',
+                  )}
+                </span>
               </button>
             </div>
             {this.props.children.map((tab) => {