Reorder charts (#2253)

apps/client/src/app/pages/portfolio/allocations/allocations-page.html

@@ -263,23 +263,18 @@
     <div class="col-md-4">
       <mat-card appearance="outlined" class="mb-3">
         <mat-card-header class="overflow-hidden w-100">
-          <mat-card-title class="align-items-center d-flex text-truncate"
-            ><span i18n>By Country</span
-            ><gf-premium-indicator
-              *ngIf="user?.subscription?.type === 'Basic'"
-              class="ml-1"
-            ></gf-premium-indicator
-          ></mat-card-title>
+          <mat-card-title class="text-truncate" i18n>By Account</mat-card-title>
         </mat-card-header>
         <mat-card-content>
           <gf-portfolio-proportion-chart
+            cursor="pointer"
             [baseCurrency]="user?.settings?.baseCurrency"
             [colorScheme]="user?.settings?.colorScheme"
             [isInPercent]="hasImpersonationId || user.settings.isRestrictedView"
-            [keys]="['name']"
+            [keys]="['id']"
             [locale]="user?.settings?.locale"
-            [maxItems]="10"
-            [positions]="countries"
+            [positions]="accounts"
+            (proportionChartClicked)="onAccountChartClicked($event)"
           ></gf-portfolio-proportion-chart>
         </mat-card-content>
       </mat-card>
@@ -287,18 +282,22 @@
     <div class="col-md-4">
       <mat-card appearance="outlined" class="mb-3">
         <mat-card-header class="overflow-hidden w-100">
-          <mat-card-title class="text-truncate" i18n>By Account</mat-card-title>
+          <mat-card-title class="align-items-center d-flex text-truncate"
+            ><span i18n>By ETF Provider</span
+            ><gf-premium-indicator
+              *ngIf="user?.subscription?.type === 'Basic'"
+              class="ml-1"
+            ></gf-premium-indicator
+          ></mat-card-title>
         </mat-card-header>
         <mat-card-content>
           <gf-portfolio-proportion-chart
-            cursor="pointer"
             [baseCurrency]="user?.settings?.baseCurrency"
             [colorScheme]="user?.settings?.colorScheme"
             [isInPercent]="hasImpersonationId || user.settings.isRestrictedView"
-            [keys]="['id']"
+            [keys]="['etfProvider']"
             [locale]="user?.settings?.locale"
-            [positions]="accounts"
-            (proportionChartClicked)="onAccountChartClicked($event)"
+            [positions]="positions"
           ></gf-portfolio-proportion-chart>
         </mat-card-content>
       </mat-card>
@@ -307,7 +306,7 @@
       <mat-card appearance="outlined" class="mb-3">
         <mat-card-header class="overflow-hidden w-100">
           <mat-card-title class="align-items-center d-flex text-truncate"
-            ><span i18n>By ETF Provider</span
+            ><span i18n>By Country</span
             ><gf-premium-indicator
               *ngIf="user?.subscription?.type === 'Basic'"
               class="ml-1"
@@ -319,9 +318,10 @@
             [baseCurrency]="user?.settings?.baseCurrency"
             [colorScheme]="user?.settings?.colorScheme"
             [isInPercent]="hasImpersonationId || user.settings.isRestrictedView"
-            [keys]="['etfProvider']"
+            [keys]="['name']"
             [locale]="user?.settings?.locale"
-            [positions]="positions"
+            [maxItems]="10"
+            [positions]="countries"
           ></gf-portfolio-proportion-chart>
         </mat-card-content>
       </mat-card>