## Installation

Install submodule at `libs/common-ui`.

Install dependencies:

-   `yarn add keycloak-angular keycloak-js ngx-toastr @biesbjerg/ngx-translate-extract-marker @ngx-translate/core @ngx-translate/http-loader dayjs lodash-es ngx-translate-messageformat-compiler`
-   `yarn add @types/lodash-es -D`
-   `ng add @angular/material`

In `app.module.ts` add:

```
export function httpLoaderFactory(httpClient: HttpClient, configService: ConfigService): PruningTranslationLoader {
    return new PruningTranslationLoader(httpClient, '/assets/i18n/', `.json?version=${configService.values.FRONTEND_APP_VERSION}`);
}
```

```
 @NgModule({
    ...
    imports: [
        ...
        CommonUiModule,
        TranslateModule.forRoot({
            loader: {
                provide: TranslateLoader,
                useFactory: httpLoaderFactory,
                deps: [HttpClient, ConfigService],
            },
            compiler: {
                provide: TranslateCompiler,
                useClass: TranslateMessageFormatCompiler,
            },
        })
    ]
})
```

Rename `tsconfig.json` in root directory to `tsconfig.base.json`, and add the following to the `compilerOptions`
section:

```
"compilerOptions": {
   ...
    "paths": {
      ...
      "@iqser/common-ui": ["libs/common-ui/src/index.ts"]
    },
    "allowSyntheticDefaultImports": true
  },
```