Merge pull request #5 from netgen-layouts/LAYOUTS-674-bypass-varnish

LAYOUTS-674 adjust api url before sending request so we bypass varnish

components/block-picker/element.js

@@ -1,5 +1,6 @@
 import {LitElement, html} from 'lit';
 import {classMap} from 'lit/directives/class-map.js';
+import { addTimestampToUrl } from '../component-helper.js';
 import { CloseIcon } from '../icons.js';
 import style from './style.js';
 
@@ -162,10 +163,9 @@ export default class BlockPicker extends LitElement {
     }
   }
 
-
   async handleRefreshView(blockId) {
-
-    return await fetch(window.location.href)
+    const apiUrl = addTimestampToUrl(window.location.href)
+    return await fetch(apiUrl)
       .then(resp => {
         return resp.text()
       })

components/block/element.js

@@ -3,6 +3,7 @@ import {classMap} from 'lit/directives/class-map.js';
 import style from './style.js';
 
 import { ArrowDownIcon, ArrowUpIcon, BreadcrumbArrowIcon, PlusIcon, RefreshIcon } from '../icons.js';
+import { addTimestampToUrl } from '../component-helper.js';
 
 export default class Block extends LitElement {
   static styles = [style];
@@ -115,12 +116,11 @@ export default class Block extends LitElement {
     return this.slottedChildren[0]?.querySelectorAll('ngl-block')
   }
   // GETTERS - end
-
-
   async fetch() {
     this.loading = true;
     try {
-      const resp = await fetch(window.location.href);
+      const apiUrl = addTimestampToUrl(window.location.href)
+      const resp = await fetch(apiUrl);
       return resp.text();
     } finally {
       this.loading = false;
@@ -243,8 +243,6 @@ export default class Block extends LitElement {
   select() {
     if (this.isInLinkedZone) return;
 
-    console.debug(this.model)
-
     this.model.trigger('edit');
     this.isSelected = true;
   }
@@ -339,12 +337,11 @@ export default class Block extends LitElement {
         this.handleRefreshView()
       })
     }
-
   }
 
   async handleRefreshView() {
-
-    return await fetch(window.location.href)
+    const apiUrl = addTimestampToUrl(window.location.href)
+    return await fetch(apiUrl)
       .then(resp => {
         return resp.text()
       })

components/component-helper.js

@@ -0,0 +1,7 @@
+export const addTimestampToUrl = (url) => {
+  const urlObject = new URL(url)
+  let searchParams = new URLSearchParams(urlObject.search)
+  searchParams.set('t', Date.now())
+
+  return `${urlObject.origin + urlObject.pathname}?${searchParams.toString()}`
+}