Feature/move countries and sectors chart (#704)

* Move countries and sectors charts

* Update changelog

CHANGELOG.md

@@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## Unreleased
+
+### Changed
+
+- Moved the countries and sectors charts in the position detail dialog
+
 ## 1.116.0 - 16.02.2022
 
 ### Added

apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.html

@@ -144,6 +144,14 @@
         <ng-container
           *ngIf="SymbolProfile?.countries?.length === 1 && SymbolProfile?.sectors?.length === 1; else charts"
         >
+          <div *ngIf="SymbolProfile?.sectors?.length === 1" class="col-6 mb-3">
+            <gf-value
+              label="Sector"
+              size="medium"
+              [locale]="data.locale"
+              [value]="SymbolProfile.sectors[0].name"
+            ></gf-value>
+          </div>
           <div
             *ngIf="SymbolProfile?.countries?.length === 1"
             class="col-6 mb-3"
@@ -155,27 +163,8 @@
               [value]="SymbolProfile.countries[0].name"
             ></gf-value>
           </div>
-          <div *ngIf="SymbolProfile?.sectors?.length === 1" class="col-6 mb-3">
-            <gf-value
-              label="Sector"
-              size="medium"
-              [locale]="data.locale"
-              [value]="SymbolProfile.sectors[0].name"
-            ></gf-value>
-          </div>
         </ng-container>
         <ng-template #charts>
-          <div class="col-md-6 mb-3">
-            <div class="h4" i18n>Countries</div>
-            <gf-portfolio-proportion-chart
-              [baseCurrency]="user?.settings?.baseCurrency"
-              [isInPercent]="true"
-              [keys]="['name']"
-              [locale]="user?.settings?.locale"
-              [maxItems]="10"
-              [positions]="countries"
-            ></gf-portfolio-proportion-chart>
-          </div>
           <div class="col-md-6 mb-3">
             <div class="h4" i18n>Sectors</div>
             <gf-portfolio-proportion-chart
@@ -187,6 +176,17 @@
               [positions]="sectors"
             ></gf-portfolio-proportion-chart>
           </div>
+          <div class="col-md-6 mb-3">
+            <div class="h4" i18n>Countries</div>
+            <gf-portfolio-proportion-chart
+              [baseCurrency]="user?.settings?.baseCurrency"
+              [isInPercent]="true"
+              [keys]="['name']"
+              [locale]="user?.settings?.locale"
+              [maxItems]="10"
+              [positions]="countries"
+            ></gf-portfolio-proportion-chart>
+          </div>
         </ng-template>
       </ng-container>
     </div>