ui fix on plan view versions listing

frontend/src/app/ui/plan/listing/listing-item/plan-listing-item.component.html

@@ -20,10 +20,10 @@
 			<span class="col-auto" *ngIf="plan.status === planStatusEnum.Finalized && isPublic"><span class="material-icons icon-align">public</span>{{'TYPES.PLAN-VISIBILITY.PUBLIC' | translate}}</span>
 			<span *ngIf="plan.status === planStatusEnum.Finalized && !isPublic; else draft" class="col-auto"><span class="material-icons icon-align">done</span>{{ enumUtils.toPlanStatusString(plan.status) }}</span>
 			<ng-template #draft>
-				<span *ngIf="plan.status === planStatusEnum.Draft && canEditPlan(); else preview" class=" col-auto draft"><span class="material-icons icon-align">create</span>{{ enumUtils.toPlanStatusString(plan.status) }}</span>
+				<span *ngIf="plan.status === planStatusEnum.Draft && canEditPlan; else preview" class=" col-auto draft"><span class="material-icons icon-align">create</span>{{ enumUtils.toPlanStatusString(plan.status) }}</span>
 			</ng-template>
 			<ng-template #preview>
-				<span *ngIf="plan.status === planStatusEnum.Draft && !canEditPlan()" class=" col-auto draft"><span class="material-icons-outlined mr-1 icon-align">visibility</span>{{ enumUtils.toPlanStatusString(plan.status) }}</span>
+				<span *ngIf="plan.status === planStatusEnum.Draft && !canEditPlan" class=" col-auto draft"><span class="material-icons-outlined mr-1 icon-align">visibility</span>{{ enumUtils.toPlanStatusString(plan.status) }}</span>
 			</ng-template>
 			<span>.</span>
 			<span class="col-auto">{{'PLAN-LISTING.VERSION' | translate}} {{plan.version}}</span>
@@ -41,14 +41,14 @@
 		<a class="d-flex justify-content-center pb-3 show-more" *ngIf="plan.descriptions?.length > 3" [routerLink]="isPublic ? this.routerUtils.generateUrl(['/explore-plans/overview/public/', plan.id]) : this.routerUtils.generateUrl(['/plans/overview/', plan.id])"><u>{{'GENERAL.ACTIONS.SHOW-MORE' | translate}}</u></a>
 	</a>
 	<div class="plan-card-actions">
-		<a class="col-auto border-right pointer" *ngIf="canExportPlan() && fileTransformerService.availableFormatsFor(fileTransformerEntityTypeEnum.Plan).length > 0" [matMenuTriggerFor]="exportMenu"><span class="material-icons icon-align pr-2">open_in_new</span>{{'PLAN-LISTING.ACTIONS.EXPORT' | translate}}</a>
+		<a class="col-auto border-right pointer" *ngIf="canExportPlan && fileTransformerService.availableFormatsFor(fileTransformerEntityTypeEnum.Plan).length > 0" [matMenuTriggerFor]="exportMenu"><span class="material-icons icon-align pr-2">open_in_new</span>{{'PLAN-LISTING.ACTIONS.EXPORT' | translate}}</a>
-		<a class="col-auto border-right pointer" *ngIf="isDraftPlan(plan) && canEditPlan()" [routerLink]="this.routerUtils.generateUrl(['/plans/edit/', plan.id])" target="_blank"><span class="material-icons icon-align">add</span>{{'PLAN-LISTING.ACTIONS.ADD-DESCRIPTION-SHORT' | translate}}</a>
+		<a class="col-auto border-right pointer" *ngIf="canEditPlan" [routerLink]="this.routerUtils.generateUrl(['/plans/edit/', plan.id])" target="_blank"><span class="material-icons icon-align">add</span>{{'PLAN-LISTING.ACTIONS.ADD-DESCRIPTION-SHORT' | translate}}</a>
-		<a class="col-auto border-right pointer" *ngIf="canInvitePlanUsers()" (click)="inviteToPlan()"><span class="material-icons icon-align pr-2">group_add</span>{{'PLAN-LISTING.ACTIONS.INVITE-SHORT' | translate}}</a>
+		<a class="col-auto border-right pointer" *ngIf="canInvitePlanUsers" (click)="inviteToPlan()"><span class="material-icons icon-align pr-2">group_add</span>{{'PLAN-LISTING.ACTIONS.INVITE-SHORT' | translate}}</a>
-		<a class="col-auto border-right pointer" *ngIf="canClonePlan()" (click)="cloneClicked()"><span class="material-icons icon-align pr-2">filter_none</span>{{'PLAN-LISTING.ACTIONS.CLONE' | translate}}</a>
+		<a class="col-auto border-right pointer" *ngIf="canClonePlan" (click)="cloneClicked()"><span class="material-icons icon-align pr-2">filter_none</span>{{'PLAN-LISTING.ACTIONS.CLONE' | translate}}</a>
-		<a class="col-auto border-right pointer" *ngIf="!isAuthenticated()" (click)="viewVersions(plan)"><span class="material-icons icon-align pr-2">library_books</span>{{'PLAN-LISTING.ACTIONS.VIEW-VERSION' | translate}}</a>
+		<a class="col-auto border-right pointer" *ngIf="!isAuthenticated() && showAllVersionsAction" (click)="viewVersions(plan)"><span class="material-icons icon-align pr-2">library_books</span>{{'PLAN-LISTING.ACTIONS.VIEW-VERSION' | translate}}</a>
 
-		<a class="col-auto border-right pointer" *ngIf="isDraftPlan(plan) && canDeletePlan()" (click)="deleteClicked(plan.id)"><span class="material-icons icon-align pr-2">delete</span>{{ 'PLAN-LISTING.ACTIONS.DELETE' | translate }}</a>
+		<a class="col-auto border-right pointer" *ngIf="canDeletePlan" (click)="deleteClicked(plan.id)"><span class="material-icons icon-align pr-2">delete</span>{{ 'PLAN-LISTING.ACTIONS.DELETE' | translate }}</a>
-		<a class="col-auto pointer" *ngIf="isAuthenticated()" [matMenuTriggerFor]="actionsMenu"><span class="material-icons icon-align pl-2">more_horiz</span></a>
+		<a class="col-auto pointer" *ngIf="showActionsMenu" [matMenuTriggerFor]="actionsMenu"><span class="material-icons icon-align pl-2">more_horiz</span></a>
 	</div>
 	<mat-menu #exportMenu="matMenu" xPosition="before">
 		<button mat-menu-item *ngFor='let fileTransformer of fileTransformerService.availableFormatsFor(fileTransformerEntityTypeEnum.Plan)' (click)="fileTransformerService.exportPlan(plan.id, fileTransformer.repositoryId, fileTransformer.format, isPublic)">
@@ -57,13 +57,13 @@
 		</button>
 	</mat-menu>
 	<mat-menu #actionsMenu="matMenu" xPosition="before">
-		<button *ngIf="canCreateNewVersion()" mat-menu-item (click)="newVersionClicked()">
+		<button *ngIf="canCreateNewVersion" mat-menu-item (click)="newVersionClicked()">
 			<mat-icon>queue</mat-icon>{{'PLAN-LISTING.ACTIONS.NEW-VERSION' | translate}}
 		</button>
-		<a mat-menu-item [routerLink]="viewVersionsUrl(plan)" target="_blank">
+		<a *ngIf="showAllVersionsAction" mat-menu-item [routerLink]="viewVersionsUrl(plan)" target="_blank">
 			<mat-icon>library_books</mat-icon>{{'PLAN-LISTING.ACTIONS.VIEW-VERSION' | translate}}
 		</a>
-		<button mat-menu-item *ngIf="isDraftPlan(plan) && canDeletePlan()" (click)="deleteClicked(plan.id)" class="menu-item">
+		<button mat-menu-item *ngIf="canDeletePlan" (click)="deleteClicked(plan.id)" class="menu-item">
 			<mat-icon>delete</mat-icon>{{ 'PLAN-LISTING.ACTIONS.DELETE' | translate }}
 		</button>
 	</mat-menu>

frontend/src/app/ui/plan/listing/listing-item/plan-listing-item.component.ts

@@ -1,11 +1,9 @@
 import { Location } from '@angular/common';
-import { HttpClient } from '@angular/common/http';
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { Router } from '@angular/router';
 import { PlanAccessType } from '@app/core/common/enum/plan-access-type';
 import { Plan } from '@app/core/model/plan/plan';
-import { PlanBlueprintService } from '@app/core/services/plan/plan-blueprint.service';
 import { PlanService } from '@app/core/services/plan/plan.service';
 import { FileTransformerService } from '@app/core/services/file-transformer/file-transformer.service';
 import { LockService } from '@app/core/services/lock/lock.service';
@@ -13,7 +11,6 @@ import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/serv
 import { ReferenceTypeService } from '@app/core/services/reference-type/reference-type.service';
 import { ReferenceService } from '@app/core/services/reference/reference.service';
 import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
-import { FileUtils } from '@app/core/services/utilities/file-utils.service';
 import { BaseComponent } from '@common/base/base.component';
 import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
 import { Guid } from '@common/types/guid';
@@ -42,6 +39,7 @@ export class PlanListingItemComponent extends BaseComponent implements OnInit {
 
 	@Input() plan: Plan;
 	@Input() showDivider: boolean = true;
+	@Input() showAllVersionsAction: boolean = true;
 	@Input() isPublic: boolean;
 	@Input() tenants: Tenant[] = [];
 	@Output() onClick: EventEmitter<Plan> = new EventEmitter();
@@ -52,6 +50,46 @@ export class PlanListingItemComponent extends BaseComponent implements OnInit {
 	planStatusEnum = PlanStatusEnum;
 	fileTransformerEntityTypeEnum = FileTransformerEntityType;
 
+	get canEditPlan(): boolean {
+		return (this.isDraft) && (this.plan.authorizationFlags?.some(x => x === AppPermission.EditPlan) || this.authentication.hasPermission(AppPermission.EditPlan)) && !this.isPublic && this.plan.belongsToCurrentTenant != false;
+	}
+
+	get canCreateNewVersion(): boolean {
+		return (this.plan.authorizationFlags?.some(x => x === AppPermission.CreateNewVersionPlan) || this.authentication.hasPermission(AppPermission.CreateNewVersionPlan)) && this.plan.versionStatus === PlanVersionStatus.Current && !this.isPublic &&  this.plan.belongsToCurrentTenant != false;
+	}
+
+	get canDeletePlan(): boolean {
+		return (this.plan.authorizationFlags?.some(x => x === AppPermission.DeletePlan) || this.authentication.hasPermission(AppPermission.DeletePlan)) && !this.isPublic &&  this.plan.belongsToCurrentTenant != false && this.isDraftPlan;
+	}
+
+	get canClonePlan(): boolean {
+		return this.plan.authorizationFlags?.some(x => x === AppPermission.ClonePlan) || this.authentication.hasPermission(AppPermission.ClonePlan) || (this.authentication.hasPermission(AppPermission.PublicClonePlan) && this.isPublic);
+	}
+
+	get canFinalizePlan(): boolean {
+		return (this.plan.authorizationFlags?.some(x => x === AppPermission.FinalizePlan) || this.authentication.hasPermission(AppPermission.FinalizePlan)) && !this.isPublic &&  this.plan.belongsToCurrentTenant != false;
+	}
+
+	get canExportPlan(): boolean {
+		return this.plan.authorizationFlags?.some(x => x === AppPermission.ExportPlan) || this.authentication.hasPermission(AppPermission.ExportPlan);
+	}
+
+	get canInvitePlanUsers(): boolean {
+		return (this.plan.authorizationFlags?.some(x => x === AppPermission.InvitePlanUsers) || this.authentication.hasPermission(AppPermission.InvitePlanUsers)) && !this.isPublic &&  this.plan.belongsToCurrentTenant != false;
+	}
+
+	get canAssignPlanUsers(): boolean {
+		return (this.plan.authorizationFlags?.some(x => x === AppPermission.AssignPlanUsers) || this.authentication.hasPermission(AppPermission.AssignPlanUsers)) && !this.isPublic &&  this.plan.belongsToCurrentTenant != false;
+	}
+
+	get showActionsMenu(): boolean {
+		return this.isAuthenticated() && (this.canCreateNewVersion || this.showAllVersionsAction || this.canDeletePlan)
+	}
+
+	get isDraftPlan(): boolean {
+		return this.plan.status == PlanStatusEnum.Draft;
+	}
+
 	constructor(
 		public routerUtils: RouterUtilsService,
 		private router: Router,
@@ -59,16 +97,13 @@ export class PlanListingItemComponent extends BaseComponent implements OnInit {
 		private authentication: AuthService,
 		public enumUtils: EnumUtils,
 		private planService: PlanService,
-		private planBlueprintService: PlanBlueprintService,
 		private language: TranslateService,
 		private uiNotificationService: UiNotificationService,
 		private lockService: LockService,
 		private location: Location,
-		private httpClient: HttpClient,
 		public referenceService: ReferenceService,
 		public referenceTypeService: ReferenceTypeService,
 		public fileTransformerService: FileTransformerService,
-		private fileUtils: FileUtils,
 		private analyticsService: AnalyticsService,
 		private httpErrorHandlingService: HttpErrorHandlingService,
 	) {
@@ -226,10 +261,6 @@ export class PlanListingItemComponent extends BaseComponent implements OnInit {
 		});
 	}
 
-	isDraftPlan(activity: Plan) {
-		return activity.status == PlanStatusEnum.Draft;
-	}
-
 	reloadPage(): void {
 		const path = this.location.path();
 		this.router.navigateByUrl('/reload', { skipLocationChange: true }).then(() => {
@@ -245,36 +276,4 @@ export class PlanListingItemComponent extends BaseComponent implements OnInit {
 	onDeleteCallbackError(error) {
 		this.uiNotificationService.snackBarNotification(error.error.message ? error.error.message : this.language.instant('GENERAL.SNACK-BAR.UNSUCCESSFUL-DELETE'), SnackBarNotificationLevel.Error);
 	}
-
-	canEditPlan(): boolean {
-		return (this.isDraft) && (this.plan.authorizationFlags?.some(x => x === AppPermission.EditPlan) || this.authentication.hasPermission(AppPermission.EditPlan)) && !this.isPublic && this.plan.belongsToCurrentTenant != false;
-	}
-
-	canCreateNewVersion(): boolean {
-		return (this.plan.authorizationFlags?.some(x => x === AppPermission.CreateNewVersionPlan) || this.authentication.hasPermission(AppPermission.CreateNewVersionPlan)) && this.plan.versionStatus === PlanVersionStatus.Current && !this.isPublic &&  this.plan.belongsToCurrentTenant != false;
-	}
-
-	canDeletePlan(): boolean {
-		return (this.plan.authorizationFlags?.some(x => x === AppPermission.DeletePlan) || this.authentication.hasPermission(AppPermission.DeletePlan)) && !this.isPublic &&  this.plan.belongsToCurrentTenant != false;
-	}
-
-	canClonePlan(): boolean {
-		return this.plan.authorizationFlags?.some(x => x === AppPermission.ClonePlan) || this.authentication.hasPermission(AppPermission.ClonePlan) || (this.authentication.hasPermission(AppPermission.PublicClonePlan) && this.isPublic);
-	}
-
-	canFinalizePlan(): boolean {
-		return (this.plan.authorizationFlags?.some(x => x === AppPermission.FinalizePlan) || this.authentication.hasPermission(AppPermission.FinalizePlan)) && !this.isPublic &&  this.plan.belongsToCurrentTenant != false;
-	}
-
-	canExportPlan(): boolean {
-		return this.plan.authorizationFlags?.some(x => x === AppPermission.ExportPlan) || this.authentication.hasPermission(AppPermission.ExportPlan);
-	}
-
-	canInvitePlanUsers(): boolean {
-		return (this.plan.authorizationFlags?.some(x => x === AppPermission.InvitePlanUsers) || this.authentication.hasPermission(AppPermission.InvitePlanUsers)) && !this.isPublic &&  this.plan.belongsToCurrentTenant != false;
-	}
-
-	canAssignPlanUsers(): boolean {
-		return (this.plan.authorizationFlags?.some(x => x === AppPermission.AssignPlanUsers) || this.authentication.hasPermission(AppPermission.AssignPlanUsers)) && !this.isPublic &&  this.plan.belongsToCurrentTenant != false;
-	}
 }

frontend/src/app/ui/plan/listing/plan-listing.component.html

@@ -60,6 +60,7 @@
 					<div class="col-md-12 col-sm-12 col-md-9">
 						<div *ngFor="let item of listingItems; let i = index">
 							<app-plan-listing-item-component 
+								[showAllVersionsAction]="!isVersionsListing"
 								[showDivider]="i != (listingItems.length - 1)" 
 								[plan]="item" 
 								[isPublic]="isPublic" 

frontend/src/app/ui/plan/listing/plan-listing.component.ts

@@ -69,6 +69,9 @@ export class PlanListingComponent extends BaseListingComponent<BasePlan, PlanLoo
 
 	groupId: Guid | null = null;
 	mode;
+	get isVersionsListing(): boolean {
+		return this.mode == 'versions-listing';
+	}
 
 	scrollbar: boolean;
 
@@ -229,7 +232,7 @@ export class PlanListingComponent extends BaseListingComponent<BasePlan, PlanLoo
 		let recentActivityOrder = this.isPublic ? this.toDescSortField(nameof<Description>(x => x.finalizedAt)) : this.toDescSortField(nameof<Description>(x => x.updatedAt));
 		lookup.order = { items: [recentActivityOrder] };
 
-		if (this.mode && this.mode == 'versions-listing') {
+		if (this.mode && this.isVersionsListing) {
 			this.groupId = Guid.parse(this.route.snapshot.paramMap.get('groupId'));
 			lookup.groupIds = [this.groupId];