Co-authored-by: Alex Sparkes <[email protected]>

Co-authored-by: Isaac <[email protected]>
SamirPaulb · May 20, 2024 · e483ab4 · e483ab4
1 parent 4bf61f4
commit e483ab4
Show file tree

Hide file tree

Showing 21 changed files with 533 additions and 200 deletions.
diff --git a/src/components/Elements/MainModal/backend/Tab.jsx b/src/components/Elements/MainModal/backend/Tab.jsx
@@ -77,6 +77,7 @@ function Tab({ label, currentTab, onClick, navbarTab }) {
     variables.getMessage('modals.main.marketplace.all'),
     variables.getMessage('modals.main.settings.sections.experimental.title'),
   ].includes(label);
+
   const mue = [
     variables.getMessage('modals.main.marketplace.product.overview'),
     variables.getMessage('modals.main.addons.added'),

diff --git a/src/components/Elements/MainModal/scss/marketplace/_main.scss b/src/components/Elements/MainModal/scss/marketplace/_main.scss
@@ -395,6 +395,10 @@ p.author {
 
     .subtitle {
       color: #ccc !important;
+      overflow: hidden;
+      display: -webkit-box;
+      -webkit-box-orient: vertical;
+      -webkit-line-clamp: 5;
     }
   }
 

diff --git a/src/components/Elements/MainModal/scss/marketplace/modules/_item.scss b/src/components/Elements/MainModal/scss/marketplace/modules/_item.scss
@@ -47,7 +47,8 @@ p.description {
   }
 
   .header {
-    text-transform: uppercase;
+    // text-transform: uppercase;
+    font-size: small;
 
     @include themed {
       color: t($subColor);
@@ -68,6 +69,59 @@ p.description {
   }
 }
 
+.subHeader {
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  width: calc(100% - 30px);
+  gap: 25px;
+
+  .items {
+    margin-top: 0 !important;
+  }
+
+  .item {
+    flex: 1 0 40% !important;
+  }
+
+  .infoItem {
+    display: flex;
+    flex-flow: row;
+    align-items: center;
+    gap: 15px;
+    flex: 1 0 44%;
+
+    svg {
+      @include themed {
+        background-image: t($slightGradient);
+        box-shadow: t($boxShadow);
+      }
+
+      padding: 7px;
+      border-radius: 100%;
+    }
+
+    .text {
+      display: flex;
+      flex-flow: column;
+    }
+  }
+
+  .header {
+    font-size: small;
+
+    @include themed {
+      color: t($subColor);
+    }
+  }
+
+  span {
+    @include themed {
+      color: t($color);
+    }
+  }
+}
+
 .showMoreItems {
   display: flex;
   flex-flow: column;
@@ -81,3 +135,10 @@ p.description {
   flex-flow: column;
   gap: 15px;
 }
+
+.moreFromCurator {
+  margin-top: 50px;
+  display: flex;
+  flex-flow: column;
+  gap: 15px;
+}
diff --git a/src/components/Elements/ShareModal/ShareModal.jsx b/src/components/Elements/ShareModal/ShareModal.jsx
@@ -1,9 +1,9 @@
 import { memo } from 'react';
 import variables from 'config/variables';
 import { MdClose, MdEmail, MdContentCopy } from 'react-icons/md';
-import { FaTwitter, FaFacebookF } from 'react-icons/fa';
+import { FaFacebookF } from 'react-icons/fa';
 import { AiFillWechat } from 'react-icons/ai';
-import { SiTencentqq } from 'react-icons/si';
+import { SiTencentqq, SiX } from 'react-icons/si';
 import Tooltip from '../Tooltip/Tooltip';
 import { toast } from 'react-toastify';
 
@@ -49,13 +49,13 @@ function ShareModal({ modalClose, data }) {
           onClick={() =>
             window
               .open(
-                `https://twitter.com/intent/tweet?text=Check out ${data.name} on @getmue: ${data.url}`,
+                `https://x.com/intent/tweet?text=Check out ${data.name} on @getmue: ${data.url}`,
                 '_blank',
               )
               .focus()
           }
-          icon={<FaTwitter />}
-          tooltipTitle="Twitter"
+          icon={<SiX />}
+          tooltipTitle="X (Twitter)"
           type="icon"
         />
         <Button
@@ -65,7 +65,7 @@ function ShareModal({ modalClose, data }) {
               .focus()
           }
           icon={<FaFacebookF />}
-          tooltipTitle="Twitter"
+          tooltipTitle="Facebook"
           type="icon"
         />
         <Button

diff --git a/src/components/Form/Settings/ChipSelect/ChipSelect.jsx b/src/components/Form/Settings/ChipSelect/ChipSelect.jsx
@@ -25,35 +25,33 @@ function ChipSelect({ label, options }) {
   };
 
   return (
-    <div>
-      <FormControl>
-        <InputLabel id="chipSelect-label">{label}</InputLabel>
-        <Select
-          labelId="chipSelect-label"
-          id="chipSelect"
-          multiple
-          value={optionsSelected}
-          onChange={handleChange}
-          input={<OutlinedInput id="select-multiple-chip" label={label} />}
-          renderValue={(optionsSelected) => (
-            <Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 0.5 }}>
-              {optionsSelected.map((value) => (
-                <Chip key={value} label={value} />
-              ))}
-            </Box>
-          )}
-        >
-          {options.map((option) => (
-            <MenuItem key={option.name} value={option.name}>
-              {option.name.charAt(0).toUpperCase() + option.name.slice(1)}{' '}
-              {option.count && `(${option.count})`}
-            </MenuItem>
-          ))}
-        </Select>
-      </FormControl>
-    </div>
+    <FormControl>
+      <InputLabel id="chipSelect-label">{label}</InputLabel>
+      <Select
+        labelId="chipSelect-label"
+        id="chipSelect"
+        multiple
+        value={optionsSelected}
+        onChange={handleChange}
+        input={<OutlinedInput id="select-multiple-chip" label={label} />}
+        renderValue={(optionsSelected) => (
+          <Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 0.5 }}>
+            {optionsSelected.map((value) => (
+              <Chip key={value} label={value} />
+            ))}
+          </Box>
+        )}
+      >
+        {options.map((option) => (
+          <MenuItem key={option.name} value={option.name}>
+            {option.name.charAt(0).toUpperCase() + option.name.slice(1)}{' '}
+            {option.count && `(${option.count})`}
+          </MenuItem>
+        ))}
+      </Select>
+    </FormControl>
   );
 }
 
 const MemoizedChipSelect = memo(ChipSelect);
-export { ChipSelect as default, MemoizedChipSelect as ChipSelect };
+export { ChipSelect as default, MemoizedChipSelect as ChipSelect };
diff --git a/src/features/background/components/PhotoInformation.jsx b/src/features/background/components/PhotoInformation.jsx
@@ -71,9 +71,6 @@ function PhotoInformation({ info, url, api }) {
     return null;
   }
 
-  // remove unsplash text
-  const unsplash = variables.getMessage('widgets.background.unsplash');
-
   let credit = info.credit;
   let photo = variables.getMessage('widgets.background.credit');
 
@@ -88,9 +85,6 @@ function PhotoInformation({ info, url, api }) {
       <>
         <a href={info.photographerURL} target="_blank" rel="noopener noreferrer">
           {info.credit}
-        </a>{' '}
-        <a href="https://unsplash.com?utm_source=mue" target="_blank" rel="noopener noreferrer">
-          {unsplash}
         </a>
       </>
     );

diff --git a/src/features/background/options/BackgroundOptions.jsx b/src/features/background/options/BackgroundOptions.jsx
@@ -53,6 +53,7 @@ class BackgroundOptions extends PureComponent {
   }
 
   updateAPI(e) {
+    localStorage.setItem('nextImage', null);
     if (e === 'mue') {
       this.setState({
         backgroundCategories: this.state.backgroundCategoriesOG,

diff --git a/src/features/marketplace/components/Elements/Lightbox/Lightbox.jsx b/src/features/marketplace/components/Elements/Lightbox/Lightbox.jsx
@@ -15,5 +15,4 @@ function Lightbox({ modalClose, img }) {
 }
 
 const MemoizedLightbox = memo(Lightbox);
-export default MemoizedLightbox;
-export { MemoizedLightbox as Lightbox };
+export { MemoizedLightbox as default, MemoizedLightbox as Lightbox };
diff --git a/src/features/marketplace/components/Elements/SideloadFailedModal/SideloadFailedModal.jsx b/src/features/marketplace/components/Elements/SideloadFailedModal/SideloadFailedModal.jsx
@@ -23,6 +23,4 @@ function SideloadFailedModal({ modalClose, reason }) {
 }
 
 const MemoizedSideloadFailedModal = memo(SideloadFailedModal);
-
-export default MemoizedSideloadFailedModal;
-export { MemoizedSideloadFailedModal as SideloadFailedModal };
+export { MemoizedSideloadFailedModal as default, MemoizedSideloadFailedModal as SideloadFailedModal };