From fadbf3489457b5a6bb333a02c1444a130f7dff0e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adina=20=C8=9Aeudan?= Date: Mon, 2 May 2022 20:04:58 +0300 Subject: [PATCH] RED-3796: Navigation WIP (no files) --- apps/red-ui/src/app/app-routing.module.ts | 145 +++++++++--------- .../base-screen/base-screen.component.html | 4 +- .../guards/dossier-template-exists.guard.ts | 5 +- .../modules/archive/archive-routing.module.ts | 6 +- .../archived-dossiers-screen.component.html | 6 +- .../template-stats.component.html | 16 +- .../template-stats.component.scss | 8 + .../template-stats.component.ts | 4 + .../app/modules/dashboard/dashboard.module.ts | 6 +- ...sier-overview-screen-header.component.html | 74 ++++----- .../dossier/dossiers-routing.module.ts | 6 +- .../dossiers-listing/config.service.ts | 23 +-- .../dossiers-listing-screen.component.html | 6 +- .../dossiers-type-switch.component.html | 9 ++ .../dossiers-type-switch.component.scss | 11 ++ .../dossiers-type-switch.component.ts | 9 ++ .../src/app/modules/shared/shared.module.ts | 6 +- .../src/app/services/breadcrumbs.service.ts | 84 +++++----- .../app/services/router-history.service.ts | 6 +- apps/red-ui/src/assets/i18n/de.json | 7 +- apps/red-ui/src/assets/i18n/en.json | 9 +- libs/common-ui | 2 +- .../dossier-template.model.ts | 4 + .../src/lib/dossiers/dossier.model.ts | 2 +- libs/red-domain/src/lib/files/file.model.ts | 4 +- .../src/lib/shared/breadcrumb-types.ts | 6 +- 26 files changed, 264 insertions(+), 204 deletions(-) create mode 100644 apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.html create mode 100644 apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.scss create mode 100644 apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.ts diff --git a/apps/red-ui/src/app/app-routing.module.ts b/apps/red-ui/src/app/app-routing.module.ts index 8bf52eec7..92a08b043 100644 --- a/apps/red-ui/src/app/app-routing.module.ts +++ b/apps/red-ui/src/app/app-routing.module.ts @@ -6,11 +6,12 @@ import { BaseScreenComponent } from '@components/base-screen/base-screen.compone import { RouteReuseStrategy, RouterModule, Routes } from '@angular/router'; import { NgModule } from '@angular/core'; import { DownloadsListScreenComponent } from '@components/downloads-list-screen/downloads-list-screen.component'; -import { DossierTemplatesGuard } from '@guards/dossier-templates.guard'; import { DossiersGuard } from '@guards/dossiers.guard'; import { ACTIVE_DOSSIERS_SERVICE, ARCHIVED_DOSSIERS_SERVICE } from './tokens'; import { FeaturesGuard } from '@guards/features-guard.service'; -import { DOSSIERS_ARCHIVE } from '@utils/constants'; +import { DOSSIER_TEMPLATE_ID, DOSSIERS_ARCHIVE } from '@utils/constants'; +import { DossierTemplatesGuard } from '@guards/dossier-templates.guard'; +import { DossierTemplateExistsGuard } from '@guards/dossier-template-exists.guard'; const routes: Routes = [ { @@ -18,81 +19,85 @@ const routes: Routes = [ redirectTo: 'main/dashboard', pathMatch: 'full', }, + { + path: 'main', + component: BaseScreenComponent, + children: [ + { + path: '', + redirectTo: 'dashboard', + pathMatch: 'full', + }, + { + path: 'account', + loadChildren: () => import('./modules/account/account.module').then(m => m.AccountModule), + }, + { + path: 'admin', + loadChildren: () => import('./modules/admin/admin.module').then(m => m.AdminModule), + }, + { + path: 'dashboard', + loadChildren: () => import('./modules/dashboard/dashboard.module').then(m => m.DashboardModule), + canActivate: [CompositeRouteGuard], + data: { + routeGuards: [AuthGuard, RedRoleGuard], + requiredRoles: ['RED_USER', 'RED_MANAGER'], + }, + }, + { + path: `:${DOSSIER_TEMPLATE_ID}/dossiers`, + loadChildren: () => import('./modules/dossier/dossiers.module').then(m => m.DossiersModule), + canActivate: [CompositeRouteGuard], + data: { + routeGuards: [AuthGuard, RedRoleGuard, DossierTemplatesGuard, DossierTemplateExistsGuard, DossiersGuard], + requiredRoles: ['RED_USER', 'RED_MANAGER'], + dossiersService: ACTIVE_DOSSIERS_SERVICE, + }, + }, + { + path: `:${DOSSIER_TEMPLATE_ID}/archive`, + loadChildren: () => import('./modules/archive/archive.module').then(m => m.ArchiveModule), + canActivate: [CompositeRouteGuard], + data: { + routeGuards: [FeaturesGuard, AuthGuard, RedRoleGuard, DossierTemplatesGuard, DossierTemplateExistsGuard, DossiersGuard], + requiredRoles: ['RED_USER', 'RED_MANAGER'], + dossiersService: ARCHIVED_DOSSIERS_SERVICE, + features: [DOSSIERS_ARCHIVE], + }, + }, + { + path: 'downloads', + component: DownloadsListScreenComponent, + canActivate: [CompositeRouteGuard], + data: { + routeGuards: [AuthGuard, RedRoleGuard], + }, + }, + { + path: 'search', + loadChildren: () => import('./modules/search/search.module').then(m => m.SearchModule), + canActivate: [CompositeRouteGuard], + data: { + routeGuards: [AuthGuard, RedRoleGuard, DossiersGuard], + requiredRoles: ['RED_USER', 'RED_MANAGER'], + }, + }, + { + path: `:${DOSSIER_TEMPLATE_ID}`, + redirectTo: `:${DOSSIER_TEMPLATE_ID}/dossiers`, + pathMatch: 'full', + }, + ], + }, { path: 'auth-error', component: AuthErrorComponent, canActivate: [AuthGuard], }, - { - path: 'main/account', - component: BaseScreenComponent, - loadChildren: () => import('./modules/account/account.module').then(m => m.AccountModule), - }, - { - path: 'main/admin', - component: BaseScreenComponent, - loadChildren: () => import('./modules/admin/admin.module').then(m => m.AdminModule), - }, - { - path: 'main/dashboard', - component: BaseScreenComponent, - loadChildren: () => import('./modules/dashboard/dashboard.module').then(m => m.DashboardModule), - canActivate: [CompositeRouteGuard], - data: { - routeGuards: [AuthGuard, RedRoleGuard], - requiredRoles: ['RED_USER', 'RED_MANAGER'], - }, - }, - { - path: 'main/dossiers', - component: BaseScreenComponent, - loadChildren: () => import('./modules/dossier/dossiers.module').then(m => m.DossiersModule), - canActivate: [CompositeRouteGuard], - data: { - routeGuards: [AuthGuard, RedRoleGuard, DossierTemplatesGuard, DossiersGuard], - requiredRoles: ['RED_USER', 'RED_MANAGER'], - dossiersService: ACTIVE_DOSSIERS_SERVICE, - }, - }, - { - path: 'main/archive', - component: BaseScreenComponent, - loadChildren: () => import('./modules/archive/archive.module').then(m => m.ArchiveModule), - canActivate: [CompositeRouteGuard], - data: { - routeGuards: [FeaturesGuard, AuthGuard, RedRoleGuard, DossierTemplatesGuard, DossiersGuard], - requiredRoles: ['RED_USER', 'RED_MANAGER'], - dossiersService: ARCHIVED_DOSSIERS_SERVICE, - features: [DOSSIERS_ARCHIVE], - }, - }, - { - path: 'main/downloads', - component: BaseScreenComponent, - children: [ - { - path: '', - component: DownloadsListScreenComponent, - }, - ], - canActivate: [CompositeRouteGuard], - data: { - routeGuards: [AuthGuard, RedRoleGuard], - }, - }, - { - path: 'main/search', - component: BaseScreenComponent, - loadChildren: () => import('./modules/search/search.module').then(m => m.SearchModule), - canActivate: [CompositeRouteGuard], - data: { - routeGuards: [AuthGuard, RedRoleGuard, DossiersGuard], - requiredRoles: ['RED_USER', 'RED_MANAGER'], - }, - }, { path: '**', - redirectTo: 'main/dossiers', + redirectTo: 'main/dashboard', pathMatch: 'full', }, ]; diff --git a/apps/red-ui/src/app/components/base-screen/base-screen.component.html b/apps/red-ui/src/app/components/base-screen/base-screen.component.html index 7040eba5c..2f6675b9e 100644 --- a/apps/red-ui/src/app/components/base-screen/base-screen.component.html +++ b/apps/red-ui/src/app/components/base-screen/base-screen.component.html @@ -7,12 +7,12 @@ -
diff --git a/apps/red-ui/src/app/guards/dossier-template-exists.guard.ts b/apps/red-ui/src/app/guards/dossier-template-exists.guard.ts index 850ba72ca..aa0bf8ec1 100644 --- a/apps/red-ui/src/app/guards/dossier-template-exists.guard.ts +++ b/apps/red-ui/src/app/guards/dossier-template-exists.guard.ts @@ -9,9 +9,10 @@ export class DossierTemplateExistsGuard implements CanActivate { async canActivate(route: ActivatedRouteSnapshot): Promise { const dossierTemplateId: string = route.paramMap.get(DOSSIER_TEMPLATE_ID); - if (!this._dossierTemplatesService.find(dossierTemplateId)) { - await this._router.navigate(['main', 'admin', 'dossier-templates']); + const adminView = !(route.routeConfig.path.includes('dossiers') || route.routeConfig.path.includes('archive')); + const routerPath = adminView ? ['main', 'admin', 'dossier-templates'] : ['']; + await this._router.navigate(routerPath); return false; } diff --git a/apps/red-ui/src/app/modules/archive/archive-routing.module.ts b/apps/red-ui/src/app/modules/archive/archive-routing.module.ts index 9a2774a25..d9b734f59 100644 --- a/apps/red-ui/src/app/modules/archive/archive-routing.module.ts +++ b/apps/red-ui/src/app/modules/archive/archive-routing.module.ts @@ -12,14 +12,14 @@ const routes: Routes = [ path: '', pathMatch: 'full', component: ArchivedDossiersScreenComponent, - data: { breadcrumbs: [BreadcrumbTypes.archive] }, + data: { breadcrumbs: [BreadcrumbTypes.dossierTemplate] }, }, { path: `:${DOSSIER_ID}`, canActivate: [CompositeRouteGuard], data: { routeGuards: [DossierFilesGuard], - breadcrumbs: [BreadcrumbTypes.archive, BreadcrumbTypes.dossier], + breadcrumbs: [BreadcrumbTypes.dossierTemplate, BreadcrumbTypes.dossier], dossiersService: ARCHIVED_DOSSIERS_SERVICE, }, loadChildren: () => import('../dossier-overview/dossier-overview.module').then(m => m.DossierOverviewModule), @@ -29,7 +29,7 @@ const routes: Routes = [ canActivate: [CompositeRouteGuard], data: { routeGuards: [DossierFilesGuard], - breadcrumbs: [BreadcrumbTypes.archive, BreadcrumbTypes.dossier, BreadcrumbTypes.file], + breadcrumbs: [BreadcrumbTypes.dossierTemplate, BreadcrumbTypes.dossier, BreadcrumbTypes.file], dossiersService: ARCHIVED_DOSSIERS_SERVICE, }, loadChildren: () => import('../file-preview/file-preview.module').then(m => m.FilePreviewModule), diff --git a/apps/red-ui/src/app/modules/archive/screens/archived-dossiers-screen/archived-dossiers-screen.component.html b/apps/red-ui/src/app/modules/archive/screens/archived-dossiers-screen/archived-dossiers-screen.component.html index 5786e6f44..520f31b7f 100644 --- a/apps/red-ui/src/app/modules/archive/screens/archived-dossiers-screen/archived-dossiers-screen.component.html +++ b/apps/red-ui/src/app/modules/archive/screens/archived-dossiers-screen/archived-dossiers-screen.component.html @@ -1,5 +1,9 @@
- + + + + +
diff --git a/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.html b/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.html index 663ca4131..1eb4e5072 100644 --- a/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.html +++ b/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.html @@ -1,11 +1,13 @@ -
- - - - - +
+ + {{ dossierTemplate.name }} +
+ +
+
stats2
+ -
+
{{ dossierTemplate.name }} diff --git a/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.scss b/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.scss index 090ade28f..7f20e26b4 100644 --- a/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.scss +++ b/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.scss @@ -3,6 +3,14 @@ max-width: unset; margin: 0 0 16px 0; + .heading { + color: var(--iqser-accent); + + &:not(:hover) { + text-decoration: none; + } + } + > div { padding: 24px; display: flex; diff --git a/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.ts b/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.ts index 87f9e76ae..bf1042717 100644 --- a/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.ts +++ b/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.ts @@ -33,6 +33,10 @@ export class TemplateStatsComponent implements OnChanges { this.stats$ = this.#ngOnChanges$.pipe(switchMap(id => this._dossierTemplateStatsService.watch$(id))); } + get empty(): boolean { + return false; + } + ngOnChanges() { if (this.dossierTemplateId) { this.#ngOnChanges$.next(this.dossierTemplateId); 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 588c40d67..00d7d285c 100644 --- a/apps/red-ui/src/app/modules/dashboard/dashboard.module.ts +++ b/apps/red-ui/src/app/modules/dashboard/dashboard.module.ts @@ -7,13 +7,17 @@ import { TemplateStatsComponent } from './components/template-stats/template-sta import { DossierTemplatesGuard } from '../../guards/dossier-templates.guard'; import { CompositeRouteGuard } from '@iqser/common-ui'; import { SharedDossiersModule } from '../dossier/shared/shared-dossiers.module'; +import { BreadcrumbTypes } from '@red/domain'; const routes = [ { path: '', component: DashboardScreenComponent, canActivate: [CompositeRouteGuard], - data: { routeGuards: [DossierTemplatesGuard] }, + data: { + routeGuards: [DossierTemplatesGuard], + breadcrumbs: [BreadcrumbTypes.dashboard], + }, }, ]; diff --git a/apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html b/apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html index 15b9a88a0..c0a317eba 100644 --- a/apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html +++ b/apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html @@ -5,45 +5,47 @@ [showCloseButton]="true" [viewModeSelection]="viewModeSelection" > - + + - + - + - + + diff --git a/apps/red-ui/src/app/modules/dossier/dossiers-routing.module.ts b/apps/red-ui/src/app/modules/dossier/dossiers-routing.module.ts index 2112b6bdf..98342b542 100644 --- a/apps/red-ui/src/app/modules/dossier/dossiers-routing.module.ts +++ b/apps/red-ui/src/app/modules/dossier/dossiers-routing.module.ts @@ -12,7 +12,7 @@ const routes: Routes = [ canActivate: [CompositeRouteGuard], data: { routeGuards: [DossierFilesGuard], - breadcrumbs: [BreadcrumbTypes.main, BreadcrumbTypes.dossier], + breadcrumbs: [BreadcrumbTypes.dossierTemplate, BreadcrumbTypes.dossier], dossiersService: ACTIVE_DOSSIERS_SERVICE, }, loadChildren: () => import('../dossier-overview/dossier-overview.module').then(m => m.DossierOverviewModule), @@ -22,7 +22,7 @@ const routes: Routes = [ canActivate: [CompositeRouteGuard], data: { routeGuards: [DossierFilesGuard], - breadcrumbs: [BreadcrumbTypes.main, BreadcrumbTypes.dossier, BreadcrumbTypes.file], + breadcrumbs: [BreadcrumbTypes.dossierTemplate, BreadcrumbTypes.dossier, BreadcrumbTypes.file], dossiersService: ACTIVE_DOSSIERS_SERVICE, }, loadChildren: () => import('../file-preview/file-preview.module').then(m => m.FilePreviewModule), @@ -31,7 +31,7 @@ const routes: Routes = [ path: '', pathMatch: 'full', loadChildren: () => import('../dossiers-listing/dossiers-listing.module').then(m => m.DossiersListingModule), - data: { breadcrumbs: [BreadcrumbTypes.main] }, + data: { breadcrumbs: [BreadcrumbTypes.dossierTemplate] }, }, ]; diff --git a/apps/red-ui/src/app/modules/dossiers-listing/config.service.ts b/apps/red-ui/src/app/modules/dossiers-listing/config.service.ts index 2861a033f..ee63347c8 100644 --- a/apps/red-ui/src/app/modules/dossiers-listing/config.service.ts +++ b/apps/red-ui/src/app/modules/dossiers-listing/config.service.ts @@ -6,9 +6,8 @@ import { TranslateService } from '@ngx-translate/core'; import { UserPreferenceService } from '@services/user-preference.service'; import { UserService } from '@services/user.service'; import { workflowFileStatusTranslations } from '../../translations/file-status-translations'; -import { dossierMemberChecker, dossierStateChecker, dossierTemplateChecker, RedactionFilterSorter } from '../../utils'; +import { dossierMemberChecker, dossierStateChecker, RedactionFilterSorter } from '../../utils'; import { workloadTranslations } from '../dossier/translations/workload-translations'; -import { DossierTemplatesService } from '@services/entity-services/dossier-templates.service'; import { DossierStatsService } from '@services/dossiers/dossier-stats.service'; import { DossierStatesMapService } from '@services/entity-services/dossier-states-map.service'; import { DossiersDialogService } from '../dossier/services/dossiers-dialog.service'; @@ -19,7 +18,6 @@ export class ConfigService { private readonly _translateService: TranslateService, private readonly _userPreferenceService: UserPreferenceService, private readonly _userService: UserService, - private readonly _dossierTemplatesService: DossierTemplatesService, private readonly _dossierStatsService: DossierStatsService, private readonly _dossierStatesMapService: DossierStatesMapService, private readonly _dialogService: DossiersDialogService, @@ -57,7 +55,6 @@ export class ConfigService { const allDistinctFileStatus = new Set(); const allDistinctPeople = new Set(); const allDistinctNeedsWork = new Set(); - const allDistinctDossierTemplates = new Set(); const allDistinctDossierStates = new Set(); const stateToTemplateMap = new Map(); @@ -66,7 +63,6 @@ export class ConfigService { entities?.forEach(entry => { entry.memberIds.forEach(f => allDistinctPeople.add(f)); - allDistinctDossierTemplates.add(entry.dossierTemplateId); if (entry.dossierStatusId) { allDistinctDossierStates.add(entry.dossierStatusId); stateToTemplateMap.set(entry.dossierStatusId, entry.dossierTemplateId); @@ -160,23 +156,6 @@ export class ConfigService { matchAll: true, }); - const dossierTemplateFilters = [...allDistinctDossierTemplates].map( - id => - new NestedFilter({ - id: id, - label: this._dossierTemplatesService.find(id)?.name || '-', - }), - ); - - filterGroups.push({ - slug: 'dossierTemplateFilters', - label: this._translateService.instant('filters.dossier-templates'), - icon: 'red:template', - hide: dossierTemplateFilters.length <= 1, - filters: dossierTemplateFilters, - checker: dossierTemplateChecker, - }); - filterGroups.push({ slug: 'quickFilters', filters: this._quickFilters(entities), diff --git a/apps/red-ui/src/app/modules/dossiers-listing/screen/dossiers-listing-screen.component.html b/apps/red-ui/src/app/modules/dossiers-listing/screen/dossiers-listing-screen.component.html index 23835ba78..9f0d65e65 100644 --- a/apps/red-ui/src/app/modules/dossiers-listing/screen/dossiers-listing-screen.component.html +++ b/apps/red-ui/src/app/modules/dossiers-listing/screen/dossiers-listing-screen.component.html @@ -1,5 +1,9 @@
- + + + + +
diff --git a/apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.html b/apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.html new file mode 100644 index 000000000..773a1e2b2 --- /dev/null +++ b/apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.html @@ -0,0 +1,9 @@ + + {{ 'dossiers-type-switch.active' | translate }} + + + + {{ 'dossiers-type-switch.archive' | translate }} + + +
diff --git a/apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.scss b/apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.scss new file mode 100644 index 000000000..0f3831df2 --- /dev/null +++ b/apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.scss @@ -0,0 +1,11 @@ +:host { + display: flex; +} + +.separator { + background-color: var(--iqser-separator); + width: 1px; + height: 30px; + margin-left: 8px; + margin-right: 16px; +} diff --git a/apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.ts b/apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.ts new file mode 100644 index 000000000..3f4a5b308 --- /dev/null +++ b/apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.ts @@ -0,0 +1,9 @@ +import { ChangeDetectionStrategy, Component } from '@angular/core'; + +@Component({ + selector: 'redaction-dossiers-type-switch', + templateUrl: './dossiers-type-switch.component.html', + styleUrls: ['./dossiers-type-switch.component.scss'], + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class DossiersTypeSwitchComponent {} diff --git a/apps/red-ui/src/app/modules/shared/shared.module.ts b/apps/red-ui/src/app/modules/shared/shared.module.ts index 40152677f..e77823834 100644 --- a/apps/red-ui/src/app/modules/shared/shared.module.ts +++ b/apps/red-ui/src/app/modules/shared/shared.module.ts @@ -31,6 +31,9 @@ import { FileNameColumnComponent } from '@shared/components/file-name-column/fil import { DossierNameColumnComponent } from '@shared/components/dossier-name-column/dossier-name-column.component'; import { MAT_DATE_FORMATS } from '@angular/material/core'; import { DragDropFileUploadDirective } from '@shared/directives/drag-drop-file-upload.directive'; +import { DossiersTypeSwitchComponent } from '@shared/components/dossiers-type-switch/dossiers-type-switch.component'; +import { TranslateModule } from '@ngx-translate/core'; +import { RouterModule } from '@angular/router'; const buttons = [FileDownloadBtnComponent, UserButtonComponent]; @@ -51,6 +54,7 @@ const components = [ DossierNameColumnComponent, FileStatsComponent, FileNameColumnComponent, + DossiersTypeSwitchComponent, ...buttons, ]; @@ -61,7 +65,7 @@ const modules = [MatConfigModule, ScrollingModule, IconsModule, FormsModule, Rea @NgModule({ declarations: [...components, ...utils, EditorComponent], - imports: [CommonModule, ...modules, MonacoEditorModule], + imports: [CommonModule, ...modules, MonacoEditorModule, TranslateModule, RouterModule], exports: [...modules, ...components, ...utils], providers: [ { diff --git a/apps/red-ui/src/app/services/breadcrumbs.service.ts b/apps/red-ui/src/app/services/breadcrumbs.service.ts index 12238cd6b..0ac465ea4 100644 --- a/apps/red-ui/src/app/services/breadcrumbs.service.ts +++ b/apps/red-ui/src/app/services/breadcrumbs.service.ts @@ -6,10 +6,11 @@ import { filter, pluck } from 'rxjs/operators'; import { FilesMapService } from '@services/entity-services/files-map.service'; import { TranslateService } from '@ngx-translate/core'; import { BreadcrumbTypes } from '@red/domain'; -import { DOSSIER_ID, DOSSIERS_ARCHIVE, FILE_ID } from '@utils/constants'; +import { DOSSIER_ID, DOSSIER_TEMPLATE_ID, DOSSIERS_ARCHIVE, FILE_ID } from '@utils/constants'; import { DossiersService } from '@services/dossiers/dossiers.service'; import { dossiersServiceResolver } from '@services/entity-services/dossiers.service.provider'; import { FeaturesService } from '@services/features.service'; +import { DossierTemplatesService } from '@services/entity-services/dossier-templates.service'; export type RouterLinkActiveOptions = { exact: boolean } | IsActiveMatchOptions; export type BreadcrumbDisplayType = 'text' | 'dropdown'; @@ -40,6 +41,7 @@ export class BreadcrumbsService { private readonly _router: Router, private readonly _translateService: TranslateService, private readonly _filesMapService: FilesMapService, + private readonly _dossierTemplatesService: DossierTemplatesService, private readonly _featuresService: FeaturesService, ) { this.breadcrumbs$ = this._store$.asObservable(); @@ -59,23 +61,12 @@ export class BreadcrumbsService { return dossiersServiceResolver(this._injector); } - private get _mainBreadcrumb(): Breadcrumb { + private get _dashboardBreadcrumb(): Breadcrumb { return { - name$: of(this._translateService.instant('top-bar.navigation-items.dossiers')), + name$: of(this._translateService.instant('top-bar.navigation-items.dashboard')), type: 'text' as BreadcrumbDisplayType, options: { - routerLink: ['/main', 'dossiers'], - routerLinkActiveOptions: { exact: true }, - }, - }; - } - - private get _archiveBreadcrumb(): Breadcrumb { - return { - name$: of(this._translateService.instant('top-bar.navigation-items.archived-dossiers')), - type: 'text' as BreadcrumbDisplayType, - options: { - routerLink: ['/main', 'archive'], + routerLink: ['/main', 'dashboard'], routerLinkActiveOptions: { exact: true }, }, }; @@ -89,81 +80,94 @@ export class BreadcrumbsService { this._store$.next([]); } - private _addBreadcrumbs(route: ActivatedRouteSnapshot) { + private _addBreadcrumbs(route: ActivatedRouteSnapshot, params: Record = {}) { if (route.firstChild) { - this._addBreadcrumbs(route.firstChild); + this._addBreadcrumbs(route.firstChild, { ...params, ...route.params }); return; } const breadcrumbs = route.data.breadcrumbs || []; if (breadcrumbs.length === 1 && this._featuresService.isEnabled(DOSSIERS_ARCHIVE)) { - if (breadcrumbs[0] === BreadcrumbTypes.main) { - this._addMainDropdownBreadcrumb('active'); + if (breadcrumbs[0] === BreadcrumbTypes.dossierTemplate) { + this._addDossierTemplateDropdown(params); return; } - if (breadcrumbs[0] === BreadcrumbTypes.archive) { - this._addMainDropdownBreadcrumb('archived'); + if (breadcrumbs[0] === BreadcrumbTypes.dashboard) { + this._append(this._dashboardBreadcrumb); return; } } for (const breadcrumb of breadcrumbs) { switch (breadcrumb) { - case BreadcrumbTypes.main: - this._append(this._mainBreadcrumb); - break; - case BreadcrumbTypes.archive: - this._append(this._archiveBreadcrumb); + case BreadcrumbTypes.dossierTemplate: + this._append(this._dossierTemplateBreadcrumb(params)); break; case BreadcrumbTypes.dossier: - this._addDossierBreadcrumb(route); + this._addDossierBreadcrumb(params); break; case BreadcrumbTypes.file: - this._addFileBreadcrumb(route); + this._addFileBreadcrumb(params); break; } } } - private _addMainDropdownBreadcrumb(type: 'active' | 'archived'): void { - const activeDossiers: Breadcrumb = this._mainBreadcrumb; - const archivedDossiers: Breadcrumb = this._archiveBreadcrumb; - const activeOption = type === 'active' ? activeDossiers : archivedDossiers; + private _addDossierTemplateDropdown(params: Record): void { + const breadcrumbs = this._dossierTemplatesService.all.map(dossierTemplate => + this._dossierTemplateBreadcrumb({ dossierTemplateId: dossierTemplate.id }), + ); + const activeOption = breadcrumbs.find(b => b.options.routerLink[1] === params[DOSSIER_TEMPLATE_ID]); this._append({ name$: activeOption.name$, type: 'dropdown' as BreadcrumbDisplayType, options: { - options: [activeDossiers, archivedDossiers], + options: breadcrumbs, activeOption, }, }); } - private _addDossierBreadcrumb(route: ActivatedRouteSnapshot): void { + private _dossierTemplateBreadcrumb(params: Record): Breadcrumb { + const dossierTemplateId: string = params[DOSSIER_TEMPLATE_ID]; + return { + name$: this._dossierTemplatesService.getEntityChanged$(dossierTemplateId).pipe(pluck('name')), + type: 'text' as BreadcrumbDisplayType, + options: { + routerLink: ['/main', dossierTemplateId], + routerLinkActiveOptions: { exact: true }, + clamp: true, + }, + }; + } + + private _addDossierBreadcrumb(params: Record): void { const dossiersService = this._dossiersService; - const dossierId = route.paramMap.get(DOSSIER_ID); + const dossierId: string = params[DOSSIER_ID]; + const dossierTemplateId: string = params[DOSSIER_TEMPLATE_ID]; this._append({ name$: dossiersService.getEntityChanged$(dossierId).pipe(pluck('dossierName')), type: 'text' as BreadcrumbDisplayType, options: { - routerLink: ['/main', dossiersService.routerPath, dossierId], + routerLink: ['/main', dossierTemplateId, dossiersService.routerPath, dossierId], routerLinkActiveOptions: { exact: true }, clamp: true, }, }); } - private _addFileBreadcrumb(route: ActivatedRouteSnapshot): void { - const dossierId = route.paramMap.get(DOSSIER_ID); - const fileId = route.paramMap.get(FILE_ID); + private _addFileBreadcrumb(params: Record): void { + const dossierTemplateId: string = params[DOSSIER_TEMPLATE_ID]; + const dossierId: string = params[DOSSIER_ID]; + const fileId: string = params[FILE_ID]; const dossiersService = this._dossiersService; this._append({ name$: this._filesMapService.watch$(dossierId, fileId).pipe(pluck('filename')), type: 'text' as BreadcrumbDisplayType, options: { - routerLink: ['/main', dossiersService.routerPath, dossierId, 'file', fileId], + routerLink: ['/main', dossierTemplateId, dossiersService.routerPath, dossierId, 'file', fileId], clamp: true, }, }); diff --git a/apps/red-ui/src/app/services/router-history.service.ts b/apps/red-ui/src/app/services/router-history.service.ts index 5e87a8b82..62fc4177a 100644 --- a/apps/red-ui/src/app/services/router-history.service.ts +++ b/apps/red-ui/src/app/services/router-history.service.ts @@ -6,11 +6,11 @@ import { filter } from 'rxjs/operators'; providedIn: 'root', }) export class RouterHistoryService { - private _lastDossiersScreen = '/main/dossiers'; + private _lastDossiersScreen = '/'; constructor(private readonly _router: Router) { this._router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe((event: NavigationEnd) => { - if (event.url.startsWith('/main/dossiers')) { + if (event.url.includes('/dossiers') || event.url.includes('/archive')) { this._lastDossiersScreen = event.url; } }); @@ -18,7 +18,7 @@ export class RouterHistoryService { navigateToLastDossiersScreen(): void { if (this._router.url === this._lastDossiersScreen) { - this._router.navigate(['/main/dossiers']); + this._router.navigate(['/']); } else { this._router.navigate([this._lastDossiersScreen]); } diff --git a/apps/red-ui/src/assets/i18n/de.json b/apps/red-ui/src/assets/i18n/de.json index c1a3b4833..c7e80f795 100644 --- a/apps/red-ui/src/assets/i18n/de.json +++ b/apps/red-ui/src/assets/i18n/de.json @@ -976,6 +976,10 @@ "incomplete": "" } }, + "dossiers-type-switch": { + "active": "", + "archive": "" + }, "download-includes": "Wählen Sie die Dokumente für Ihr Download-Paket aus", "download-status": { "queued": "Ihr Download wurde zur Warteschlange hinzugefügt. Hier finden Sie alle angeforderten Downloads: My Downloads." @@ -1877,9 +1881,8 @@ }, "top-bar": { "navigation-items": { - "archived-dossiers": "", "back": "Zurück", - "dossiers": "Aktives Dossier", + "dashboard": "", "my-account": { "children": { "account": "Konto", diff --git a/apps/red-ui/src/assets/i18n/en.json b/apps/red-ui/src/assets/i18n/en.json index a606856e6..506ab0e25 100644 --- a/apps/red-ui/src/assets/i18n/en.json +++ b/apps/red-ui/src/assets/i18n/en.json @@ -976,6 +976,10 @@ "incomplete": "Incomplete" } }, + "dossiers-type-switch": { + "active": "Active", + "archive": "Archived" + }, "download-includes": "Choose what is included at download:", "download-status": { "queued": "Your download has been queued, you can see all your requested downloads here: My Downloads." @@ -1393,7 +1397,7 @@ "dossier-state": "Dossier State", "dossier-templates": "Dossier Templates", "empty": "Empty", - "filter-by": "Filter:", + "filter-by": "Filter by:", "needs-work": "Workload", "people": "Dossier Member(s)" }, @@ -1877,9 +1881,8 @@ }, "top-bar": { "navigation-items": { - "archived-dossiers": "Archived Dossiers", "back": "Back", - "dossiers": "Active Dossiers", + "dashboard": "Dashboard", "my-account": { "children": { "account": "Account", diff --git a/libs/common-ui b/libs/common-ui index d815449b4..7bc942ae1 160000 --- a/libs/common-ui +++ b/libs/common-ui @@ -1 +1 @@ -Subproject commit d815449b409ce3bd04f8f7fddbb74fe6ed5ef9b5 +Subproject commit 7bc942ae164164dadba94045f1f249a6cbb17284 diff --git a/libs/red-domain/src/lib/dossier-templates/dossier-template.model.ts b/libs/red-domain/src/lib/dossier-templates/dossier-template.model.ts index 703853f39..82f5cc5d3 100644 --- a/libs/red-domain/src/lib/dossier-templates/dossier-template.model.ts +++ b/libs/red-domain/src/lib/dossier-templates/dossier-template.model.ts @@ -47,4 +47,8 @@ export class DossierTemplate implements IDossierTemplate, IListable { get routerLink(): string { return `/main/admin/dossier-templates/${this.dossierTemplateId}`; } + + get dossiersRouterLink(): string { + return `/main/${this.dossierTemplateId}/dossiers`; + } } diff --git a/libs/red-domain/src/lib/dossiers/dossier.model.ts b/libs/red-domain/src/lib/dossiers/dossier.model.ts index 8d3eb5db6..f50d5ecec 100644 --- a/libs/red-domain/src/lib/dossiers/dossier.model.ts +++ b/libs/red-domain/src/lib/dossiers/dossier.model.ts @@ -50,7 +50,7 @@ export class Dossier implements IDossier, IListable, IRouterPath { } get routerLink(): string { - return `/main/${this.routerPath}/${this.dossierId}`; + return `/main/${this.dossierTemplateId}/${this.routerPath}/${this.dossierId}`; } get searchKey(): string { diff --git a/libs/red-domain/src/lib/files/file.model.ts b/libs/red-domain/src/lib/files/file.model.ts index c47c6e092..5ec6048dc 100644 --- a/libs/red-domain/src/lib/files/file.model.ts +++ b/libs/red-domain/src/lib/files/file.model.ts @@ -70,7 +70,7 @@ export class File extends Entity implements IFile, IRouterPath { readonly canBeOpened: boolean; readonly canBeOCRed: boolean; - constructor(file: IFile, readonly reviewerName: string, readonly routerPath: string) { + constructor(file: IFile, readonly reviewerName: string, readonly routerPath: string, readonly dossierTemplateId?: string) { super(file); this.added = file.added; this.allManualRedactionsApplied = !!file.allManualRedactionsApplied; @@ -146,6 +146,6 @@ export class File extends Entity implements IFile, IRouterPath { } get routerLink(): string | undefined { - return this.canBeOpened ? `/main/${this.routerPath}/${this.dossierId}/file/${this.fileId}` : undefined; + return this.canBeOpened ? `/main/${this.dossierTemplateId}/${this.routerPath}/${this.dossierId}/file/${this.fileId}` : undefined; } } diff --git a/libs/red-domain/src/lib/shared/breadcrumb-types.ts b/libs/red-domain/src/lib/shared/breadcrumb-types.ts index 74ed8ae69..727c9afee 100644 --- a/libs/red-domain/src/lib/shared/breadcrumb-types.ts +++ b/libs/red-domain/src/lib/shared/breadcrumb-types.ts @@ -1,8 +1,8 @@ -export type BreadcrumbType = 'main' | 'dossier' | 'file' | 'archive'; +export type BreadcrumbType = 'dossierTemplate' | 'dossier' | 'file' | 'dashboard'; export const BreadcrumbTypes = { - main: 'main' as BreadcrumbType, + dossierTemplate: 'dossierTemplate' as BreadcrumbType, dossier: 'dossier' as BreadcrumbType, file: 'file' as BreadcrumbType, - archive: 'archive' as BreadcrumbType, + dashboard: 'dashboard' as BreadcrumbType, };