From 49f073a5a76fad82e5b8a05076fe730e6aa6b777 Mon Sep 17 00:00:00 2001 From: teodor-ritense Date: Tue, 12 Nov 2024 13:29:33 +0100 Subject: [PATCH] Add logs navigation --- .../carbon-list/carbon-list.component.ts | 2 - ...ossier-management-change-logs.component.ts | 35 ++++++++--- ...nagement-collaborators-list.component.html | 8 ++- ...management-collaborators-list.component.ts | 63 ++++++++++++++----- .../lib/services/case-change-logs.service.ts | 4 +- .../services/case-collaborators.service.ts | 2 +- 6 files changed, 83 insertions(+), 31 deletions(-) diff --git a/projects/valtimo/components/src/lib/components/carbon-list/carbon-list.component.ts b/projects/valtimo/components/src/lib/components/carbon-list/carbon-list.component.ts index c73ec74c3..25086d022 100644 --- a/projects/valtimo/components/src/lib/components/carbon-list/carbon-list.component.ts +++ b/projects/valtimo/components/src/lib/components/carbon-list/carbon-list.component.ts @@ -106,7 +106,6 @@ export class CarbonListComponent implements OnInit, AfterViewInit, OnDestroy { } @Input() set items(value: CarbonListItem[]) { - console.log('items', value); this._items$.next(value); } @@ -114,7 +113,6 @@ export class CarbonListComponent implements OnInit, AfterViewInit, OnDestroy { private readonly _fields$ = new BehaviorSubject([]); @Input() set fields(value: ColumnConfig[]) { - console.log('fields', value); this._fields$.next(value); } diff --git a/projects/valtimo/dossier-management/src/lib/components/dossier-management-change-logs/dossier-management-change-logs.component.ts b/projects/valtimo/dossier-management/src/lib/components/dossier-management-change-logs/dossier-management-change-logs.component.ts index 1538e6ee7..d7bcc0ea7 100644 --- a/projects/valtimo/dossier-management/src/lib/components/dossier-management-change-logs/dossier-management-change-logs.component.ts +++ b/projects/valtimo/dossier-management/src/lib/components/dossier-management-change-logs/dossier-management-change-logs.component.ts @@ -1,8 +1,8 @@ import {CommonModule} from '@angular/common'; -import {ChangeDetectionStrategy, ChangeDetectorRef, Component} from '@angular/core'; +import {ChangeDetectionStrategy, ChangeDetectorRef, Component, OnDestroy} from '@angular/core'; import {CarbonListModule, ColumnConfig, ViewType} from '@valtimo/components'; import {CaseChangeLogsService} from '../../services'; -import {Observable, map} from 'rxjs'; +import {Observable, combineLatest, map} from 'rxjs'; import {CaseChangeLog} from '../../models'; @Component({ @@ -13,15 +13,19 @@ import {CaseChangeLog} from '../../models'; standalone: true, imports: [CommonModule, CarbonListModule], }) -export class DossierManagementChangeLogsComponent { +export class DossierManagementChangeLogsComponent implements OnDestroy { public readonly caseChangeLogs$: Observable<(CaseChangeLog & {fullName: string})[] | null> = - this.caseChangeLogsService.caseChangeLogs$.pipe( - map((changeLogs: CaseChangeLog[] | null) => - !!changeLogs - ? changeLogs.map((changeLog: CaseChangeLog) => ({ - ...changeLog, - fullName: `${changeLog.user.firstName} ${changeLog.user.lastName}`, - })) + combineLatest([ + this.caseChangeLogsService.activeLogSearch$, + this.caseChangeLogsService.caseChangeLogs$, + ]).pipe( + map(([activeLogSearch, caseChangeLogs]) => + !!caseChangeLogs + ? this.mapLogs( + !!activeLogSearch + ? caseChangeLogs.filter((log: CaseChangeLog) => log.user.id === activeLogSearch) + : caseChangeLogs + ) : null ) ); @@ -44,4 +48,15 @@ export class DossierManagementChangeLogsComponent { ]; constructor(private readonly caseChangeLogsService: CaseChangeLogsService) {} + + public ngOnDestroy(): void { + this.caseChangeLogsService.activeLogSearch$.next(null); + } + + private mapLogs(logs: CaseChangeLog[]): (CaseChangeLog & {fullName: string})[] { + return logs.map((changeLog: CaseChangeLog) => ({ + ...changeLog, + fullName: `${changeLog.user.firstName} ${changeLog.user.lastName}`, + })); + } } diff --git a/projects/valtimo/dossier-management/src/lib/components/dossier-management-collaborators-list/dossier-management-collaborators-list.component.html b/projects/valtimo/dossier-management/src/lib/components/dossier-management-collaborators-list/dossier-management-collaborators-list.component.html index 13fe3896f..eeb1c301a 100644 --- a/projects/valtimo/dossier-management/src/lib/components/dossier-management-collaborators-list/dossier-management-collaborators-list.component.html +++ b/projects/valtimo/dossier-management/src/lib/components/dossier-management-collaborators-list/dossier-management-collaborators-list.component.html @@ -1,7 +1,11 @@ + + + + diff --git a/projects/valtimo/dossier-management/src/lib/components/dossier-management-collaborators-list/dossier-management-collaborators-list.component.ts b/projects/valtimo/dossier-management/src/lib/components/dossier-management-collaborators-list/dossier-management-collaborators-list.component.ts index 7217bdd00..8a2e0a441 100644 --- a/projects/valtimo/dossier-management/src/lib/components/dossier-management-collaborators-list/dossier-management-collaborators-list.component.ts +++ b/projects/valtimo/dossier-management/src/lib/components/dossier-management-collaborators-list/dossier-management-collaborators-list.component.ts @@ -1,9 +1,17 @@ import {CommonModule} from '@angular/common'; -import {ChangeDetectionStrategy, Component} from '@angular/core'; +import { + AfterViewInit, + ChangeDetectionStrategy, + Component, + TemplateRef, + ViewChild, +} from '@angular/core'; import {CarbonListModule, ColumnConfig, ViewType} from '@valtimo/components'; -import {Observable, tap} from 'rxjs'; -import {Collaborator} from '../../models'; +import {BehaviorSubject, Observable, tap} from 'rxjs'; +import {Collaborator, TabEnum} from '../../models'; import {CaseCollaboratorsService} from '../../services/case-collaborators.service'; +import {ButtonModule} from 'carbon-components-angular'; +import {CaseChangeLogsService, CaseMenuService, TabService} from '../../services'; @Component({ selector: 'valtimo-dossier-management-collaborators-list', @@ -11,21 +19,46 @@ import {CaseCollaboratorsService} from '../../services/case-collaborators.servic styleUrl: './dossier-management-collaborators-list.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, - imports: [CommonModule, CarbonListModule], + imports: [CommonModule, CarbonListModule, ButtonModule], }) -export class DossierManagementCollaboratorsListComponent { +export class DossierManagementCollaboratorsListComponent implements AfterViewInit { + @ViewChild('goToLogs') private _goToLogsTemplate: TemplateRef; public readonly collaborators$: Observable = this.caseCollaboratorsService.collaborators$; - - public readonly COLLABORATORS_FIELDS: ColumnConfig[] = [ - { - key: 'email', - label: 'User email', - viewType: ViewType.TEXT, - }, - ]; - constructor(private readonly caseCollaboratorsService: CaseCollaboratorsService) {} + public readonly collaboratorsFields$ = new BehaviorSubject([]); - public onRowClicked() {} + constructor( + private readonly caseCollaboratorsService: CaseCollaboratorsService, + private readonly caseChangeLogsService: CaseChangeLogsService, + private readonly caseMenuService: CaseMenuService, + private readonly tabService: TabService + ) {} + + public ngAfterViewInit(): void { + this.collaboratorsFields$.next([ + { + key: 'email', + label: 'User email', + viewType: ViewType.TEXT, + }, + { + key: 'fullName', + label: 'User name', + viewType: ViewType.TEXT, + }, + { + key: '', + label: '', + viewType: ViewType.TEMPLATE, + template: this._goToLogsTemplate, + }, + ]); + } + + public onRowClicked(collaborator: Collaborator) { + this.caseChangeLogsService.activeLogSearch$.next(collaborator.id); + this.caseMenuService.selectMenuItem(TabEnum.CASE_CHANGE_LOGS); + this.tabService.currentTab = TabEnum.CASE_CHANGE_LOGS; + } } diff --git a/projects/valtimo/dossier-management/src/lib/services/case-change-logs.service.ts b/projects/valtimo/dossier-management/src/lib/services/case-change-logs.service.ts index 4cbe4f300..8f43f6871 100644 --- a/projects/valtimo/dossier-management/src/lib/services/case-change-logs.service.ts +++ b/projects/valtimo/dossier-management/src/lib/services/case-change-logs.service.ts @@ -11,8 +11,10 @@ import {CASE_CHANGE_LOGS} from '../mocks'; export class CaseChangeLogsService { private readonly _caseChangeLogs$ = new BehaviorSubject(CASE_CHANGE_LOGS); + public readonly activeLogSearch$ = new BehaviorSubject(null); + public readonly caseChangeLogs$: Observable = this._caseChangeLogs$.pipe( - debounceTime(2000), + debounceTime(1000), startWith(null) ); } diff --git a/projects/valtimo/dossier-management/src/lib/services/case-collaborators.service.ts b/projects/valtimo/dossier-management/src/lib/services/case-collaborators.service.ts index 97b2d18e8..1f5796445 100644 --- a/projects/valtimo/dossier-management/src/lib/services/case-collaborators.service.ts +++ b/projects/valtimo/dossier-management/src/lib/services/case-collaborators.service.ts @@ -11,7 +11,7 @@ export class CaseCollaboratorsService { private readonly _collaborators$ = new BehaviorSubject(COLLABORATORS); public readonly collaborators$: Observable = this._collaborators$.pipe( - debounceTime(2000), + debounceTime(1000), map((users: NamedUser[]) => users.map((user: NamedUser) => ({...user, fullName: `${user.firstName} ${user.lastName}`})) ),