From 58e4cb865b2ceaa0fdafc183f71e1ca9d079b12e Mon Sep 17 00:00:00 2001
From: saraBoutej <sboutej@exoplatform.com>
Date: Fri, 5 Jul 2024 13:50:08 +0100
Subject: [PATCH 1/4] feat: Review UX to add node - MEED-6834 -
 Meeds-io/MIPs#137

---
 .../SiteNavigationElementDrawer.vue               |  2 +-
 .../SiteNavigationExistingPageElement.vue         |  4 ++--
 .../SiteNavigationNewPageElementItem.vue          | 15 +++++++++++----
 .../site-navigation/SiteNavigationNodeDrawer.vue  |  6 +++---
 4 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue
index 12e527b49..f4f819032 100644
--- a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue
+++ b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue
@@ -86,7 +86,7 @@ export default {
       return this.$t('siteNavigation.addElementDrawer.title');
     },
     disabled() {
-      return !this.isValidForm || !this.pageTemplate || false;
+      return !this.isValidForm || this.pageTemplate === 'empty'  || false;
     },
   },
   created() {
diff --git a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationExistingPageElement.vue b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationExistingPageElement.vue
index c574c557b..8d8503210 100644
--- a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationExistingPageElement.vue
+++ b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationExistingPageElement.vue
@@ -31,13 +31,13 @@
       v-if="!allSites"
       v-model="selectedSiteNavigation"
       :all-sites="allSites"
-      class="mb-6" />
+      :class="!allSites && 'mb-8' || ''" />
     <site-navigation-page-suggester
       :page="selectedPage"
       :all-sites="allSites"
       :site-type="selectedSiteNavigation?.siteType"
       :site-name="selectedSiteNavigation?.name"
-      class="mb-8" />
+      class="" />
   </div>
 </template>
 
diff --git a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationNewPageElementItem.vue b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationNewPageElementItem.vue
index 802d70a68..2d8f2df9e 100644
--- a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationNewPageElementItem.vue
+++ b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationNewPageElementItem.vue
@@ -21,7 +21,8 @@
   <div>
     <div
       :style="imageContainerStyle"
-      class="overflow-hidden border-color rounded pa-1 hover-elevation"
+      :class="selected && 'primary-border-color' || 'border-color'"
+      class="overflow-hidden rounded pa-1 hover-elevation"
       @click="selectTemplate">
       <img
         :src="illustrationSrc"
@@ -32,11 +33,11 @@
       <p
         v-if="title"
         v-sanitized-html="title"
-        class="mb-0 font-weight-regular text-truncate subtitle-2"></p>
+        class="mb-0 font-weight-regular text-truncate"></p>
       <p
         v-if="description"
         v-sanitized-html="description"
-        class="mb-0 caption text-truncate-2"></p>
+        class="mb-0 text-subtitle text-truncate-2"></p>
     </div>
   </div>
 </template>
@@ -48,6 +49,11 @@ export default {
       default: null
     },
   },
+  data() {
+    return {
+      selected: false
+    };
+  },
   computed: {
     title() {
       return this.pageTemplate?.name;
@@ -79,11 +85,12 @@ export default {
         'max-height': '100px',
         'height': '100px'
       };
-    },
+    }
   },
   methods: {
     selectTemplate() {
       this.$root.$emit('page-template-changed', this.pageTemplate);
+      this.selected = !this.selected;
     }
   }
 };
diff --git a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationNodeDrawer.vue b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationNodeDrawer.vue
index 9e144b634..ffefff534 100644
--- a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationNodeDrawer.vue
+++ b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationNodeDrawer.vue
@@ -112,7 +112,7 @@
                   <site-navigation-existing-page-element
                     v-if="!isNewPageElement"
                     :selected-page="selectedPage" />
-                  <div class="d-flex align-center justify-space-between flex-row ms-8 pb-2">
+                  <div class="d-flex align-center justify-space-between flex-row ms-8 pb-2 mt-2">
                     <span>
                       {{ $t('siteNavigation.label.openSameTab') }}
                     </span>
@@ -272,7 +272,7 @@ export default {
       isScheduled: false,
       disableNodeId: false,
       displayNodeName: false,
-      elementType: 'Group',
+      elementType: 'PAGE',
       allSites: true,
       nodeTarget: true,
       parentNavigationNodeUrl: '',
@@ -388,7 +388,7 @@ export default {
       this.visible = true;
       this.isScheduled = false;
       this.displayNodeName = false;
-      this.elementType = 'Group';
+      this.elementType = 'PAGE';
       this.nodeTarget = true;
       this.disableNodeId = false;
       this.editMode= false;

From 2a8a0fa9bf6a4a64849565a3188a3ea5c45851f5 Mon Sep 17 00:00:00 2001
From: saraBoutej <sboutej@exoplatform.com>
Date: Fri, 5 Jul 2024 14:18:24 +0100
Subject: [PATCH 2/4] PR review

---
 .../site-navigation/SiteNavigationElementDrawer.vue           | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue
index f4f819032..ee593e4d0 100644
--- a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue
+++ b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue
@@ -74,7 +74,7 @@ export default {
       navigationNode: null,
       elementName: null,
       elementTitle: null,
-      pageTemplate: 'empty',
+      pageTemplate: null,
       selectedPage: null,
       loading: false,
       resetDrawer: true,
@@ -86,7 +86,7 @@ export default {
       return this.$t('siteNavigation.addElementDrawer.title');
     },
     disabled() {
-      return !this.isValidForm || this.pageTemplate === 'empty'  || false;
+      return !this.isValidForm || !this.pageTemplate  || false;
     },
   },
   created() {

From 3ba0294a66701d2d071247c76739df1b3170b6e4 Mon Sep 17 00:00:00 2001
From: saraBoutej <sboutej@exoplatform.com>
Date: Fri, 5 Jul 2024 14:26:34 +0100
Subject: [PATCH 3/4] PR review

---
 .../components/site-navigation/SiteNavigationElementDrawer.vue  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue
index ee593e4d0..ce9f689ca 100644
--- a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue
+++ b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationElementDrawer.vue
@@ -86,7 +86,7 @@ export default {
       return this.$t('siteNavigation.addElementDrawer.title');
     },
     disabled() {
-      return !this.isValidForm || !this.pageTemplate  || false;
+      return !this.isValidForm || !this.pageTemplate || false;
     },
   },
   created() {

From 5c3d59053e04cc40f311555ecf7a2846baaa5db1 Mon Sep 17 00:00:00 2001
From: saraBoutej <sboutej@exoplatform.com>
Date: Fri, 5 Jul 2024 14:42:59 +0100
Subject: [PATCH 4/4] PR review

---
 .../site-navigation/SiteNavigationExistingPageElement.vue    | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationExistingPageElement.vue b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationExistingPageElement.vue
index 8d8503210..01e59ac0a 100644
--- a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationExistingPageElement.vue
+++ b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationExistingPageElement.vue
@@ -31,13 +31,12 @@
       v-if="!allSites"
       v-model="selectedSiteNavigation"
       :all-sites="allSites"
-      :class="!allSites && 'mb-8' || ''" />
+      :class="!allSites && 'mb-8'" />
     <site-navigation-page-suggester
       :page="selectedPage"
       :all-sites="allSites"
       :site-type="selectedSiteNavigation?.siteType"
-      :site-name="selectedSiteNavigation?.name"
-      class="" />
+      :site-name="selectedSiteNavigation?.name" />
   </div>
 </template>