From d1ad17bc5d68db94e0f58282a6b902990d0d9ca3 Mon Sep 17 00:00:00 2001 From: Dan Percic Date: Thu, 2 Mar 2023 12:22:20 +0200 Subject: [PATCH] RED-3800: some fixes --- README.md | 47 ++++++++----------- apps/red-ui/src/app/app.module.ts | 3 +- .../downloads-list-screen.component.ts | 12 +++-- .../dashboard-screen.component.html | 7 ++- .../dashboard-screen.component.ts | 18 +++---- .../app/modules/dashboard/dashboard.module.ts | 4 +- .../services/file-download.service.ts | 39 +++++---------- 7 files changed, 52 insertions(+), 78 deletions(-) diff --git a/README.md b/README.md index 361671cc8..d9ad3b041 100644 --- a/README.md +++ b/README.md @@ -1,39 +1,31 @@ # Redaction -## To Create a new Stack in rancher +### To Create a new Stack in rancher check [this Wiki page](https://wiki.iqser.com/pages/viewpage.action?spaceKey=RED&title=Work+with+kubectl) -Goto rancher.iqser.com: Select Cluster `Development`, go to apps, click launch and select `Redaction` from the `dev` -section. Add a new name and a new namespace. Select `answers-development.yaml` and add it to answers `Edit as yaml`. +## Code style -For HTTPS / Cloudflare domain go to `workloads` -> `Loadbalancing` -> `select your stack` -Add cloudflare certificate and specify a hostname to use `timo-redaction-dev.iqser.cloud` +* Always use `trackBy` in `*ngFor` loops (see shorthand below) + ```typescript + readonly trackBy = trackByFactory(); + ``` +* Don't use `setInterval` without calling `clearInterval` in `ngOnDestroy` ## Keycloak Staging Config -- keycloak: - - authServerUrl: 'https://redkc-staging.iqser.cloud/auth' -- client: - - secret: 'a4e8aa56-03b0-4e6b-b822-8ac1f41280c4' +- keycloak: + - authServerUrl: 'https://redkc-staging.iqser.cloud/auth' +- client: + - secret: 'a4e8aa56-03b0-4e6b-b822-8ac1f41280c4' -## Default Testing URL +## Default Testing URLs -`https://dev-04.iqser.cloud/` - -## Known errors - -- In case of CORS or redirect_uri errors follow these steps: - - Go to `.iqser.cloud/auth/admin/master/console` - - Login with `admin` and `admin1234` - - In the left menu go to `Clients` - - In the table click `redaction` - - Find `Valid Redirect URIs` input - - Under `/ui/*` add new value `http://localhost:4200/*` - - **Save** +* `https://dev-04.iqser.cloud/` +* `https://dev-08.iqser.cloud/` ## Test Users | username | role | comment | -| ------------ | ------------------------------ | -------------------------- | +|--------------|--------------------------------|----------------------------| | guest | | cannot use the application | | user | RED_USER | | | red_manager | RED_MANAGER | | @@ -44,12 +36,11 @@ Password for all users is `OsloImWinter!23` ### Running the app locally -Requirements: +Requirements: + * node 16 or newer installed ( https://nodejs.org/en/download/ ) * yarn ( execute `npm install -g yarn` in any terminal after installing node ) In the root folder simply execute `yarn install` followed by `yarn start`. -The file `apps/red-ui/src/assets/config.config.json` contains the configuration for local development. All properties defined here are later available via env variables. - - - +The file `apps/red-ui/src/assets/config.config.json` contains the configuration for local development. All properties +defined here are later available via env variables. diff --git a/apps/red-ui/src/app/app.module.ts b/apps/red-ui/src/app/app.module.ts index 3cae73141..0bfe6c1e0 100644 --- a/apps/red-ui/src/app/app.module.ts +++ b/apps/red-ui/src/app/app.module.ts @@ -198,8 +198,7 @@ export const appModuleFactory = (config: AppConfig) => { }, { provide: MAX_RETRIES_ON_SERVER_ERROR, - useFactory: (configService: ConfigService) => configService.values.MAX_RETRIES_ON_SERVER_ERROR, - deps: [ConfigService], + useFactory: () => config.MAX_RETRIES_ON_SERVER_ERROR, }, { provide: SERVER_ERROR_SKIP_PATHS, diff --git a/apps/red-ui/src/app/components/downloads-list-screen/downloads-list-screen.component.ts b/apps/red-ui/src/app/components/downloads-list-screen/downloads-list-screen.component.ts index 1b12bf330..13c2e96f9 100644 --- a/apps/red-ui/src/app/components/downloads-list-screen/downloads-list-screen.component.ts +++ b/apps/red-ui/src/app/components/downloads-list-screen/downloads-list-screen.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, OnDestroy } from '@angular/core'; import { FileDownloadService } from '@upload-download/services/file-download.service'; import { DownloadStatus } from '@red/domain'; import { CircleButtonTypes, ListingComponent, listingProvidersFactory, LoadingService, TableColumnConfig } from '@iqser/common-ui'; @@ -7,7 +7,6 @@ import { RouterHistoryService } from '@services/router-history.service'; import { firstValueFrom } from 'rxjs'; @Component({ - selector: 'redaction-downloads-list-screen', templateUrl: './downloads-list-screen.component.html', styleUrls: ['./downloads-list-screen.component.scss'], providers: listingProvidersFactory({ @@ -15,7 +14,7 @@ import { firstValueFrom } from 'rxjs'; component: DownloadsListScreenComponent, }), }) -export class DownloadsListScreenComponent extends ListingComponent { +export class DownloadsListScreenComponent extends ListingComponent implements OnDestroy { readonly circleButtonTypes = CircleButtonTypes; readonly tableHeaderLabel = _('downloads-list.table-header.title'); readonly tableColumnConfigs: TableColumnConfig[] = [ @@ -24,6 +23,7 @@ export class DownloadsListScreenComponent extends ListingComponent this._loadData(), 5000); + this.#interval = setInterval(() => this._loadData(), 5000); + } + + ngOnDestroy() { + clearInterval(this.#interval); } downloadItem(download: DownloadStatus) { diff --git a/apps/red-ui/src/app/modules/dashboard/dashboard-screen/dashboard-screen.component.html b/apps/red-ui/src/app/modules/dashboard/dashboard-screen/dashboard-screen.component.html index f95bbf6ad..60fe18e05 100644 --- a/apps/red-ui/src/app/modules/dashboard/dashboard-screen/dashboard-screen.component.html +++ b/apps/red-ui/src/app/modules/dashboard/dashboard-screen/dashboard-screen.component.html @@ -2,16 +2,15 @@
diff --git a/apps/red-ui/src/app/modules/dashboard/dashboard-screen/dashboard-screen.component.ts b/apps/red-ui/src/app/modules/dashboard/dashboard-screen/dashboard-screen.component.ts index 88e1d40f1..7ebd51e3c 100644 --- a/apps/red-ui/src/app/modules/dashboard/dashboard-screen/dashboard-screen.component.ts +++ b/apps/red-ui/src/app/modules/dashboard/dashboard-screen/dashboard-screen.component.ts @@ -1,23 +1,19 @@ -import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core'; -import { UserService } from '@users/user.service'; +import { Component, inject, OnInit } from '@angular/core'; import { DashboardStatsService } from '@services/dossier-templates/dashboard-stats.service'; import { UserPreferenceService } from '@users/user-preference.service'; +import { getCurrentUser, trackByFactory } from '@iqser/common-ui'; +import { User } from '@red/domain'; @Component({ - selector: 'redaction-dashboard-screen', templateUrl: './dashboard-screen.component.html', styleUrls: ['./dashboard-screen.component.scss'], - changeDetection: ChangeDetectionStrategy.OnPush, }) export class DashboardScreenComponent implements OnInit { - readonly currentUser = this._userService.currentUser; - readonly stats$ = this._dashboardStatsService.all$; + readonly currentUser = getCurrentUser(); + readonly stats$ = inject(DashboardStatsService).all$; + readonly trackBy = trackByFactory(); - constructor( - private readonly _userService: UserService, - private readonly _dashboardStatsService: DashboardStatsService, - private readonly _userPreferenceService: UserPreferenceService, - ) {} + constructor(private readonly _userPreferenceService: UserPreferenceService) {} async ngOnInit(): Promise { await this._userPreferenceService.saveLastDossierTemplate(null); diff --git a/apps/red-ui/src/app/modules/dashboard/dashboard.module.ts b/apps/red-ui/src/app/modules/dashboard/dashboard.module.ts index a9eca9460..6197c84c7 100644 --- a/apps/red-ui/src/app/modules/dashboard/dashboard.module.ts +++ b/apps/red-ui/src/app/modules/dashboard/dashboard.module.ts @@ -2,10 +2,9 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { DashboardScreenComponent } from './dashboard-screen/dashboard-screen.component'; import { RouterModule } from '@angular/router'; -import { SharedModule } from '../shared/shared.module'; +import { SharedModule } from '@shared/shared.module'; import { TemplateStatsComponent } from './components/template-stats/template-stats.component'; import { BreadcrumbTypes } from '@red/domain'; -import { SharedDossiersModule } from '../shared-dossiers/shared-dossiers.module'; import { TranslateModule } from '@ngx-translate/core'; import { IqserButtonsModule, IqserHelpModeModule, IqserPermissionsModule } from '@iqser/common-ui'; @@ -25,7 +24,6 @@ const routes = [ RouterModule.forChild(routes), CommonModule, SharedModule, - SharedDossiersModule, TranslateModule, IqserButtonsModule, IqserHelpModeModule, diff --git a/apps/red-ui/src/app/modules/upload-download/services/file-download.service.ts b/apps/red-ui/src/app/modules/upload-download/services/file-download.service.ts index 7bb2ea402..dc759108a 100644 --- a/apps/red-ui/src/app/modules/upload-download/services/file-download.service.ts +++ b/apps/red-ui/src/app/modules/upload-download/services/file-download.service.ts @@ -1,18 +1,9 @@ import { Injectable } from '@angular/core'; -import { - DownloadStatus, - IDownloadResponse, - IDownloadStatus, - IDownloadStatusResponse, - IPrepareDownloadRequest, - IRemoveDownloadRequest, -} from '@red/domain'; +import { DownloadStatus, IDownloadStatus, IDownloadStatusResponse, IPrepareDownloadRequest, IRemoveDownloadRequest } from '@red/domain'; import { firstValueFrom, Observable } from 'rxjs'; import { ConfigService } from '@services/config.service'; -import { map, switchMap, tap } from 'rxjs/operators'; -import { KeycloakService } from 'keycloak-angular'; -import { UserService } from '@users/user.service'; -import { EntitiesService, List, mapEach, RequiredParam, Validate } from '@iqser/common-ui'; +import { map, tap } from 'rxjs/operators'; +import { EntitiesService, mapEach, RequiredParam, Validate } from '@iqser/common-ui'; import { NGXLogger } from 'ngx-logger'; @Injectable() @@ -20,18 +11,13 @@ export class FileDownloadService extends EntitiesService { - const prepare = this.prepareDownload(request).pipe(switchMap(() => this.loadAll())); - return firstValueFrom(prepare); + async downloadFiles(request: IPrepareDownloadRequest) { + await this.prepareDownload(request); + return firstValueFrom(this.loadAll()); } loadAll(): Observable { @@ -46,7 +32,7 @@ export class FileDownloadService extends EntitiesService { - return this._post(body, `${this._defaultModelPath}/prepare-option`); + prepareDownload(@RequiredParam() body: IPrepareDownloadRequest) { + return firstValueFrom(this._post(body, `${this._defaultModelPath}/prepare-option`)); } @Validate() - generateToken(@RequiredParam() storageId: string): Observable<{ value: string }> { - return this._post<{ value: string }>({ value: storageId }, `${this._defaultModelPath}/generate-ott`); + generateToken(@RequiredParam() storageId: string) { + const request = this._post<{ value: string }>({ value: storageId }, `${this._defaultModelPath}/generate-ott`); + return firstValueFrom(request); } @Validate()