From d762a7c504abd8f71da541e3319021e80f88b5f5 Mon Sep 17 00:00:00 2001
From: alexsparkes <alexsparkes@gmail.com>
Date: Sat, 29 Oct 2022 22:28:17 +0100
Subject: [PATCH] fix: sideload error modal styling

Co-authored-by: David Ralph <me@davidcralph.co.uk>
---
 .../main/marketplace/SideloadFailedModal.jsx  | 29 ++++++++++++-------
 .../main/marketplace/sections/Added.jsx       | 23 ++-------------
 .../modals/main/scss/marketplace/_main.scss   |  7 -----
 .../widgets/background/Background.jsx         |  6 ++--
 4 files changed, 22 insertions(+), 43 deletions(-)

diff --git a/src/components/modals/main/marketplace/SideloadFailedModal.jsx b/src/components/modals/main/marketplace/SideloadFailedModal.jsx
index a7b36f22..6fd76ce2 100644
--- a/src/components/modals/main/marketplace/SideloadFailedModal.jsx
+++ b/src/components/modals/main/marketplace/SideloadFailedModal.jsx
@@ -1,19 +1,26 @@
 import variables from 'modules/variables';
 import { MdClose } from 'react-icons/md';
+import Tooltip from '../../../helpers/tooltip/Tooltip';
 
 export default function SideloadFailedModal({ modalClose, reason }) {
   return (
-    <>
-      <h1>{variables.getMessage('modals.main.error_boundary.title')}</h1>
-      <span>{variables.getMessage('modals.main.addons.sideload.failed')}</span>
-      <br />
-      <br />
-      <span>{reason}</span>
-      <div className="resetFooter">
-        <button className="round import" style={{ marginLeft: '-30px' }} onClick={modalClose}>
-          <MdClose />
-        </button>
+    <div className="smallModal">
+      <div className="shareHeader">
+      <span className="title">
+      {variables.getMessage('modals.main.error_boundary.title')}
+        </span>
+        <Tooltip
+          title={variables.getMessage('modals.main.settings.sections.advanced.reset_modal.cancel')}
+        >
+          <div className="close" onClick={modalClose}>
+            <MdClose />
+          </div>
+        </Tooltip>
       </div>
-    </>
+      <span>{variables.getMessage('modals.main.addons.sideload.failed')}</span>
+      <span className="subtitle">
+        {reason}
+      </span>
+    </div>
   );
 }
diff --git a/src/components/modals/main/marketplace/sections/Added.jsx b/src/components/modals/main/marketplace/sections/Added.jsx
index 9f4f222d..cfa93f85 100644
--- a/src/components/modals/main/marketplace/sections/Added.jsx
+++ b/src/components/modals/main/marketplace/sections/Added.jsx
@@ -29,7 +29,6 @@ export default class Added extends PureComponent {
         </button>
       ),
     };
-    this.customDnd = createRef(null);
   }
 
   installAddon(input) {
@@ -164,24 +163,6 @@ export default class Added extends PureComponent {
 
   componentDidMount() {
     this.sortAddons(localStorage.getItem('sortAddons'), false);
-
-    const dnd = this.customDnd.current;
-    dnd.ondragover = dnd.ondragenter = (e) => {
-      e.preventDefault();
-    };
-
-    dnd.ondrop = (e) => {
-      e.preventDefault();
-      const reader = new FileReader();
-      const file = e.dataTransfer.files[0];
-
-      reader.readAsText(file, 'UTF-8');
-      reader.onload = (e) => {
-        console.log(e.target.result)
-        return this.installAddon(e.target.result);
-      };
-      e.preventDefault();
-    };
   }
 
   render() {
@@ -191,7 +172,7 @@ export default class Added extends PureComponent {
           closeTimeoutMS={100}
           onRequestClose={() => this.setState({ showFailed: false })}
           isOpen={this.state.showFailed}
-          className="Modal resetmodal mainModal sideloadModal"
+          className="Modal resetmodal mainModal resetmodal"
           overlayClassName="Overlay resetoverlay"
           ariaHideApp={false}
         >
@@ -260,7 +241,6 @@ export default class Added extends PureComponent {
             <button
               className="sideload"
               onClick={() => document.getElementById('file-input').click()}
-              ref={this.customDnd}
             >
               {variables.getMessage('modals.main.addons.sideload.title')}
               <MdCode />
@@ -283,6 +263,7 @@ export default class Added extends PureComponent {
         </div>
         <Items
           items={this.state.installed}
+          filter=""
           toggleFunction={(input) => this.toggle('item', input)}
         />
       </>
diff --git a/src/components/modals/main/scss/marketplace/_main.scss b/src/components/modals/main/scss/marketplace/_main.scss
index 0408f37e..9466f9ae 100644
--- a/src/components/modals/main/scss/marketplace/_main.scss
+++ b/src/components/modals/main/scss/marketplace/_main.scss
@@ -259,13 +259,6 @@ p.author {
   cursor: pointer;
 }
 
-/* sideload failed modal */
-.sideloadModal {
-  min-width: 250px;
-  max-width: 250px;
-  overflow-x: hidden;
-}
-
 .returnButton {
   display: grid;
   place-items: center;
diff --git a/src/components/widgets/background/Background.jsx b/src/components/widgets/background/Background.jsx
index 643b6563..ff8da811 100644
--- a/src/components/widgets/background/Background.jsx
+++ b/src/components/widgets/background/Background.jsx
@@ -257,10 +257,8 @@ export default class Background extends PureComponent {
             (localStorage.getItem('backgroundchange') === null && this.state.firstTime === true)
           ) {
             localStorage.setItem('marketplaceNumber', randomNumber);
-            console.log("APPLE BOTTOM JEANS")
-            console.log(this.state.firstTime)
-            this.setState({ firstTime: false })
             this.setState({
+              firstTime: false,
               url: randomPhoto.url.default,
               type: 'photo_pack',
               photoInfo: {
@@ -446,7 +444,7 @@ export default class Background extends PureComponent {
     this.interval = setInterval(() => {
       const targetTime = Number(Number(localStorage.getItem('backgroundStartTime')) + Number(test));
       const currentTime = Number(Date.now());
-      const type = localStorage.getItem('backgroundType');
+      const type = localStorage.getItem('backgroundType'); 
 
       if (test !== null && test !== 'refresh') {
         if (currentTime >= targetTime) {