Task/localize country name in admin user views (#7168)

* Localize country name

apps/client/src/app/components/admin-users/admin-users.component.ts

@@ -8,6 +8,7 @@ import { UserService } from '@ghostfolio/client/services/user/user.service';
 import { DEFAULT_LOCALE, DEFAULT_PAGE_SIZE } from '@ghostfolio/common/config';
 import { ConfirmationDialogType } from '@ghostfolio/common/enums';
 import {
+  getCountryName,
   getDateFnsLocale,
   getDateFormatString,
   getEmojiFlag
@@ -88,6 +89,7 @@ export class GfAdminUsersComponent implements OnInit {
   >();
   protected defaultDateFormat: string;
   protected displayedColumns: string[] = [];
+  protected readonly getCountryName = getCountryName;
   protected readonly getEmojiFlag = getEmojiFlag;
   protected hasPermissionForSubscription: boolean;
   protected hasPermissionToImpersonateAllUsers: boolean;

apps/client/src/app/components/admin-users/admin-users.html

@@ -60,9 +60,11 @@
                 class="mat-mdc-cell px-1 py-2"
                 mat-cell
               >
-                <span class="h5" [title]="element.country">{{
-                  getEmojiFlag(element.country)
-                }}</span>
+                <span
+                  class="h5"
+                  [title]="getCountryName({ code: element.country })"
+                  >{{ getEmojiFlag(element.country) }}</span
+                >
               </td>
             </ng-container>
           }

apps/client/src/app/components/user-detail-dialog/user-detail-dialog.component.ts

@@ -1,4 +1,4 @@
-import { getSum } from '@ghostfolio/common/helper';
+import { getCountryName, getSum } from '@ghostfolio/common/helper';
 import { AdminUserResponse } from '@ghostfolio/common/interfaces';
 import { AdminService, DataService } from '@ghostfolio/ui/services';
 import { GfValueComponent } from '@ghostfolio/ui/value';
@@ -50,6 +50,7 @@ import {
 })
 export class GfUserDetailDialogComponent implements OnInit {
   public baseCurrency: string;
+  public readonly getCountryName = getCountryName;
   public subscriptionsDataSource = new MatTableDataSource<Subscription>();
   public subscriptionsDisplayedColumns = [
     'createdAt',

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

@@ -74,7 +74,12 @@
           >
         </div>
         <div class="col-6 mb-3">
-          <gf-value i18n size="medium" [value]="user?.country"
+          <gf-value
+            i18n
+            size="medium"
+            [value]="
+              user?.country ? getCountryName({ code: user.country }) : '-'
+            "
             >Country</gf-value
           >
         </div>