fix: reactivity problems with v-iframe params

data-fair · Jan 31, 2025 · 8bad982 · 8bad982
1 parent 8264568
commit 8bad982
Show file tree

Hide file tree

Showing 6 changed files with 53 additions and 20 deletions.
diff --git a/public/components/application/featured.vue b/public/components/application/featured.vue
@@ -27,8 +27,8 @@
         :title="application.title"
         :style="iframeStyle"
         :sync-state="true"
-        :query-params-extra="{primary: readablePrimaryColor, embed: true}"
-        :query-params-exclude="['portalId']"
+        :query-params-extra="queryParamsExtra"
+        :query-params-exclude="queryParamsExclude"
         @state="s => syncedState = s"
       />
     </client-only>
@@ -71,6 +71,12 @@ export default {
         if (key !== 'embed' && key !== 'primary') params[key] = url.searchParams.get(key)
       }
       return params
+    },
+    queryParamsExtra () {
+      return { primary: this.readablePrimaryColor, embed: true }
+    },
+    queryParamsExclude () {
+      return ['portalId']
     }
   },
   async mounted () {

diff --git a/public/pages/applications/_ref/full.vue b/public/pages/applications/_ref/full.vue
@@ -14,8 +14,8 @@
           scrolling="yes"
           :iframe-resizer="false"
           :sync-state="true"
-          :query-params-extra="{primary: readablePrimaryColor, embed: true}"
-          :query-params-exclude="['portalId']"
+          :query-params-extra="queryParamsExtra"
+          :query-params-exclude="queryParamsExclude"
         />
       </client-only>
     </div>
@@ -98,6 +98,12 @@ export default {
     },
     pageUrl () {
       return this.publicUrl + '/applications/' + this.$route.params.ref + '/full'
+    },
+    queryParamsExtra () {
+      return { primary: this.readablePrimaryColor, embed: true }
+    },
+    queryParamsExclude () {
+      return ['portalId']
     }
   }
 }

diff --git a/public/pages/applications/_ref/index.vue b/public/pages/applications/_ref/index.vue
@@ -79,8 +79,8 @@
           :title="application.title"
           :src="`${dataFairUrl}/app/${$route.params.ref}`"
           :sync-state="true"
-          :query-params-extra="{primary: readablePrimaryColor, embed: true}"
-          :query-params-exclude="['portalId']"
+          :query-params-extra="queryParamsExtra"
+          :query-params-exclude="queryParamsExclude"
           @state="s => syncedState = s"
         />
       </client-only>
@@ -218,6 +218,12 @@ export default {
     ...mapGetters(['readablePrimaryColor', 'dataFairUrl', 'infoCardProps', 'directoryUrl']),
     pageUrl () {
       return this.publicUrl + '/applications/' + this.$route.params.ref
+    },
+    queryParamsExtra () {
+      return { primary: this.readablePrimaryColor, embed: true }
+    },
+    queryParamsExclude () {
+      return ['portalId']
     }
   },
   watch: {

diff --git a/public/pages/datasets/_ref/full.vue b/public/pages/datasets/_ref/full.vue
@@ -14,8 +14,8 @@
           scrolling="yes"
           :iframe-resizer="false"
           :sync-state="true"
-          :query-params-extra="{primary: config.themeColor}"
-          :query-params-exclude="['portalId']"
+          :query-params-extra="queryParamsExtra"
+          :query-params-exclude="queryParamsExclude"
         />
       </client-only>
     </div>
@@ -49,9 +49,15 @@ export default {
   },
   computed: {
     ...mapState(['config', 'publicUrl', 'portal', 'draft']),
-    ...mapGetters(['dataFairUrl']),
+    ...mapGetters(['dataFairUrl', 'readablePrimaryColor']),
     pageUrl () {
       return this.publicUrl + '/datasets/' + this.$route.params.ref + '/full'
+    },
+    queryParamsExtra () {
+      return { primary: this.readablePrimaryColor, embed: true }
+    },
+    queryParamsExclude () {
+      return ['portalId']
     }
   }
 }

diff --git a/public/pages/me/processings.vue b/public/pages/me/processings.vue
@@ -2,11 +2,8 @@
   <v-iframe
     title="Traitements"
     :src="processingsListUrl"
-    :query-params-extra="{
-      primary: readablePrimaryColor,
-      owner: ownerFilter
-    }"
-    :query-params-exclude="['portalId']"
+    :query-params-extra="queryParamsExtra"
+    :query-params-exclude="queryParamsExclude"
     :sync-state="true"
     @message="onMessage"
   />
@@ -33,6 +30,12 @@ export default {
     },
     processingsListUrl () {
       return `${this.processingsUrl}/processings/`
+    },
+    queryParamsExtra () {
+      return { primary: this.readablePrimaryColor, owner: this.ownerFilter }
+    },
+    queryParamsExclude () {
+      return ['portalId']
     }
   },
   methods: {

diff --git a/public/pages/me/update-dataset.vue b/public/pages/me/update-dataset.vue
@@ -2,12 +2,8 @@
   <v-iframe
     title="Contribuer"
     :src="updateDatasetUrl"
-    :query-params-extra="{
-      primary: readablePrimaryColor,
-      publicationSite: `data-fair-portals:${portal._id}`,
-      owner: ownerFilter
-    }"
-    :query-params-exclude="['portalId']"
+    :query-params-extra="queryParamsExtra"
+    :query-params-exclude="queryParamsExclude"
     :sync-state="true"
   />
 </template>
@@ -33,6 +29,16 @@ export default {
     },
     updateDatasetUrl () {
       return `${this.dataFairUrl}/embed/workflow/update-dataset`
+    },
+    queryParamsExtra () {
+      return {
+        primary: this.readablePrimaryColor,
+        publicationSite: `data-fair-portals:${this.portal._id}`,
+        owner: this.ownerFilter
+      }
+    },
+    queryParamsExclude () {
+      return ['portalId']
     }
   }
 }