import store

Author: mallowigi

src/App.svelte

@@ -2,28 +2,28 @@
   import { onMount } from 'svelte';
 
   import allThemes from './assets/themes.json';
-  // import {app} from '../src2/$app';
+  import { app } from '~store.ts';
   // import Panel from '~src/components/Panel.svelte';
   import Loading from '~components/Loading.svelte';
 
   onMount(async _ => {
-    //   $app.loading = true;
-    //   // Just waiting
-    //   await new Promise(resolve => setTimeout(resolve, 1000));
-    //   // Now fetching
+    $app.loading = true;
+    // Just waiting
+    await new Promise(resolve => setTimeout(resolve, 1000));
+    // Now fetching
     const themes = [
       ...allThemes.material,
       ...allThemes.other
     ];
-    //
-    //   // Load themes
-    //   $app.loadThemes(themes);
-    //   // Get settings from local storage
-    //   await $app.fetchSettings();
-    //   // Add defaults
-    //   $app.loadDefaults();
-    //
-    //   $app.loading = false;
+
+    // Load themes
+    $app.loadThemes(themes);
+    // Get settings from local storage
+    await $app.fetchSettings();
+    // Add defaults
+    $app.loadDefaults();
+
+    $app.loading = false;
   });
 </script>
 
@@ -42,7 +42,7 @@
 
 <main class='main'>
   <Loading></Loading>
-  <!--    {#if !$app.loading}-->
-  <!--        <Panel></Panel>-->
-  <!--    {/if}-->
+  {#if !$app.loading}
+    <!--          <Panel></Panel>-->
+  {/if}
 </main>

src2/main.js renamed to src/main.js

@@ -5,4 +5,4 @@ const app = new App({
   hydrate: true,
 });
 
-export default app;
+export default app;

src2/storage.js renamed to src/storage.ts

@@ -1,3 +1,5 @@
+import type { Theme } from '~types/types';
+
 export const SETTINGS = 'devtools-settings';
 export const DEVTOOLS_THEME = 'devtools-theme';
 export const DEVTOOLS_FONT = 'devtools-font';
@@ -7,9 +9,18 @@ export const DEVTOOLS_ACCENT_COLOR = 'devtools-accent-color';
 export const DEVTOOLS_SCROLLBARS = 'devtools-scrollbars';
 
 const chromeStorage = chrome.storage && chrome.storage.sync;
-const fakeStorage = {
 
-  async get(property, fn = () => {}) {
+export type DevtoolsSettings = {
+  [DEVTOOLS_THEME]?: string;
+  [DEVTOOLS_FONT]?: string;
+  [DEVTOOLS_SIZE]?: number;
+  [DEVTOOLS_CURRENT]?: Theme;
+  [DEVTOOLS_ACCENT_COLOR]?: string;
+  [DEVTOOLS_SCROLLBARS]?: boolean;
+};
+
+const fakeStorage = {
+  async get(property: string, fn = (object: DevtoolsSettings) => {}) {
     let item = await localStorage.getItem(SETTINGS);
     try {
       const settings = item ? JSON.parse(item) : {};
@@ -19,14 +30,14 @@ const fakeStorage = {
     }
   },
 
-  set(settings, fn = () => {}) {
+  set(settings: DevtoolsSettings, fn = (object: DevtoolsSettings) => {}) {
     let oldItem = localStorage.getItem(SETTINGS) || '{}';
     try {
       const oldSettings = JSON.parse(oldItem);
-      const newSettings = {...oldSettings, ...settings};
+      const newSettings = { ...oldSettings, ...settings };
 
       if (chromeStorage) {
-        chromeStorage.set({[SETTINGS]: JSON.stringify(newSettings)}, () => {});
+        chromeStorage.set({ [SETTINGS]: JSON.stringify(newSettings) }, () => {});
       }
       localStorage.setItem(SETTINGS, JSON.stringify(newSettings));
       fn(settings);