Adjust refresh on related records update when saving in modal

2023-09-21 15:35:00 +02:00 · 2023-09-21 15:35:00 +02:00 · 35d455f154
commit 35d455f154
parent 6284ac5af9
11 changed files with 94 additions and 23 deletions
--- a/client/web/compose/src/components/ModuleFields/Viewer/Record.vue
+++ b/client/web/compose/src/components/ModuleFields/Viewer/Record.vue
@ -85,8 +85,8 @@ export default {
  },

  beforeDestroy () {
-    this.setDefaultValues()
    this.destroyEvents()
+    this.setDefaultValues()
  },

  mounted () {
@ -100,8 +100,8 @@ export default {
      resolveRecords: 'record/resolveRecords',
    }),

-    refreshOnRelatedModuleUpdate (module) {
-      if (this.relatedModuleID === module.moduleID) {
+    refreshOnRelatedModuleUpdate ({ moduleID }) {
+      if (this.relatedModuleID === moduleID) {
        this.formatRecordValues(this.value)
      }
    },
--- a/client/web/compose/src/components/PageBlocks/CalendarBase.vue
+++ b/client/web/compose/src/components/PageBlocks/CalendarBase.vue
@ -234,9 +234,14 @@ export default {
    this.refreshBlock(this.refresh)
  },

+  mounted () {
+    this.$root.$on('module-records-updated', this.refreshOnRelatedRecordsUpdate)
+  },
+
  beforeDestroy () {
    this.setDefaultValues()
    this.abortRequests()
+    this.destroyEvents()
  },

  methods: {
@ -252,6 +257,18 @@ export default {
      })
    },

+    refreshOnRelatedRecordsUpdate ({ moduleID, notPageID }) {
+      this.options.feeds.forEach((feed) => {
+        const { moduleID: feedModuleID } = feed.options
+
+        if (feedModuleID) {
+          if (feedModuleID === moduleID && this.page.pageID !== notPageID) {
+            this.refresh()
+          }
+        }
+      })
+    },
+
    /**
     * Helper method to load requested locale.
     * See https://github.com/fullcalendar/fullcalendar/tree/master/packages/core/src/locales
@ -406,6 +423,10 @@ export default {
    abortRequests () {
      this.cancelTokenSource.cancel(`cancel-record-list-request-${this.block.blockID}`)
    },
+
+    destroyEvents () {
+      this.$root.$off('module-records-updated', this.refreshOnRelatedRecordsUpdate)
+    },
  },
 }
 </script>
--- a/client/web/compose/src/components/PageBlocks/ChartBase.vue
+++ b/client/web/compose/src/components/PageBlocks/ChartBase.vue
@ -29,6 +29,7 @@ export default {
  components: {
    ChartComponent,
  },
+
  extends: base,

  data () {
@ -69,8 +70,8 @@ export default {
      findChartByID: 'chart/findByID',
    }),

-    refreshOnRelatedRecordsUpdate (module) {
-      if (this.filter.moduleID === module.moduleID) {
+    refreshOnRelatedRecordsUpdate ({ moduleID, notPageID }) {
+      if (this.filter.moduleID === moduleID && this.page.pageID !== notPageID) {
        this.refresh()
      }
    },
--- a/client/web/compose/src/components/PageBlocks/CommentBase.vue
+++ b/client/web/compose/src/components/PageBlocks/CommentBase.vue
@ -230,8 +230,8 @@ export default {

  beforeDestroy () {
    this.abortRequests()
-    this.setDefaultValues()
    this.destroyEvents()
+    this.setDefaultValues()
  },

  methods: {
@ -244,8 +244,8 @@ export default {
      return user.name || user.handle || user.email || ''
    },

-    refreshOnRelatedRecordsUpdate (module) {
-      if (this.options.moduleID === module.moduleID) {
+    refreshOnRelatedRecordsUpdate ({ moduleID, notPageID }) {
+      if (this.options.moduleID === moduleID && this.page.pageID !== notPageID) {
        this.refresh()
      }
    },
@ -301,6 +301,9 @@ export default {
          this.newRecord.title = ''
          this.newRecord.content = ''
          this.refresh()
+
+          const { moduleID } = this.options
+          this.$root.$emit('module-records-updated', { moduleID })
        })
          .catch(this.toastErrorHandler(this.$t('notification:record.createFailed')))
      }
--- a/client/web/compose/src/components/PageBlocks/GeometryBase.vue
+++ b/client/web/compose/src/components/PageBlocks/GeometryBase.vue
@ -154,9 +154,14 @@ export default {
    this.refreshBlock(this.refresh)
  },

+  mounted () {
+    this.$root.$on('module-records-updated', this.refreshOnRelatedRecordsUpdate)
+  },
+
  beforeDestroy () {
    this.setDefaultValues()
    this.abortRequests()
+    this.destroyEvents()
  },

  methods: {
@ -164,6 +169,14 @@ export default {
      findModuleByID: 'module/findByID',
    }),

+    refreshOnRelatedRecordsUpdate ({ moduleID, notPageID }) {
+      this.options.feeds.forEach((feed) => {
+        if (feed.options.moduleID === moduleID && this.page.pageID !== notPageID) {
+          this.refresh()
+        }
+      })
+    },
+
    loadEvents () {
      this.geometries = []

@ -329,6 +342,10 @@ export default {
    abortRequests () {
      this.cancelTokenSource.cancel(`abort-request-${this.block.blockID}`)
    },
+
+    destroyEvents () {
+      this.$root.$off('module-records-updated', this.refreshOnRelatedRecordsUpdate)
+    },
  },
 }
 </script>
--- a/client/web/compose/src/components/PageBlocks/MetricBase.vue
+++ b/client/web/compose/src/components/PageBlocks/MetricBase.vue
@ -235,11 +235,15 @@ export default {
      })
    },

-    refreshOnRelatedRecordsUpdate (module) {
+    refreshOnRelatedRecordsUpdate ({ moduleID, notPageID }) {
+      if (this.page.pageID === notPageID) {
+        return
+      }
+
      const metrics = this.options.metrics

      const hasMatchingModule = metrics.some((m) => {
-        return m.moduleID === module.moduleID
+        return m.moduleID === moduleID
      })

      if (hasMatchingModule) {
--- a/client/web/compose/src/components/PageBlocks/ProgressBase.vue
+++ b/client/web/compose/src/components/PageBlocks/ProgressBase.vue
@ -78,6 +78,7 @@ export default {

  mounted () {
    this.$root.$on(`refetch-non-record-blocks:${this.page.pageID}`, this.refresh)
+    this.$root.$on('module-records-updated', this.refreshOnRelatedRecordsUpdate)
  },

  beforeDestroy () {
@ -132,6 +133,12 @@ export default {
        })
    },

+    refreshOnRelatedRecordsUpdate ({ moduleID, notPageID }) {
+      if (this.options.value.moduleID === moduleID && this.page.pageID !== notPageID) {
+        this.refresh()
+      }
+    },
+
    setDefaultValues () {
      this.processing = false
      this.value = undefined
@ -141,6 +148,7 @@ export default {

    destroyEvents () {
      this.$root.$off(`refetch-non-record-blocks:${this.page.pageID}`, this.refresh)
+      this.$root.$off('module-records-updated', this.refreshOnRelatedRecordsUpdate)
    },
  },
 }
--- a/client/web/compose/src/components/PageBlocks/RecordListBase.vue
+++ b/client/web/compose/src/components/PageBlocks/RecordListBase.vue
@ -1103,13 +1103,17 @@ export default {
      this.$root.$on('module-records-updated', this.refreshOnRelatedRecordsUpdate)
    },

-    refreshOnRelatedRecordsUpdate (module) {
-      if (this.recordListModule.moduleID === module.moduleID) {
+    refreshOnRelatedRecordsUpdate ({ moduleID, notPageID }) {
+      if (this.page.pageID === notPageID) {
+        return
+      }
+
+      if (this.recordListModule.moduleID === moduleID) {
        this.refresh(true)
      } else {
        const recordFields = this.fields.filter((f) => f.moduleField.kind === 'Record')
        const hasMatchingModule = recordFields.some((r) => {
-          return r.moduleField.options.moduleID === module.moduleID
+          return r.moduleField.options.moduleID === moduleID
        })

        if (hasMatchingModule) {
--- a/client/web/compose/src/components/PageBlocks/RecordOrganizerBase.vue
+++ b/client/web/compose/src/components/PageBlocks/RecordOrganizerBase.vue
@ -346,8 +346,8 @@ export default {
      }
    },

-    refreshOnRelatedRecordsUpdate (module) {
-      if (this.options.moduleID === module.moduleID) {
+    refreshOnRelatedRecordsUpdate ({ moduleID, notPageID }) {
+      if (this.options.moduleID === moduleID && this.page.pageID !== notPageID) {
        this.refresh()
      }
    },
--- a/client/web/compose/src/components/PageBlocks/RecordRevisionsBase.vue
+++ b/client/web/compose/src/components/PageBlocks/RecordRevisionsBase.vue
@ -218,13 +218,24 @@ export default {

  beforeDestroy () {
    this.setDefaultValues()
+    this.destroyEvents()
  },

  created () {
    this.refreshBlock(this.refresh)
  },

+  mounted () {
+    this.$root.$on('module-records-updated', this.refreshOnRelatedRecordsUpdate)
+  },
+
  methods: {
+    refreshOnRelatedRecordsUpdate ({ moduleID }) {
+      if (this.module.moduleID === moduleID) {
+        this.refresh()
+      }
+    },
+
    async loadRevisions () {
      if (this.revisionsDisabledOnModule) {
        return
@ -259,6 +270,10 @@ export default {
      this.revisions = []
      this.columns = []
    },
+
+    destroyEvents () {
+      this.$root.$off('module-records-updated', this.refreshOnRelatedRecordsUpdate)
+    },
  },
 }
 </script>
--- a/client/web/compose/src/mixins/record.js
+++ b/client/web/compose/src/mixins/record.js
@ -169,6 +169,12 @@ export default {

            if (this.showRecordModal) {
              this.$emit('handle-record-redirect', { recordID: record.recordID, recordPageID: this.page.pageID })
+
+              // If we are in a modal we need to refresh blocks not in modal
+              this.$root.$emit('module-records-updated', {
+                moduleID: this.module.moduleID,
+                notPageID: this.page.pageID,
+              })
            } else {
              this.$router.push({ name: route, params: { ...this.$route.params, recordID: record.recordID } })
            }
@ -185,10 +191,6 @@ export default {
          }

          this.toastSuccess(this.$t(`notification:record.${isNew ? 'create' : 'update'}Success`))
-
-          this.$root.$emit('module-records-updated', {
-            moduleID: this.module.moduleID,
-          })
        })
        .catch(this.toastErrorHandler(this.$t(`notification:record.${isNew ? 'create' : 'update'}Failed`)))
        .finally(() => {
@ -243,10 +245,6 @@ export default {
            this.initialRecordState = this.record.clone()

            this.$router.push({ name: route, params: { ...this.$route.params, recordID: record.recordID } })
-
-            this.$root.$emit('module-records-updated', {
-              moduleID: this.module.moduleID,
-            })
          }
        })
        .catch(this.toastErrorHandler(this.$t(