Angular Pivot Table localization

import { Component, ViewChild } from "@angular/core";
import { FlexmonsterPivotModule, FlexmonsterPivot } from "ngx-flexmonster";

@Component({
  selector: "pivot-table-demo",
  templateUrl: "./pivot-table-demo.component.html",
  styleUrls: ["./pivot-table-demo.component.css"],
  imports: [FlexmonsterPivotModule]
})
export class PivotTableDemo {
  @ViewChild("pivot") pivotRef!: FlexmonsterPivot;

  protected report: Object = {
    dataSource: {
      type: "csv",
      filename: "https://cdn.flexmonster.com/data/data-en.csv"
    },
    slice: {
      rows: [
        {
          uniqueName: "Country"
        },
        {
          uniqueName: "Category"
        }
      ],
      columns: [
        {
          uniqueName: "Color"
        },
        {
          uniqueName: "[Measures]"
        }
      ],
      measures: [
        {
          uniqueName: "Price",
          aggregation: "sum",
          format: "currency"
        },
        {
          uniqueName: "Quantity",
          aggregation: "sum"
        }
      ]
    },
    options: {
      useCaptionsInCalculatedValueEditor: true
    },
    formats: [
      {
        name: "currency",
        currencySymbol: "$",
        thousandsSeparator: ",",
        decimalSeparator: ".",
        decimalPlaces: 2
      }
    ]
  };
  pdfFonts: any = {
    en: "https://cdn.flexmonster.com/fonts/NotoSans-Regular.ttf",
    fr: "https://cdn.flexmonster.com/fonts/NotoSans-Regular.ttf",
    it: "https://cdn.flexmonster.com/fonts/NotoSans-Regular.ttf",
    es: "https://cdn.flexmonster.com/fonts/NotoSans-Regular.ttf",
    pt: "https://cdn.flexmonster.com/fonts/NotoSans-Regular.ttf",
    zh: "https://cdn.flexmonster.com/fonts/NotoSansCJKsc-Regular.ttf",
    uk: "https://cdn.flexmonster.com/fonts/NotoSans-Regular.ttf"
  };

  currentLang = "en";

  setLocalization(lang: string) {
    this.currentLang = lang;
    const currentReport: any = this.pivotRef.flexmonster.getReport();
    currentReport.dataSource = {
      type: "json",
      filename: `https://cdn.flexmonster.com/data/localized/data-${lang}.json`,
      mapping: `https://cdn.flexmonster.com/data/localized/data-${lang}-mapping.json`
    };
    currentReport.localization = `https://cdn.flexmonster.com/loc/${lang}.json`;
    this.pivotRef.flexmonster.setReport(currentReport);
  }

  customizeToolbar(toolbar: Flexmonster.Toolbar) {
    toolbar.exportHandler = (type) => {
      if (type === "pdf") {
        this.pivotRef.flexmonster.exportTo(type, {
          fontUrl: this.pdfFonts[this.currentLang]
        });
      } else {
        this.pivotRef.flexmonster.exportTo(type);
      }
    };
    toolbar.showShareReportTab = true;
  }
}

<button (click)="setLocalization('en')">EN</button>
<button (click)="setLocalization('fr')">FR</button>
<button (click)="setLocalization('it')">IT</button>
<button (click)="setLocalization('es')">ES</button>
<button (click)="setLocalization('pt')">PT</button>
<button (click)="setLocalization('zh')">ZH</button>
<button (click)="setLocalization('uk')">UK</button>

<fm-pivot
  #pivot
  [height]="550"
  [toolbar]="true"
  [report]="report"
  (beforetoolbarcreated)="customizeToolbar($event)"
  [shareReportConnection]="{ url: 'https://olap.flexmonster.com:9500' }"
>
</fm-pivot>