feat: Avoid displaying Layout edition after saving Navigation propert…

…ies - MEED-7677 - Meeds-io/meeds#2533 (#252) 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 4, 2024 · 7d612c9 · 7d612c9
1 parent c603093
commit 7d612c9
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>