fix: import settings, prepare to move bg to indexed db

package.json

@@ -26,7 +26,6 @@
     "embla-carousel-react": "8.1.3",
     "fast-blurhash": "^1.1.4",
     "framer-motion": "^11.11.0",
-    "image-conversion": "^2.1.1",
     "markdown-to-jsx": "^7.5.0",
     "mue": "file:",
     "react": "^18.3.1",

src/components/Form/Settings/FileUpload/FileUpload.jsx

@@ -1,6 +1,5 @@
 import variables from 'config/variables';
 import { toast } from 'react-toastify';
-import { compressAccurately, filetoDataURL } from 'image-conversion';
 import videoCheck from 'features/background/api/videoCheck';
 
 function FileUpload({ id, type, accept, loadFunction }) {
@@ -30,20 +29,13 @@ function FileUpload({ id, type, accept, loadFunction }) {
         return loadFunction(file);
       }
 
-      compressAccurately(file, {
-        size: 450,
-        accuracy: 0.9,
-      }).then(async (res) => {
-        if (settingsSize + res.size > 4850000) {
-          return toast(variables.getMessage('toasts.no_storage'));
-        }
-
-        loadFunction({
+      loadFunction(
+        {
           target: {
-            result: await filetoDataURL(res),
+            result: file,
           },
-        });
-      });
+        },
+      );
     }
   };
 

src/features/background/api/videoCheck.js

@@ -3,7 +3,7 @@
  * @param url - The URL of the file to be checked.
  * @returns A function that takes a url and returns a boolean.
  */
-export default function videoCheck(url) {
+export default function videoCheck(url = '') {
   return (
     url.startsWith('data:video/') ||
     url.endsWith('.mp4') ||

src/features/background/options/Custom.jsx

@@ -10,7 +10,6 @@ import {
   MdFolder,
 } from 'react-icons/md';
 import EventBus from 'utils/eventbus';
-import { compressAccurately, filetoDataURL } from 'image-conversion';
 import videoCheck from '../api/videoCheck';
 
 import { Checkbox, FileUpload } from 'components/Form/Settings';
@@ -162,23 +161,14 @@ export default class CustomSettings extends PureComponent {
         return this.customBackground(file, this.state.currentBackgroundIndex);
       }
 
-      compressAccurately(file, {
-        size: 450,
-        accuracy: 0.9,
-      }).then(async (res) => {
-        if (settingsSize + res.size > 4850000) {
-          return toast(variables.getMessage('toasts.no_storage'));
-        }
-
-        this.customBackground(
-          {
-            target: {
-              result: await filetoDataURL(res),
-            },
+      this.customBackground(
+        {
+          target: {
+            result: file,
           },
-          this.state.currentBackgroundIndex,
-        );
-      });
+        },
+        this.state.currentBackgroundIndex,
+      );
       e.preventDefault();
     };
   }

src/index.jsx

@@ -18,9 +18,13 @@ let locale_id = localStorage.getItem('language');
 
 if (locale_id?.indexOf('_')) {
   localStorage.setItem('language', locale_id.replace('_', '-'));
+  locale_id = locale_id.replace('_', '-');
 }
+
 locale_id ||= defaults.language;
+
 const t = await createTranslator(locale_id);
+
 variables.locale_id = locale_id;
 document.documentElement.lang = locale_id;
 
@@ -33,8 +37,8 @@ Sentry.init({
   autoSessionTracking: false,
 });
 
-const container = document.getElementById('root');
-const root = createRoot(container);
+const root = createRoot(document.getElementById('root'));
+
 root.render(
   <ErrorBoundary>
     <App />