From 44855fb4dca09b7f3b5e39448b43af73c9aea4ee Mon Sep 17 00:00:00 2001
From: Boubaker Khanfir <boubaker.khanfir@exoplatform.com>
Date: Wed, 25 Sep 2024 15:41:20 +0100
Subject: [PATCH] feat: Review Site navigation button style - MEED-7543 -
 Meeds-io/meeds#273 (#223)

This change will use the same style for navigation button in top bar as
other displayed buttons.
---
 .../site-navigation/SiteNavigationDrawer.vue  |  2 +-
 .../components/SiteCardMenu.vue               | 13 ++-
 .../components/SiteNavigation.vue             |  4 +-
 .../components/SiteNavigationButton.vue       | 81 ++++---------------
 4 files changed, 24 insertions(+), 76 deletions(-)

diff --git a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationDrawer.vue b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationDrawer.vue
index e7f1ada36..f57a4eb8c 100644
--- a/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationDrawer.vue
+++ b/layout-webapp/src/main/webapp/vue-app/common-layout-components/components/site-navigation/SiteNavigationDrawer.vue
@@ -120,7 +120,7 @@ export default {
   methods: {
     open(event) {
       this.siteName = event?.siteName || eXo.env.portal.spaceDisplayName || eXo.env.portal.siteKeyName;
-      this.siteType = event?.siteType || 'PORTAL';
+      this.siteType = event?.siteType || eXo.env.portal.siteKeyType;
       this.siteId = event?.siteId || eXo.env.portal.siteId;
       this.includeGlobal = event?.includeGlobal || false;
       this.getNavigationNodes();
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
index 645007f57..271f03d98 100644
--- 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
@@ -117,23 +117,20 @@ export default {
     displayActionMenu: false,
   }),
   computed: {
-    isDefaultPortalSite() {
-      return this.site.name.toLowerCase() === eXo.env.portal.defaultPortalName.toLowerCase();
+    isMetaSite() {
+      return this.site.name === eXo.env.portal.defaultPortal;
     },
     isGlobalSite() {
-      return this.site.name.toLowerCase() === eXo.env.portal.globalPortalName.toLowerCase();
+      return this.site.name === 'global';
     },
     isGroupSite() {
       return this.site.siteType === 'GROUP';
     },
-    canDelete() {
-      return !(this.isDefaultPortalSite || this.isGlobalSite || this.isGroupSite);
-    },
     isPortalSite() {
       return this.site.siteType === 'PORTAL';
     },
-    canEditLayout() {
-      return !(this.isGlobalSite || this.isGroupSite) && (this.site?.metaSite || !this.site.displayed);
+    canDelete() {
+      return !this.isMetaSite && !this.isGlobalSite && !this.isGroupSite;
     },
     canEditSite() {
       return this.site.canEdit;
diff --git a/layout-webapp/src/main/webapp/vue-app/site-navigation/components/SiteNavigation.vue b/layout-webapp/src/main/webapp/vue-app/site-navigation/components/SiteNavigation.vue
index 59047da0f..fda14560b 100644
--- a/layout-webapp/src/main/webapp/vue-app/site-navigation/components/SiteNavigation.vue
+++ b/layout-webapp/src/main/webapp/vue-app/site-navigation/components/SiteNavigation.vue
@@ -18,9 +18,7 @@
 -->
 <template>
   <v-app v-if="canManageSiteNavigation && !isMobile">
-    <site-navigation-button
-      icon-class="text-color"
-      embedded />
+    <site-navigation-button />
     <site-navigation-drawers-actions />
     <layout-analytics application-name="siteNavigation" />
   </v-app>
diff --git a/layout-webapp/src/main/webapp/vue-app/site-navigation/components/SiteNavigationButton.vue b/layout-webapp/src/main/webapp/vue-app/site-navigation/components/SiteNavigationButton.vue
index f40ca9ae8..929778030 100644
--- a/layout-webapp/src/main/webapp/vue-app/site-navigation/components/SiteNavigationButton.vue
+++ b/layout-webapp/src/main/webapp/vue-app/site-navigation/components/SiteNavigationButton.vue
@@ -18,78 +18,31 @@
 -->
 <template>
   <v-tooltip bottom>
-    <template #activator="{ on, attrs }">
-      <v-card
-        :height="embedded && 22 || 'auto'"
-        :class="embedded && 'position-relative mx-2'"
-        class="transparent"
-        flat
-        v-bind="attrs"
-        v-on="on">
-        <v-btn
-          :aria-label="$t('siteNavigation.button.tooltip.label')"
-          :disabled="disabled"
-          :class="embedded && 'absolute-vertical-center mt-1'"
-          role="button"
-          outlined
-          icon
-          @click="openSiteNavigationDrawer">
-          <v-icon
-            :color="iconColor"
-            :class="iconClass"
-            size="16">
-            fas fa-sitemap
-          </v-icon>
-        </v-btn>
-      </v-card>
+    <template #activator="{on, bind}">
+      <v-btn
+        id="topBarSiteNavigation"
+        v-on="on"
+        v-bind="bind"
+        :role="'button'"
+        class="ms-5"
+        icon
+        @click="openSiteNavigationDrawer">
+        <v-icon size="20">fa-sitemap</v-icon>
+      </v-btn>
     </template>
     <span>{{ $t('siteNavigation.button.tooltip.label') }}</span>
   </v-tooltip>
 </template>
-
 <script>
 export default {
-  props: {
-    disabled: {
-      type: Boolean,
-      default: false,
-    },
-    embedded: {
-      type: Boolean,
-      default: false,
-    },
-    iconClass: {
-      type: String,
-      default: null,
-    },
-    iconColor: {
-      type: String,
-      default: null,
-    },
-    siteName: {
-      type: String,
-      default: null,
-    },
-    siteType: {
-      type: String,
-      default: null,
-    },
-    siteId: {
-      type: String,
-      default: null,
-    },
-  },
   methods: {
     openSiteNavigationDrawer() {
-      let params;
-      if (this.siteName && this.siteType) {
-        params = {
-          siteName: this.siteName,
-          siteType: this.siteType,
-          siteId: this.siteId,
-        };
-      }
-      document.dispatchEvent(new CustomEvent('open-site-navigation-drawer',{detail: params}));
+      document.dispatchEvent(new CustomEvent('open-site-navigation-drawer',{detail: {
+        siteName: this.siteName,
+        siteType: this.siteType,
+        siteId: this.siteId,
+        includeGlobal: eXo.env.portal.metaPortalName === eXo.env.portal.siteKeyName && eXo.env.portal.siteKeyType === 'portal',
+      }}));
     }
   }
 };