fix: continue conversion of settings system

src/App.jsx

@@ -10,6 +10,8 @@ import Preview from 'features/helpers/preview/Preview';
 
 import Welcome from 'features/welcome/Welcome';
 
+import BackgroundDefaults from 'features/background/options/default';
+
 const useAppSetup = () => {
   useEffect(() => {
     loadSettings();
@@ -36,13 +38,13 @@ const App = () => {
 
   useEffect(() => {
     const storedToastDisplayTime = localStorage.getItem('toastDisplayTime');
-    const storedBackground = localStorage.getItem('background');
+    const storedBackground = localStorage.getItem('background') || BackgroundDefaults.background;
 
     if (storedToastDisplayTime) {
       setToastDisplayTime(parseInt(storedToastDisplayTime, 10));
     }
 
-    if (storedBackground === 'true') {
+    if (storedBackground === 'true' || storedBackground === true) {
       setShowBackground(true);
     }
   }, []);

src/components/Elements/MainModal/backend/TabNavbar.jsx

@@ -205,7 +205,7 @@ const TabNavbar = ({ modalClose }) => {
               {variables.getMessage(`modals.main.navbar.${tab.id}`)}
               {tab.id === 'addons' && (
                 <span className="px-3 py-1 bg-[#424242] rounded-lg text-xs">
-                  {JSON.parse(localStorage.getItem('installed')).length}
+                  {(JSON.parse(localStorage.getItem('installed')) || []).length}
                 </span>
               )}
               {tab.id === 'marketplace' && (

src/features/background/Background.jsx

@@ -15,6 +15,8 @@ import { randomColourStyleBuilder } from './api/randomColour';
 import './scss/index.scss';
 import { decodeBlurHash } from 'fast-blurhash';
 
+import defaults from './options/default';
+
 export default class Background extends PureComponent {
   constructor() {
     super();
@@ -84,8 +86,8 @@ export default class Background extends PureComponent {
       apiCategories = localStorage.getItem('apiCategories');
     }
 
-    const backgroundAPI = localStorage.getItem('backgroundAPI');
-    const apiQuality = localStorage.getItem('apiQuality');
+    const backgroundAPI = localStorage.getItem('backgroundAPI') || defaults.backgroundAPI;
+    const apiQuality = localStorage.getItem('apiQuality') || defaults.apiQuality;
     let backgroundExclude = JSON.parse(localStorage.getItem('backgroundExclude'));
     if (!Array.isArray(backgroundExclude)) {
       backgroundExclude = [];
@@ -99,7 +101,8 @@ export default class Background extends PureComponent {
     switch (backgroundAPI) {
       case 'unsplash':
       case 'pexels':
-        const collection = localStorage.getItem('unsplashCollections');
+        const collection =
+          localStorage.getItem('unsplashCollections') || defaults.unsplashCollections;
         if (collection) {
           requestURL = `${variables.constants.API_URL}/images/unsplash?collections=${collection}&quality=${apiQuality}`;
         } else {
@@ -186,7 +189,7 @@ export default class Background extends PureComponent {
       return setFavourited(favourited);
     }
 
-    const type = localStorage.getItem('backgroundType');
+    const type = localStorage.getItem('backgroundType') || defaults.backgroundType;
     switch (type) {
       case 'api':
         if (offline) {
@@ -232,7 +235,7 @@ export default class Background extends PureComponent {
         break;
       case 'custom':
         let customBackground = [];
-        const customSaved = localStorage.getItem('customBackground');
+        const customSaved = localStorage.getItem('customBackground') || defaults.customBackground;
         try {
           customBackground = JSON.parse(customSaved);
         } catch (e) {
@@ -405,7 +408,7 @@ export default class Background extends PureComponent {
           element.style.display = 'block';
         }
 
-        const backgroundType = localStorage.getItem('backgroundType');
+        const backgroundType = localStorage.getItem('backgroundType') || defaults.backgroundType;
 
         if (this.state.photoInfo.offline !== true) {
           // basically check to make sure something has changed before we try getting another background
@@ -435,7 +438,8 @@ export default class Background extends PureComponent {
 
       if (data === 'backgroundeffect') {
         // background effects so we don't get another image again
-        const backgroundFilterSetting = localStorage.getItem('backgroundFilter');
+        const backgroundFilterSetting =
+          localStorage.getItem('backgroundFilter') || defaults.backgroundFilter;
         const backgroundFilter = backgroundFilterSetting && backgroundFilterSetting !== 'none';
 
         if (this.state.video === true) {
@@ -457,7 +461,8 @@ export default class Background extends PureComponent {
             backgroundFilter
               ? backgroundFilterSetting +
                 '(' +
-                localStorage.getItem('backgroundFilterAmount') +
+                (localStorage.getItem('backgroundFilterAmount') ||
+                  defaults.backgroundFilterAmount) +
                 '%)'
               : ''
           }`;
@@ -511,7 +516,7 @@ export default class Background extends PureComponent {
           style={{
             WebkitFilter: `blur(${localStorage.getItem(
               'blur',
-            )}px) brightness(${localStorage.getItem('brightness')}%)`,
+            )}px) brightness(${localStorage.getItem('brightness') || defaults.brightness}%)`,
           }}
           id="backgroundVideo"
         >
@@ -520,17 +525,21 @@ export default class Background extends PureComponent {
       );
     }
 
-    const backgroundFilter = localStorage.getItem('backgroundFilter');
+    const backgroundFilter = localStorage.getItem('backgroundFilter') || defaults.backgroundFilter;
 
     return (
       <>
         <div
           style={{
-            WebkitFilter: `blur(${localStorage.getItem(
-              'blur',
-            )}px) brightness(${localStorage.getItem('brightness')}%) ${
+            WebkitFilter: `blur(${
+              localStorage.getItem('blur') || defaults.blur
+            }px) brightness(${localStorage.getItem('brightness') || defaults.brightness}%) ${
               backgroundFilter && backgroundFilter !== 'none'
-                ? backgroundFilter + '(' + localStorage.getItem('backgroundFilterAmount') + '%)'
+                ? backgroundFilter +
+                  '(' +
+                  (localStorage.getItem('backgroundFilterAmount') ||
+                    defaults.backgroundFilterAmount) +
+                  '%)'
                 : ''
             }`,
           }}

src/features/background/options/default.js

@@ -9,7 +9,7 @@ const DefaultOptions = {
   photoInformation: true,
   photoMap: true,
   blur: 0,
-  brightness: 0,
+  brightness: 100,
   backgroundEffect: 'none',
   backgroundFilterAmount: 0,
   customBackgroundColour: 'rgba(0, 0, 0, 0)',

src/features/misc/sections/Overview.jsx

@@ -46,15 +46,6 @@ const Overview = () => {
         'message',
       ],
   );
-  const [news, setNews] = useState({
-    title: '',
-    date: '',
-    description: '',
-    link: '',
-    linkText: '',
-  });
-  const [newsDone, setNewsDone] = useState(false);
-  const [loading, setLoading] = useState(true);
 
   const arrayMove = (array, oldIndex, newIndex) => {
     const result = Array.from(array);
@@ -102,30 +93,6 @@ const Overview = () => {
     }
   };
 
-  const getNews = useCallback(async () => {
-    try {
-      const response = await fetch(`${variables.constants.API_URL}/news`);
-      const data = await response.json();
-      data.date = new window.Date(data.date).toLocaleDateString(
-        variables.languagecode.replace('_', '-'),
-        {
-          year: 'numeric',
-          month: 'long',
-          day: 'numeric',
-        },
-      );
-      setNews(data);
-      setNewsDone(true);
-    } catch (error) {
-      console.error('Failed to fetch news:', error);
-    } finally {
-      setLoading(false);
-    }
-  }, []);
-
-  useEffect(() => {
-    getNews();
-  }, [getNews]);
 
   useEffect(() => {
     localStorage.setItem('order', JSON.stringify(items));

src/features/misc/views/Widgets.jsx

@@ -34,7 +34,7 @@ export function Widgets() {
   };
 
   function enabled(key) {
-    return localStorage.getItem(key) === 'true';
+    return localStorage.getItem(key) !== 'falses';
   }
 
   useEffect(() => {