feat: Avoid displaying Layout edition after saving Navigation propert…

…ies - MEED-7677 - Meeds-io/meeds#2533 This change will avoid displaying the page editor right after modifying Navigation properties. At the same time, this will avoid applications to change the Layout editor URL when opened.
Meeds-io · Nov 1, 2024 · 7515792 · 7515792
1 parent 7f6b97f
commit 7515792
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 23 deletions.
diff --git a/.../vue-app/common-layout-components/components/site-navigation/SiteNavigationNodeDrawer.vue b/.../vue-app/common-layout-components/components/site-navigation/SiteNavigationNodeDrawer.vue
@@ -462,7 +462,6 @@ export default {
                 'nodeTarget': this.nodeTarget ? 'NEW_TAB' : 'SAME_TAB',
                 'pageType': this.elementType,
                 'createdPage': createdPage,
-                'openEditLayout': this.elementType === 'PAGE',
               };
               this.updateNode(pageData,pageRef, startScheduleDate, endScheduleDate, nodeLabels);
             }).then(page => {
@@ -498,7 +497,6 @@ export default {
               'nodeTarget': this.nodeTarget ? 'SAME_TAB' : 'NEW_TAB',
               'pageType': this.elementType,
               'createdPage': createdPage,
-              'openEditLayout': this.elementType === 'PAGE',
             };
             this.createNode(previousNodeId, pageData, startScheduleDate, endScheduleDate, nodeLabels);
           }).then(page => {
@@ -525,7 +523,6 @@ export default {
     updateNode(pageData, pageRef, startScheduleDate, endScheduleDate, nodeLabels) {
       this.$navigationLayoutService.updateNode(this.navigationNode.id, this.nodeLabel, pageRef, this.visible, this.isScheduled, startScheduleDate, endScheduleDate, nodeLabels?.labels, pageData?.nodeTarget || this.navigationNode.target, this.nodeIcon)
         .then(() => {
-          this.openTargetPage(pageData, this.navigationNode.id);
           this.$root.$emit('refresh-navigation-nodes');
           this.$root.$emit('close-add-element-drawer');
           this.close();
@@ -592,16 +589,10 @@ export default {
     },
     openTargetPage(pageData, nodeId) {
       if (pageData?.pageRef) {
-        if (pageData?.pageType === 'PAGE' && pageData?.pageRef && pageData?.openEditLayout) {
+        if (pageData?.pageType === 'PAGE' && pageData?.pageRef) {
           return this.$pageLayoutService.editPageLayout(nodeId || this.nodeId, pageData?.pageRef);
-        } else {
-          let targetPageUrl ;
-          if (pageData?.pageType === 'LINK' ) {
-            targetPageUrl =  this.urlVerify(pageData?.createdPage?.state?.link) ;
-          } else {
-            targetPageUrl = `/portal${this.navigationNode.siteKey.type === 'GROUP' ? '/g' : ''}/${this.navigationNode.siteKey.name.replaceAll('/', ':')}/${this.navigationNode.uri}`;
-            targetPageUrl =  !this.editMode && `${targetPageUrl}/${this.nodeId}` || targetPageUrl;
-          }
+        } else if (pageData?.pageType === 'LINK' ) {
+          const targetPageUrl =  this.urlVerify(pageData?.createdPage?.state?.link) ;
           window.open(targetPageUrl, pageData?.nodeTarget === 'SAME_TAB' && '_self' || '_blank');
         }
       }

diff --git a/layout-webapp/src/main/webapp/vue-app/common/js/SiteLayoutService.js b/layout-webapp/src/main/webapp/vue-app/common/js/SiteLayoutService.js
@@ -183,11 +183,3 @@ export function getMembershipTypes() {
     }
   });
 }
-
-export function editSiteLayout(siteName, siteType) {
-  const formData = new FormData();
-  formData.append('siteName', siteName);
-  formData.append('siteType', siteType || 'portal');
-  const params = new URLSearchParams(formData).toString();
-  window.open(`${eXo.env.portal.context}/${eXo.env.portal.portalName}/layout-editor?${params}`, '_blank');
-}
diff --git a/layout-webapp/src/main/webapp/vue-app/layout-editor/main.js b/layout-webapp/src/main/webapp/vue-app/layout-editor/main.js
@@ -94,6 +94,8 @@ export function init() {
           diffScrollY: 0,
           gap: 20,
           nodeUri: null,
+          originalUri: `/portal/${window.location.href.split('/portal/')[1]}`,
+          originalHref: window.location.href,
         }),
         computed: {
           parentAppX() {
@@ -157,6 +159,9 @@ export function init() {
           },
         },
         created() {
+          // Some applications will change the window location state when displayed
+          // This will ensure to preserve the original Page location URI
+          new MutationObserver(this.setOriginalUri).observe(document, { subtree: true, childList: true });
           document.addEventListener('extension-layout-editor-container-updated', this.refreshContainerTypes);
           this.$on('layout-editor-portlet-instances-refresh', this.refreshPortletInstances);
           document.addEventListener('drawerOpened', this.setDrawerOpened);
@@ -169,6 +174,11 @@ export function init() {
           this.$el?.closest?.('.PORTLET-FRAGMENT')?.classList?.remove?.('PORTLET-FRAGMENT');
         },
         methods: {
+          setOriginalUri() {
+            if (window.location.href !== this.originalHref) {
+              window.history.replaceState('', window.document.title, this.originalUri);
+            }
+          },
           setDrawerOpened() {
             this.drawerOpened++;
           },

diff --git a/layout-webapp/src/main/webapp/vue-app/site-management/components/SiteCardMenu.vue b/layout-webapp/src/main/webapp/vue-app/site-management/components/SiteCardMenu.vue
@@ -166,9 +166,6 @@ export default {
     openSitePropertiesDrawer() {
       this.$root.$emit('open-site-properties-drawer', this.site);
     },
-    editSiteLayout() {
-      this.$siteLayoutService.editSiteLayout(this.site.name, this.site.type);
-    }
   }
 };
 </script>