From 4ee4cd77ed57bb8037f9e43661206e8d370faddf Mon Sep 17 00:00:00 2001
From: Boubaker Khanfir <boubaker.khanfir@exoplatform.com>
Date: Thu, 16 Jan 2025 11:07:29 +0100
Subject: [PATCH] feat: Allow to save a Site as Template - MEED-8092 -
 Meeds-io/MIPs#173 (#292)

---
 .../content/common/ApplicationCard.vue        |  2 +-
 .../portlets/drawer/InstancesDrawer.vue       |  2 +-
 .../components/SiteManagement.vue             |  1 +
 .../site-management/components/main/Item.vue  |  5 +++-
 .../site-management/components/main/Menu.vue  | 24 ++++++++++++++++---
 .../site-template/components/main/Item.vue    |  5 +++-
 6 files changed, 32 insertions(+), 7 deletions(-)

diff --git a/layout-webapp/src/main/webapp/vue-app/layout-editor/components/content/common/ApplicationCard.vue b/layout-webapp/src/main/webapp/vue-app/layout-editor/components/content/common/ApplicationCard.vue
index 122053d96..4273d0393 100644
--- a/layout-webapp/src/main/webapp/vue-app/layout-editor/components/content/common/ApplicationCard.vue
+++ b/layout-webapp/src/main/webapp/vue-app/layout-editor/components/content/common/ApplicationCard.vue
@@ -53,7 +53,7 @@
           v-if="description"
           v-sanitized-html="description"
           :title="$utils.htmlToText(description)"
-          class="flex-grow-0 flex-shrink-0 subtitle-2 text-truncate-2 pt-0 text-sub-title"></div>
+          class="flex-grow-0 flex-shrink-0 text-truncate-2 pt-0 text-subtitle"></div>
         <div class="d-flex flex-grow-1 flex-shrink-1 justify-center mt-2 overflow-hidden">
           <layout-image-illustration
             ref="illustration"
diff --git a/layout-webapp/src/main/webapp/vue-app/portlets/components/portlets/drawer/InstancesDrawer.vue b/layout-webapp/src/main/webapp/vue-app/portlets/components/portlets/drawer/InstancesDrawer.vue
index d562b729d..063ba2249 100644
--- a/layout-webapp/src/main/webapp/vue-app/portlets/components/portlets/drawer/InstancesDrawer.vue
+++ b/layout-webapp/src/main/webapp/vue-app/portlets/components/portlets/drawer/InstancesDrawer.vue
@@ -42,7 +42,7 @@
           :key="application.id"
           dense>
           <v-list-item-content>
-            <v-list-item-title class="subtitle-2 text-color">
+            <v-list-item-title>
               <v-card
                 v-on="application.illustrationId && {
                   click: () => openIllustration(application)
diff --git a/layout-webapp/src/main/webapp/vue-app/site-management/components/SiteManagement.vue b/layout-webapp/src/main/webapp/vue-app/site-management/components/SiteManagement.vue
index 7fdcf5e53..12ab643e6 100644
--- a/layout-webapp/src/main/webapp/vue-app/site-management/components/SiteManagement.vue
+++ b/layout-webapp/src/main/webapp/vue-app/site-management/components/SiteManagement.vue
@@ -43,6 +43,7 @@
     <site-navigation-node-drawer />
     <site-navigation-element-drawer />
     <manage-permissions-drawer />
+    <site-template-drawer />
     <layout-analytics application-name="siteManagement" />
   </v-app>
 </template>
diff --git a/layout-webapp/src/main/webapp/vue-app/site-management/components/main/Item.vue b/layout-webapp/src/main/webapp/vue-app/site-management/components/main/Item.vue
index 6f95143ca..356c7622b 100644
--- a/layout-webapp/src/main/webapp/vue-app/site-management/components/main/Item.vue
+++ b/layout-webapp/src/main/webapp/vue-app/site-management/components/main/Item.vue
@@ -23,7 +23,10 @@
   <tr>
     <!-- Illustration -->
     <!-- name -->
-    <td colspan="2" align="left" class="pe-0">
+    <td
+      colspan="2"
+      align="left"
+      class="pe-0">
       <div class="d-flex align-center text-start">
         <v-card
           color="transparent"
diff --git a/layout-webapp/src/main/webapp/vue-app/site-management/components/main/Menu.vue b/layout-webapp/src/main/webapp/vue-app/site-management/components/main/Menu.vue
index dab6361c0..78dbe4e8e 100644
--- a/layout-webapp/src/main/webapp/vue-app/site-management/components/main/Menu.vue
+++ b/layout-webapp/src/main/webapp/vue-app/site-management/components/main/Menu.vue
@@ -42,7 +42,7 @@
         v-if="isPortalSite && !isGlobalSite"
         :aria-label="$t('siteManagement.label.properties')"
         role="button"
-        class="subtitle-2 px-3"
+        class="px-3"
         @click="openSitePropertiesDrawer">
         <v-card
           color="transparent"
@@ -61,7 +61,7 @@
       <v-list-item
         :aria-label="$t('siteManagement.label.navigation')"
         role="button"
-        class="subtitle-2 px-3"
+        class="px-3"
         @click="openSiteNavigationDrawer">
         <v-card
           color="transparent"
@@ -81,7 +81,7 @@
         v-if="!isGlobalSite"
         :aria-label="$t('siteManagement.label.manageAccess')"
         role="button"
-        class="subtitle-2 px-3"
+        class="px-3"
         @click="$root.$emit('open-manage-permissions-drawer', site, true, true)">
         <v-card
           color="transparent"
@@ -97,6 +97,21 @@
           <span class="ps-1">{{ $t('siteManagement.label.manageAccess') }}</span>
         </v-list-item-title>
       </v-list-item>
+      <v-list-item
+        dense
+        @click="saveAsTemplate">
+        <v-card
+          color="transparent"
+          min-width="15"
+          flat>
+          <v-icon size="13">
+            fa-columns
+          </v-icon>
+        </v-card>
+        <v-list-item-title class="ps-2">
+          {{ $t('sites.saveAsSiteTemplate') }}
+        </v-list-item-title>
+      </v-list-item>
       <v-tooltip
         v-if="canEditSite"
         :disabled="canDelete"
@@ -188,6 +203,9 @@ export default {
     openSitePropertiesDrawer() {
       this.$root.$emit('open-site-properties-drawer', this.site);
     },
+    saveAsTemplate() {
+      this.$root.$emit('site-template-add', null, this.site.siteId);
+    },
   }
 };
 </script>
\ No newline at end of file
diff --git a/layout-webapp/src/main/webapp/vue-app/site-template/components/main/Item.vue b/layout-webapp/src/main/webapp/vue-app/site-template/components/main/Item.vue
index 449c590fe..877ded174 100644
--- a/layout-webapp/src/main/webapp/vue-app/site-template/components/main/Item.vue
+++ b/layout-webapp/src/main/webapp/vue-app/site-template/components/main/Item.vue
@@ -23,7 +23,10 @@
   <tr>
     <!-- Illustration -->
     <!-- name -->
-    <td colspan="2" align="left" class="pe-0">
+    <td
+      colspan="2"
+      align="left"
+      class="pe-0">
       <div class="d-flex align-center text-start">
         <v-card
           color="transparent"