MCUDT-34530

src-electron/rest/user-data.js

@@ -526,6 +526,17 @@ function httpGetOption(db) {
     response.status(StatusCodes.OK).json(data)
   }
 }
+function httpGetDirtyFlag(db) {
+  return async (request, response) => {
+    let sessionUuid = request.query[restApi.param.sessionId]
+    let zapSessionId
+    if (`zapSessionId` in request.session) {
+      zapSessionId = request.session.zapSessionId[sessionUuid]
+    }
+    let dirtyFlag = await querySession.getSessionDirtyFlag(db, zapSessionId)
+    response.status(StatusCodes.OK).json(dirtyFlag)
+  }
+}
 
 /**
  * HTTP GET: ui_options
@@ -1119,6 +1130,10 @@ exports.post = [
 ]
 
 exports.get = [
+  {
+    uri: restApi.uri.getDirtyFlag,
+    callback: httpGetDirtyFlag,
+  },
   {
     uri: restApi.uri.endpointIds,
     callback: httpGetEndpointIds

src-shared/rest-api.js

@@ -41,6 +41,7 @@ const uri = {
   duplicateEndpoint: '/duplicateEndpoint',
   duplicateEndpointType: '/duplicateEndpointType',
   dirtyFlag: '/dirtyFlag',
+  getDirtyFlag: '/getDirtyFlag',
   option: '/option',
   uiOptions: '/uiOptions',
   commandUpdate: '/command/update',

src/App.vue

@@ -52,7 +52,7 @@ window.addEventListener(
       case 'theme':
         window[rendApi.GLOBAL_SYMBOL_EXECUTE](
           rendApi.id.setDarkTheme,
-          eventData.theme === 'dark'
+          eventData.theme === 'dark',
         )
         break
       case 'save':
@@ -68,7 +68,7 @@ window.addEventListener(
         break
     }
   },
-  false
+  false,
 )
 
 async function initLoad(store) {
@@ -195,7 +195,7 @@ export default defineComponent({
     setTheme() {
       window[rendApi.GLOBAL_SYMBOL_EXECUTE](
         rendApi.id.setDarkTheme,
-        storage.getItem(rendApi.storageKey.isDarkThemeActive)
+        storage.getItem(rendApi.storageKey.isDarkThemeActive),
       )
     },
 
@@ -268,7 +268,7 @@ export default defineComponent({
         this.$serverGet(restApi.uri.uiOptions).then((res) => {
           this.$store.commit(
             'zap/updateIsProfileIdShown',
-            res.data.showProfileId
+            res.data.showProfileId,
           )
         })
       }
@@ -288,7 +288,7 @@ export default defineComponent({
       if (`debugNavBar` in query) {
         this.$store.dispatch(
           'zap/setDebugNavBar',
-          query[`debugNavBar`] === 'true'
+          query[`debugNavBar`] === 'true',
         )
       } else {
         // If we don't specify it, default is on.
@@ -302,7 +302,7 @@ export default defineComponent({
       if (`setSaveButtonVisible` in query) {
         this.$store.dispatch(
           'zap/setSaveButtonVisible',
-          query[`setSaveButtonVisible`] === 'true'
+          query[`setSaveButtonVisible`] === 'true',
         )
       } else {
         // If we don't specify it, default is off.
@@ -318,7 +318,7 @@ export default defineComponent({
         rendApi.observable.progress_attribute,
         (message) => {
           this.setGenerationInProgress(message)
-        }
+        },
       )
 
       initLoad(this.$store).then(() => {
@@ -336,12 +336,8 @@ export default defineComponent({
         dbEnum.wsCategory.updateSelectedUcComponents,
         (resp) => {
           this.$store.dispatch('zap/updateSelectedUcComponentState', resp)
-        }
+        },
       )
-
-      this.$onWebSocket(dbEnum.wsCategory.dirtyFlag, (resp) => {
-        this.$store.dispatch('zap/setDirtyState', resp)
-      })
     },
     addClassToBody() {
       document.body.classList.remove('matter', 'zigbee', 'multiprotocol')
@@ -363,8 +359,13 @@ export default defineComponent({
           hasMounted: true
         }
       },
-      '*'
+      '*',
     )
+    if (this.$onWebSocket) {
+      this.$onWebSocket(dbEnum.wsCategory.dirtyFlag, () => {
+        this.$store.dispatch('zap/setDirtyState')
+      })
+    }
   },
   unmounted() {
     document.body.classList.remove('matter', 'zigbee', 'multiprotocol')

src/store/zap/actions.js

@@ -1216,13 +1216,10 @@
   })
 }
 
-/**
- * Set the dirty state for ZAP config when there are unsaved changes.
- * @param {*} context
- * @param {*} isDirty
- */
-export function setDirtyState(context, isDirty) {
-  context.commit('setDirtyState', isDirty)
+export function setDirtyState(context) {
+  axiosRequests.$serverGet(restApi.uri.getDirtyFlag).then((resp) => {
+    context.commit('setDirtyState', resp.data)
+  })
 }
 
 /**