frontend/src/components/overlays/Settings.svelte

@@ -1,7 +1,7 @@
 <script>
     import { quintInOut } from "svelte/easing";
     import { AtSignIcon } from "svelte-feather-icons";
-    import { overlayStore, userInfoStore, smallViewport, theme, doAnimations } from "../../stores";
+    import { overlayStore, userInfoStore, smallViewport, theme } from "../../stores";
     import { logOut } from "../../auth";
     import { maybeFade, maybeFly } from "../../animations";
 
@@ -75,14 +75,6 @@
             <button class="button selection-option full-width" class:selected="{ $theme === "light" }" on:click="{ () => theme.set('light') }">Light</button>
         </div>
  
-        <div class="separator" />
-
-        <span class="input-label">Animations</span>
-        <div class="horizontal-selections">
-            <button class="button selection-option full-width selected" class:selected="{ $doAnimations === false }" on:click="{ () => doAnimations.set(false) }">Disabled</button>
-            <button class="button selection-option full-width" class:selected="{ $doAnimations === true }" on:click="{ () => doAnimations.set(true) }">Enabled</button>
-        </div>
- 
         <div class="modal-footer">
             <button class="button modal-secondary-action" on:click="{ close }">Close</button>
         </div>

frontend/src/stores.js

@@ -45,13 +45,6 @@ class Store {
     }
 }
 
-class StorageItemStore extends Store {
-    constructor(key) {
-        super(getItem(key), `StorageItemStore[key=${key}]`);
-        this.watch(e => setItem(key, e));
-    }
-}
-
 class ChannelsStore extends Store {
     constructor() {
         super(gateway.channels || [], "ChannelsStore");
@@ -316,8 +309,7 @@ export const selectedChannel = new Store({ id: getItem("app:cache:openChannelId"
 export const showSidebar = new Store(false, "showSidebar");
 export const showChannelView = new Store(true, "showChannelView");
 export const smallViewport = new Store(false, "smallViewport");
-export const theme = new StorageItemStore("app:visual:theme");
-export const doAnimations = new StorageItemStore("app:behavior:doAnimations");
+export const theme = new Store(getItem("app:visual:theme"), "theme");
 export const channels = new ChannelsStore();
 export const gatewayStatus = new GatewayStatusStore();
 export const messagesStoreProvider = new MessagesStoreProvider();
@@ -330,7 +322,6 @@ export const allStores = {
     showChannelView,
     smallViewport,
     theme,
-    doAnimations,
     channels,
     gatewayStatus,
     messagesStoreProvider,
@@ -341,3 +332,7 @@ export const allStores = {
 selectedChannel.watch((newSelectedChannel) => {
     setItem("app:cache:openChannelId", newSelectedChannel.id);
 });
+
+theme.watch((newTheme) => {
+    setItem("app:visual:theme", newTheme);
+});