fix: Fix Switch Page From Link to Page - MEED-6882 - Meeds-io/meeds#2019

(#71) Prior to this change, when szwitching a page from a link into a page to create using a page template, the page layout isn't displayed properly. This is due to the fact that the passed nodeId isn't of type id, in addition to the fact that the created page reference isn't updated when cloning the navigation.
Meeds-io · May 20, 2024 · 9020fad · 9020fad
1 parent 2a94781
commit 9020fad
Show file tree

Hide file tree

Showing 6 changed files with 21 additions and 6 deletions.
diff --git a/layout-service/src/main/java/io/meeds/layout/service/NavigationLayoutService.java b/layout-service/src/main/java/io/meeds/layout/service/NavigationLayoutService.java
@@ -150,6 +150,8 @@ public NodeData createDraftNode(Long nodeId, String username) throws ObjectNotFo
                                                   getNodeLabels(nodeId, username).getLabels()),
                         username);
     } else {
+      NodeState state = clonedNode.getState().builder().pageRef(clonedPageKey).build();
+      navigationService.updateNode(Long.parseLong(clonedNode.getId()), state);
       return navigationService.getNodeById(Long.parseLong(clonedNode.getId()));
     }
   }

diff --git a/.../main/webapp/vue-app/common-layout-components/components/site-navigation/NodeItemMenu.vue b/.../main/webapp/vue-app/common-layout-components/components/site-navigation/NodeItemMenu.vue
@@ -35,7 +35,7 @@
     </template>
     <v-list class="pa-0" dense>
       <v-list-item
-        v-if="canEditPage"
+        v-if="canEditPageLayout"
         class="subtitle-2" 
         @click="editLayout">
         <v-icon
@@ -234,6 +234,12 @@ export default {
     canEditPage() {
       return this.navigationNode?.canEditPage && this.pageRef;
     },
+    pageLink() {
+      return this.navigationNode?.pageLink;
+    },
+    canEditPageLayout() {
+      return this.canEditPage && !this.pageLink;
+    },
   },
   watch: {
     displayActionMenu() {

diff --git a/...e-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue b/...e-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue
@@ -241,7 +241,13 @@ export default {
         this.loading = false;
       } else {
         this.loading = true;
-        this.$pageLayoutService.createPage(this.elementName, this.elementTitle, this.navigationNode.siteKey.name, this.navigationNode.siteKey.type, this.elementType, this.elementType === 'LINK' && this.link || null, this.elementType === 'PAGE' && this.pageTemplate?.id)
+        this.$pageLayoutService.createPage(
+          this.elementName,
+          this.elementTitle,
+          this.navigationNode.siteKey.name,
+          this.navigationNode.siteKey.type,
+          this.elementType, this.elementType === 'LINK' && this.link || null,
+          this.elementType === 'PAGE' && this.pageTemplate?.id || null)
           .then((createdPage) => {
             const pageRef = createdPage?.key?.ref || `${createdPage?.key.site.typeName}::${createdPage?.key.site.name}::${createdPage?.pageContext?.key.name}`;
             this.$root.$emit('save-node-with-page', {

diff --git a/.../vue-app/common-layout-components/components/site-navigation/SiteNavigationNodeDrawer.vue b/.../vue-app/common-layout-components/components/site-navigation/SiteNavigationNodeDrawer.vue
@@ -410,7 +410,7 @@ export default {
         this.loading = true;
         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.openTargetPage(pageData, this.navigationNode.id);
             this.$root.$emit('refresh-navigation-nodes');
             this.$root.$emit('close-add-element-drawer');
             this.close();

diff --git a/layout-webapp/src/main/webapp/vue-app/layout-editor/components/LayoutEditor.vue b/layout-webapp/src/main/webapp/vue-app/layout-editor/components/LayoutEditor.vue
@@ -56,7 +56,7 @@ export default {
       return this.getQueryParam('pageId') || this.pageKey?.ref || (this.pageKey && `${this.pageKey.site.typeName}::${this.pageKey.site.name}::${this.pageKey.name}`);
     },
     nodeId() {
-      return this.getQueryParam('nodeId');
+      return this.getQueryParam('nodeId') || (this.pageTemplateId && eXo.env.portal.selectedNodeId);
     },
     draftNodeId() {
       return this.draftNode?.id;

diff --git a/layout-webapp/src/main/webapp/vue-app/layout-editor/components/content/Content.vue b/layout-webapp/src/main/webapp/vue-app/layout-editor/components/content/Content.vue
@@ -152,8 +152,8 @@ export default {
     },
     setLayout(layout) {
       this.initContainer(layout);
-      this.isCompatible = this.$layoutUtils.parseSections(layout);
-      if (!this.isCompatible) {
+      const isCompatible = this.$layoutUtils.parseSections(layout);
+      if (!isCompatible) {
         const applications = this.$layoutUtils.getApplications(layout);
         layout.children = [];
         const parentContainer = this.$layoutUtils.newParentContainer(layout);
@@ -162,6 +162,7 @@ export default {
         if (applications?.length && applications?.length > 1) {
           this.$layoutUtils.newSection(parentContainer, 1, 1, 2, this.$layoutUtils.flexTemplate);
         }
+        this.isCompatible = !applications?.length;
         this.modified = true;
       }
       if (this.layoutToEdit) {