fix #42

OpenHausIO · Dec 31, 2022 · e83897d · e83897d
1 parent f62667b
commit e83897d
Show file tree

Hide file tree

Showing 2 changed files with 51 additions and 3 deletions.
diff --git a/src/main.js b/src/main.js
@@ -14,6 +14,9 @@ const pinia = createPinia();
 
 import { request } from "./helper.js";
 
+import { useNotificationStore } from "@dafcoe/vue-notification";
+const { setNotification } = useNotificationStore();
+
 
 // monkey patch ws
 window.events = null;
@@ -24,11 +27,12 @@ pinia.use(({ store, options }) => {
     if (options?.persistent) {
 
         if (window.localStorage.getItem(store.$id)) {
+            console.log("Get item sotre", JSON.parse(window.localStorage.getItem(store.$id)))
             Object.assign(store, JSON.parse(window.localStorage.getItem(store.$id)));
         }
 
         store.$subscribe((mutation, state) => {
-            //console.log(`store: ${store.$id} .subscribe`, mutation, state);
+            console.log(`store: ${store.$id} .subscribe`, mutation, JSON.stringify(state));
             window.localStorage.setItem(store.$id, JSON.stringify(state));
         });
 
@@ -39,9 +43,48 @@ pinia.use(({ store, options }) => {
 pinia.use(({ store }) => {
     if (store.$id === "settings") {
 
+        // listen for changes
+        // `.watch()` in Settings.vue does not work.
+        // see #42
+        store.$subscribe((mutation, state) => {
+
+            console.log("mutation", mutation);
+            console.log("state", state);
+
+            if (!store.groupItems) {
+                store.groupRoomItems = false;
+                store.groupEndpointItems = false;
+                store.groupDeviceItems = false;
+            }
+
+            if (store.showGradientBackground) {
+                document.getElementById("app").classList.remove("bg-dark");
+                document.getElementById("app").classList.add("gardien-background");
+            } else {
+                document.getElementById("app").classList.add("bg-dark");
+                document.getElementById("app").classList.remove("gardien-background");
+            }
+
+            if (!store.showSettingsButton) {
+                setNotification({
+                    message: "Tap 10x times on any empty space to go to this page again when the settings button is hidden.",
+                    type: "info",
+                    showIcon: false,
+                    dismiss: {
+                        manually: true,
+                        automatically: false,
+                    },
+                    appearance: "dark",
+                });
+            }
+
+            routes.forEach((route) => {
+                route.visible = store[`show${route.name}Button`];
+            });
+
+        });
+
         // initial background settings
-        // TODO: Find a better way
-        // TODO: Move this to settings store and not "global/common"
         if (store.showGradientBackground) {
             document.getElementById("app").classList.remove("bg-dark");
             document.getElementById("app").classList.add("gardien-background");

diff --git a/src/views/Settings.vue b/src/views/Settings.vue
@@ -25,6 +25,8 @@ export default defineComponent({
     console.log("Mounted, watch settings");
 
     // save changes that are made
+    /*
+    // TODO: Remove, see #42
     watch(this.settings, () => {
       if (!this.settings.groupItems) {
         this.settings.groupRoomItems = false;
@@ -44,11 +46,13 @@ export default defineComponent({
         route.visible = this.settings[`show${route.name}Button`];
       });
     });
+    */
   },
 
   methods: {
     toggleFullscreen,
     showSettingsButtonInfo() {
+      /*
       nextTick(() => {
         if (this.settings.showSettingsButton) {
           setNotification({
@@ -64,6 +68,7 @@ export default defineComponent({
           });
         }
       });
+      */
     },
     addDashboardWidget(widget) {
       /*