From 39c85289cf6f17a47b296e28897dd9bd2125e7f4 Mon Sep 17 00:00:00 2001
From: cmoinier <cmoinier@wrk208.wrk.prs.camptocamp.com>
Date: Wed, 9 Oct 2024 14:00:01 +0200
Subject: [PATCH] feat: move sharing tool into mat-tab-group

---
 .../dataset-visualisation.component.html      | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/apps/datahub/src/app/dataset/dataset-visualisation/dataset-visualisation.component.html b/apps/datahub/src/app/dataset/dataset-visualisation/dataset-visualisation.component.html
index c3434ab5..7efb41f0 100644
--- a/apps/datahub/src/app/dataset/dataset-visualisation/dataset-visualisation.component.html
+++ b/apps/datahub/src/app/dataset/dataset-visualisation/dataset-visualisation.component.html
@@ -1,9 +1,9 @@
 <div
   class="flex flex-col"
-  [ngClass]="selectedView === 'map' ? 'gap-40' : 'gap-52'"
+  [ngClass]="selectedView === 'map' ? 'mb-52 sm:mb-72' : 'mb-72 sm:mb-80'"
 >
   <div
-    class="flex flex-col gap-8 overflow-visible sm:pt-5 mb-16"
+    class="flex flex-col gap-8 overflow-visible sm:pt-5"
     style="height: 512px"
   >
     <div class="flex flex-col">
@@ -21,6 +21,12 @@
       mat-align-tabs="start"
       [disableRipple]="true"
     >
+      <ng-template #dataViewShare>
+        <gn-ui-data-view-share
+          class="mb-6 hidden sm:block"
+          [viewType]="selectedView"
+        ></gn-ui-data-view-share>
+      </ng-template>
       <mat-tab [disabled]="!displayMap">
         <ng-template mat-tab-label>
           <span translate>mel.record.tab.map</span>
@@ -32,6 +38,7 @@
         <div class="block" style="height: 500px">
           <mel-datahub-map-view></mel-datahub-map-view>
         </div>
+        <ng-container *ngTemplateOutlet="dataViewShare"></ng-container>
         }
       </mat-tab>
       <mat-tab [disabled]="!displayData">
@@ -42,6 +49,7 @@
         <div class="block">
           <mel-datahub-data-view mode="table"></mel-datahub-data-view>
         </div>
+        <ng-container *ngTemplateOutlet="dataViewShare"></ng-container>
         }
       </mat-tab>
       <mat-tab [disabled]="!displayData">
@@ -52,14 +60,9 @@
         <div class="block">
           <mel-datahub-data-view mode="chart"></mel-datahub-data-view>
         </div>
+        <ng-container *ngTemplateOutlet="dataViewShare"></ng-container>
         }
       </mat-tab>
     </mat-tab-group>
   </div>
-  @if(displayData || displayMap) {
-  <gn-ui-data-view-share
-    class="hidden sm:block"
-    [viewType]="selectedView"
-  ></gn-ui-data-view-share>
-  }
 </div>