diff --git a/frontend/src/app/ui/dashboard/dashboard.component.html b/frontend/src/app/ui/dashboard/dashboard.component.html index df606aee7..5f1b87116 100644 --- a/frontend/src/app/ui/dashboard/dashboard.component.html +++ b/frontend/src/app/ui/dashboard/dashboard.component.html @@ -59,16 +59,30 @@
{{'DASHBOARD.LATEST-ACTIVITY' | translate}}
- + - + - + - + diff --git a/frontend/src/app/ui/dashboard/dashboard.component.ts b/frontend/src/app/ui/dashboard/dashboard.component.ts index b779007bb..db8ce7474 100644 --- a/frontend/src/app/ui/dashboard/dashboard.component.ts +++ b/frontend/src/app/ui/dashboard/dashboard.component.ts @@ -31,10 +31,12 @@ export class DashboardComponent extends BaseComponent implements OnInit { public dashboardStatistics: DashboardStatistics; public grantCount = 0; public organizationCount = 0; - currentType: string = "recent"; + currentType: ActivityListingType = ActivityListingType.Recent; newReleaseNotificationVisible = false; isIntroCardVisible = true; + ActivityListingType = ActivityListingType; + constructor( public routerUtils: RouterUtilsService, private router: Router, @@ -57,11 +59,7 @@ export class DashboardComponent extends BaseComponent implements OnInit { ngOnInit() { this.route.queryParams.subscribe(params => { let type = params['type']; - if (type || type == "recent" || (type == "drafts" && this.isAuthenticated()) || type == "plans" || type == "descriptions") { - this.currentType = type; - } else { - this.currentType = "recent"; - } + this.currentType = type ?? ActivityListingType.Recent }); this.analyticsService.trackPageView(AnalyticsService.Dashboard); @@ -92,20 +90,13 @@ export class DashboardComponent extends BaseComponent implements OnInit { } public get indexFromCurrentType() { - if (this.currentType == "recent") { - return 0; - } - if (this.currentType == "drafts") { - return 1; - } - if (this.currentType == "plans") { - return this.isAuthenticated() ? 2 : 1; - } - if (this.currentType == "descriptions") { - return this.isAuthenticated() ? 3 : 2; - } - return 0; + switch(this.currentType){ + case ActivityListingType.Recent: return 0; + case ActivityListingType.Drafts: return 1; + case ActivityListingType.Plans: return this.isAuthenticated() ? 2 : 1; + case ActivityListingType.Descriptions: return this.isAuthenticated() ? 3 : 2; + } } public isAuthenticated(): boolean { @@ -255,3 +246,10 @@ export class DashboardComponent extends BaseComponent implements OnInit { return true; } } + +export enum ActivityListingType { + 'Recent'= 'recent', + 'Drafts' = 'drafts', + 'Plans' = 'plans', + 'Descriptions' = 'descriptions' +} \ No newline at end of file diff --git a/frontend/src/app/ui/dashboard/dashboard.module.ts b/frontend/src/app/ui/dashboard/dashboard.module.ts index 3967e273e..ac043ec2b 100644 --- a/frontend/src/app/ui/dashboard/dashboard.module.ts +++ b/frontend/src/app/ui/dashboard/dashboard.module.ts @@ -25,7 +25,7 @@ import { RecentEditedActivityComponent } from './recent-edited-activity/recent-e ], declarations: [ DashboardComponent, - RecentEditedActivityComponent, + RecentEditedActivityComponent, ] }) export class DashboardModule { } diff --git a/frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.ts b/frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.ts index 797e684c3..36c761abf 100644 --- a/frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.ts +++ b/frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.ts @@ -1,5 +1,5 @@ import { Location } from '@angular/common'; -import { Component, Input, OnInit, Output } from '@angular/core'; +import { Component, computed, effect, input, Input, OnInit, Output } from '@angular/core'; import { UntypedFormBuilder, UntypedFormControl } from '@angular/forms'; import { ActivatedRoute, Router } from '@angular/router'; import { DescriptionStatusEnum } from '@app/core/common/enum/description-status'; @@ -27,6 +27,7 @@ import { HttpErrorHandlingService } from '@common/modules/errors/error-handling/ import { BehaviorSubject } from 'rxjs'; import { debounceTime, map, takeUntil } from 'rxjs/operators'; import { nameof } from 'ts-simple-nameof'; +import { ActivityListingType } from '../dashboard.component'; @Component({ selector: 'app-recent-edited-activity', @@ -43,15 +44,32 @@ export class RecentEditedActivityComponent extends BaseComponent implements OnIn pageSize: number = 5; listingItems: RecentActivityItem[]= []; - @Input() type: string; - @Input() selectedType: string; - @Input() includeDescriptions: boolean = false; - @Input() includePlans: boolean = false; - @Input() onlyDrafts: boolean = false; + @Input() type: ActivityListingType = ActivityListingType.Recent; @Input() hasPlans: boolean = false; - + @Output() addNewDescription: BehaviorSubject = new BehaviorSubject(false); + + currentType = input(); + isActive = computed(() => this.currentType() === this.type); + + get onlyDrafts(): boolean { + return this.type === ActivityListingType.Drafts; + } + + get includeDescriptions(): boolean { + const activityListingTypes = [ActivityListingType.Recent, ActivityListingType.Drafts, ActivityListingType.Descriptions] + return activityListingTypes.includes(this.type); + } + + get includePlans(): boolean { + const activityListingTypes = [ActivityListingType.Recent, ActivityListingType.Drafts, ActivityListingType.Plans] + return activityListingTypes.includes(this.type); + } + get isDefault(): boolean { + return this.type === ActivityListingType.Recent; + } + get onlyPlans(): boolean { return this.includePlans && !this.includeDescriptions; } @@ -72,7 +90,6 @@ export class RecentEditedActivityComponent extends BaseComponent implements OnIn totalCount: number; offsetLess: number = 0; - @Input() isActive: boolean = false; constructor( private route: ActivatedRoute, @@ -86,12 +103,17 @@ export class RecentEditedActivityComponent extends BaseComponent implements OnIn private httpErrorHandlingService: HttpErrorHandlingService ) { super(); + effect(() => { + if(this.isActive()){ //on Type Changes + this.updateUrl(); + } + }) } ngOnInit() { this.analyticsService.trackPageView(AnalyticsService.RecentEditedActivity); this.route.queryParams.subscribe(params => { - if (this.isActive) { + if (this.isActive()) { let page = (params['page'] === undefined) ? 0 : + params['page']; this.currentPage = (page <= 0) ? 0 : page; @@ -123,24 +145,20 @@ export class RecentEditedActivityComponent extends BaseComponent implements OnIn this.refresh() }); - if (!this.formGroup.get('order').value) this.formGroup.get('order').setValue(this.order.UpdatedAt); - + if (!this.formGroup.get('order').value){ + this.formGroup.get('order').setValue(this.order.UpdatedAt); + } + this.formGroup.get('order').valueChanges .pipe(takeUntil(this._destroyed)) - .subscribe(x => this.refresh()); + .subscribe(x => {this.refresh()}); this.refresh(); } - ngOnChanges() { - if (this.isActive) { - this.updateUrl(); - } - } - updateUrl() { let parametersArray: string[] = [ - ...( this.selectedType && this.type === this.selectedType ? ["type=" + this.selectedType] : []), + ...( !this.isDefault && this.isActive() ? ["type=" + this.type] : []), ...(this.currentPage > 1 ? ["page=" + this.currentPage] : []), ...(this.formGroup.get("like").value ? ["keyword=" + this.formGroup.get("like").value] : []) ]