Skip to content
Permalink
Browse files
fix: disable edit/delete action in deactivated projects (DEV-52) (#550)
* fix(resource): do not display edit buttons in deleted project

* fix(project): do not display edit buttons in deleted project

and use same style in list editor as we use in ontology editor

* test: fix tests

* fix(value): fix display-edit action buttons
  • Loading branch information
kilchenmann committed Oct 15, 2021
1 parent fb846f9 commit d7bec78ed703b513fa5d24fd895d4781e51af3cb
Showing with 80 additions and 68 deletions.
  1. +0 −2 src/app/project/list/list-info-form/list-info-form.component.ts
  2. +1 −1 src/app/project/list/list-item-form/list-item-form.component.html
  3. +1 −0 src/app/project/list/list-item-form/list-item-form.component.spec.ts
  4. +5 −0 src/app/project/list/list-item-form/list-item-form.component.ts
  5. +5 −5 src/app/project/list/list-item/list-item.component.html
  6. +2 −0 src/app/project/list/list-item/list-item.component.ts
  7. +18 −12 src/app/project/list/list.component.html
  8. +0 −13 src/app/project/list/list.component.scss
  9. +7 −6 src/app/project/ontology/ontology.component.html
  10. +0 −16 src/app/project/ontology/ontology.component.scss
  11. +1 −1 src/app/project/ontology/property-info/property-info.component.html
  12. +2 −0 src/app/project/ontology/property-info/property-info.component.ts
  13. +2 −2 src/app/project/ontology/resource-class-info/resource-class-info.component.html
  14. +1 −1 src/app/project/ontology/resource-class-info/resource-class-info.component.spec.ts
  15. +2 −0 src/app/project/ontology/resource-class-info/resource-class-info.component.ts
  16. +2 −2 src/app/workspace/resource/operations/display-edit/display-edit.component.html
  17. +3 −1 src/app/workspace/resource/operations/display-edit/display-edit.component.spec.ts
  18. +2 −0 src/app/workspace/resource/operations/display-edit/display-edit.component.ts
  19. +6 −5 src/app/workspace/resource/properties/properties.component.html
  20. +3 −1 src/app/workspace/results/list-view/resource-list/resource-list.component.ts
  21. +17 −0 src/assets/style/main.scss
@@ -36,8 +36,6 @@ export class ListInfoFormComponent implements OnInit {

loading: boolean;

project: ReadProject;

list: ListNodeInfo;

labels: StringLiteral[];
@@ -21,7 +21,7 @@
[placeholder]="labels | appStringifyStringLiteral:'all' | appTruncate: 128" [value]="labels" [readonly]="true"
(dataChanged)="handleData($event)" [language]="language">
</app-string-literal-input>
<div class="action-bubble" *ngIf="showActionBubble" [@simpleFadeAnimation]="'in'">
<div class="action-bubble" *ngIf="showActionBubble && projectStatus" [@simpleFadeAnimation]="'in'">
<div class="button-container">
<button mat-button
*ngIf="position > 0"
@@ -33,6 +33,7 @@ import { ListItemFormComponent, ListNodeOperation } from './list-item-form.compo
(refreshParent)="updateView($event)"
[projectIri]="projectIri"
[projectCode]="projectCode"
[projectStatus]="true"
[labels]="labels">
</app-list-item-form>`
})
@@ -61,6 +61,11 @@ export class ListItemFormComponent implements OnInit {
*/
@Input() projectCode?: string;

/**
* project status
*/
@Input() projectStatus?: boolean;

/**
* project id
*/
@@ -10,20 +10,20 @@

<!-- existing node: show label in form; value is e.g. {{node.labels[0].value}} -->
<app-list-item-form [iri]="node.id" [language]="language" (refreshParent)="updateView($event, true)"
[projectIri]="projectIri" [projectCode]="projectCode" [labels]="node.labels"
[projectIri]="projectIri" [projectCode]="projectCode" [projectStatus]="projectStatus" [labels]="node.labels"
[position]="node.position" [lastPosition]="last" [parentIri]="parentIri">
</app-list-item-form>


<!-- recursion: list with child nodes -->
<app-list-item class="child-node" *ngIf="node.id === expandedNode && node.children.length > 0"
[language]="language" [childNode]="true" [list]="node.children" [parentIri]="node.id"
[projectIri]="projectIri" [projectCode]="projectCode" (refreshChildren)="updateParentNodeChildren($event, node.position)">
[projectIri]="projectIri" [projectCode]="projectCode" [projectStatus]="projectStatus" (refreshChildren)="updateParentNodeChildren($event, node.position)">
</app-list-item>


<!-- in case of none children: show form to append new item -->
<div *ngIf="node.id === expandedNode && node.children.length === 0" class="child-node">
<div *ngIf="node.id === expandedNode && node.children.length === 0 && projectStatus" class="child-node">
<!-- first child should have an empty list? yes -->
<app-list-item-form class="append-child-node" [parentIri]="node.id" [projectIri]="projectIri"
[projectCode]="projectCode" [language]="language" [newNode]="true"
@@ -32,7 +32,7 @@
</div>

<!-- form to append new item to parent node -->
<app-list-item-form class="list-node append-child-node" *ngIf="last" [parentIri]="parentIri"
<app-list-item-form class="list-node append-child-node" *ngIf="last && projectStatus" [parentIri]="parentIri"
[projectIri]="projectIri" [projectCode]="projectCode" [language]="language"
[newNode]="true" (refreshParent)="updateView($event)">
</app-list-item-form>
@@ -41,7 +41,7 @@
</div>

<!-- new list to create if list is empty -->
<div class="list" *ngIf="list && list.length === 0">
<div class="list" *ngIf="list && list.length === 0 && projectStatus">
<div class="list-node">
<app-list-item-form [parentIri]="parentIri" [projectIri]="projectIri" [projectCode]="projectCode"
[language]="language" [newNode]="true" (refreshParent)="updateView($event)">
@@ -26,6 +26,8 @@ export class ListItemComponent implements OnInit {

@Input() projectCode: string;

@Input() projectStatus: boolean;

@Input() projectIri: string;

@Input() childNode: boolean;
@@ -45,7 +45,7 @@ <h2 class="mat-title">

<span class="fill-remaining-space"></span>

<span class="app-toolbar-action" [class.select-form]="lists.length">
<span class="app-toolbar-action" [class.select-form]="lists.length" *ngIf="project.status">
<button mat-raised-button color="primary" class="create-list-btn"
(click)="openDialog('createList', 'List', project.id)">
{{lists.length ? 'New list' : 'Create your first list'}}
@@ -66,20 +66,26 @@ <h2 class="mat-title">
<p class="mat-body" [matTooltip]="list.comments | appStringifyStringLiteral" matTooltipPosition="above">
{{list.comments | appStringifyStringLiteral | appTruncate:64}}</p>
<span class="fill-remaining-space"></span>
<button mat-button
(click)="$event.stopPropagation(); openDialog('editListInfo', list.labels[0].value, list.id)"
matTooltip="Edit info">
<mat-icon>edit</mat-icon>
</button>
<button mat-button class="delete"
(click)="$event.stopPropagation(); openDialog('deleteList', list.labels[0].value, list.id)"
matTooltip="Delete list">
<mat-icon>delete</mat-icon>
</button>

<span class="project-actions" *ngIf="project.status">
<p class="mat-caption space-reducer">List configuration</p>
<button mat-button
(click)="$event.stopPropagation(); openDialog('editListInfo', list.labels[0].value, list.id)"
matTooltip="Edit list info">
<mat-icon>edit</mat-icon>
Edit
</button>
<button mat-button class="delete"
(click)="$event.stopPropagation(); openDialog('deleteList', list.labels[0].value, list.id)"
matTooltip="Delete list">
<mat-icon>delete</mat-icon>
Delete
</button>
</span>
</mat-toolbar-row>
</mat-toolbar>

<app-list-item [list]="list" [parentIri]="list.id" [projectIri]="project.id" [projectCode]="projectCode">
<app-list-item [list]="list" [parentIri]="list.id" [projectIri]="project.id" [projectCode]="projectCode" [projectStatus]="project.status">
</app-list-item>

</div>
@@ -17,16 +17,3 @@
}
}

.list-editor {
mat-toolbar-row {
button {
margin: 0% 0.5%;
padding: 1%;
min-width: 6%;
border-radius: 40px;
}
button:hover {
background-color: #ebebeb;
}
}
}
@@ -41,7 +41,7 @@ <h2 class="mat-title">

<span class="fill-remaining-space"></span>

<span class="app-toolbar-action" [class.select-form]="ontologies.length">
<span class="app-toolbar-action" [class.select-form]="ontologies.length" *ngIf="project.status">
<button mat-raised-button color="primary" class="create-data-model-btn"
(click)="openOntologyForm('createOntology')">
{{ontologies.length ? 'New data model' : 'Create your first data model'}}
@@ -98,11 +98,11 @@ <h2 class="mat-title">

<!-- edit options -->
<!-- TODO: move edit and delete function to config menu and add "Create new data model" to this place -->
<span class="ontology-actions">
<span class="ontology-actions project-actions" *ngIf="project.status">
<p class="mat-caption space-reducer">Data model configuration</p>
<span
[matTooltip]="(ontology.lastModificationDate ? 'Edit data model info' : 'This data model can\'t be edited because of missing lastModificationDate!')">
<button mat-button [disabled]="!ontology.lastModificationDate" [disabled]="!ontology.lastModificationDate"
<button mat-button [disabled]="!ontology.lastModificationDate"
(click)="$event.stopPropagation(); openOntologyForm('editOntology', ontology.id)">
<mat-icon>edit</mat-icon>
Edit
@@ -182,6 +182,7 @@ <h2 class="mat-title">
<app-resource-class-info *ngFor="let resClass of ontoClasses"
[resourceClass]="resClass"
[projectCode]="projectCode"
[projectStatus]="project.status"
[ontoProperties]="ontoProperties"
[expanded]="expandClasses"
[(lastModificationDate)]="lastModificationDate"
@@ -199,20 +200,20 @@ <h2 class="mat-title">
<app-property-info
[propDef]="ontology?.properties[prop.id]"
[projectCode]="projectCode"
[projectStatus]="project.status"
[(lastModificationDate)]="lastModificationDate"
(editResourceProperty)="openPropertyForm('editProperty', $event)"
(deleteResourceProperty)="delete('Property', $event)">
</app-property-info>
</mat-list-item>
<!-- <mat-list-item *ngFor="let prop of ontoProperties">{{prop.label}}</mat-list-item> -->
</mat-list>
</div>
</mat-sidenav-content>
</mat-sidenav-container>

<div *ngIf="view === 'graph'" class="ontology-viewer">
<!-- <div *ngIf="view === 'graph'" class="ontology-viewer">
<app-ontology-visualizer [ontology]="ontology" [ontoClasses]="ontoClasses"></app-ontology-visualizer>
</div>
</div> -->

<app-progress-indicator *ngIf="loadOntology && !loading && view !== 'graph'"></app-progress-indicator>
</div>
@@ -122,19 +122,3 @@ $width: 340px;
top: 80px;
}

.mat-caption.space-reducer {
margin-top: 0;
margin-bottom: 6px;
}
.ontology-actions {
border-left: 1px solid $primary_200;
padding: 0 12px;
.mat-caption.space-reducer {
margin-top: -6px;
margin-bottom: 6px;
}
}

button.space-reducer {
margin: 0;
}
@@ -48,7 +48,7 @@
</span>
</div>

<div class="action-bubble" *ngIf="lastModificationDate && showActionBubble" [@simpleFadeAnimation]="'in'">
<div class="action-bubble" *ngIf="lastModificationDate && showActionBubble && projectStatus" [@simpleFadeAnimation]="'in'">
<!-- property action in case of resource class' view has different buttons and actions -->
<div class="button-container" *ngIf="propCard">
<!-- TODO: edit cardinality is disabled for the moment. Will be activated as soon as we use DSP-API 13.9.1 -->
@@ -87,6 +87,8 @@ export class PropertyInfoComponent implements OnChanges, AfterContentInit {

@Input() projectCode: string;

@Input() projectStatus: boolean;

@Input() lastModificationDate?: string;

// event emitter when the lastModificationDate changed; bidirectional binding with lastModificationDate parameter
@@ -16,7 +16,7 @@
</span>
</mat-card-subtitle>
<span class="resource-class-header-action">
<span class="resource-class-more"
<span class="resource-class-more" *ngIf="projectStatus"
[matTooltip]="(ontology.lastModificationDate ? 'more' : 'This data model can\'t be edited because of missing lastModificationDate!')">
<button mat-icon-button [matMenuTriggerFor]="resClassMenu" class="res-class-menu" [disabled]="!ontology.lastModificationDate">
<mat-icon>more_horiz</mat-icon>
@@ -73,7 +73,7 @@
</ng-template>
<!-- button to assign new property to class -->
<mat-list>
<mat-list-item *ngIf="lastModificationDate" class="property link" [matMenuTriggerFor]="addPropertyMenu">
<mat-list-item *ngIf="lastModificationDate && projectStatus" class="property link" [matMenuTriggerFor]="addPropertyMenu">
<span mat-list-icon class="list-icon">
<mat-icon>add</mat-icon>
</span>
@@ -28,7 +28,7 @@ import { ResourceClassInfoComponent } from './resource-class-info.component';
* Property is of type simple text
*/
@Component({
template: '<app-resource-class-info #resClassInfo [resourceClass]="resourceClass"></app-resource-class-info>'
template: '<app-resource-class-info #resClassInfo [resourceClass]="resourceClass" [projectStatus]="true"></app-resource-class-info>'
})
class HostComponent implements OnInit {

@@ -38,6 +38,8 @@ export class ResourceClassInfoComponent implements OnInit {

@Input() projectCode: string;

@Input() projectStatus: boolean;

@Input() ontoProperties: ResourcePropertyDefinitionWithAllLanguages[] = [];

@Input() lastModificationDate?: string;
@@ -30,7 +30,7 @@
<button mat-button
class="edit"
[matTooltip]="'edit'"
*ngIf="!readOnlyValue && canModify && !editModeActive"
*ngIf="!readOnlyValue && canModify && !editModeActive && projectStatus"
(click)="activateEditMode()">
<mat-icon>edit</mat-icon>
</button>
@@ -50,7 +50,7 @@
<span [matTooltip]="(canDelete ? 'delete' : 'This value cannot be deleted because at least one value is required')">
<button mat-button
class="delete"
*ngIf="!readOnlyValue && canModify && !editModeActive"
*ngIf="!readOnlyValue && canModify && !editModeActive && projectStatus"
[disabled]="!canDelete"
(click)="openDialog()">
<mat-icon>delete</mat-icon>
@@ -254,7 +254,9 @@ class TestDateValueComponent {
@Component({
selector: 'lib-host-component',
template: `
<app-display-edit *ngIf="readValue" #displayEditVal [parentResource]="readResource"
<app-display-edit *ngIf="readValue" #displayEditVal
[parentResource]="readResource"
[projectStatus]="true"
[displayValue]="readValue"
[propArray]="propArray"
[canDelete]="deleteIsAllowed"
@@ -77,6 +77,8 @@ export class DisplayEditComponent implements OnInit {

@Input() canDelete: boolean;

@Input() projectStatus: boolean;

@Output() referredResourceClicked: EventEmitter<ReadLinkValue> = new EventEmitter<ReadLinkValue>();

@Output() referredResourceHovered: EventEmitter<ReadLinkValue> = new EventEmitter<ReadLinkValue>();
@@ -45,7 +45,7 @@ <h3 class="label mat-title">
</mat-menu>

<!-- more menu with: delete, erase resource -->
<button *ngIf="editPermissions" mat-icon-button class="more-menu" matTooltip="More" matTooltipPosition="above" [matMenuTriggerFor]="more" [disabled]="deletedResource">
<button *ngIf="editPermissions && project?.status" mat-icon-button class="more-menu" matTooltip="More" matTooltipPosition="above" [matMenuTriggerFor]="more" [disabled]="deletedResource">
<mat-icon>more_vert</mat-icon>
</button>
<mat-menu #more="matMenu" class="res-more-menu">
@@ -57,8 +57,8 @@ <h3 class="label mat-title">
<mat-icon>delete</mat-icon>
Delete resource
</button>
<button mat-menu-item matTooltip="Erase resource forever. This cannot be undone." matTooltipPosition="above"
[disabled]="!adminPermissions" (click)="openDialog('erase')">
<button *ngIf="adminPermissions" mat-menu-item matTooltip="Erase resource forever. This cannot be undone." matTooltipPosition="above"
(click)="openDialog('erase')">
<mat-icon>delete_forever</mat-icon>
Erase resource
</button>
@@ -121,12 +121,13 @@ <h3 class="label mat-title">
[displayValue]="val"
[propArray]="resource.resProps"
[canDelete]="deleteValueIsAllowed(prop)"
[projectStatus]="project?.status"
(referredResourceClicked)="openResource($event)"
(referredResourceHovered)="previewResource($event)">
</app-display-edit>
</div>
<!-- Add value form -->
<div *ngIf="addValueFormIsVisible && propID === prop.propDef.id">
<div *ngIf="addValueFormIsVisible && propID === prop.propDef.id && project?.status">
<app-add-value #addValue
class="add-value"
[parentResource]="resource.res"
@@ -135,7 +136,7 @@ <h3 class="label mat-title">
</app-add-value>
</div>
<!-- Add button -->
<div *ngIf="addValueIsAllowed(prop)">
<div *ngIf="addValueIsAllowed(prop) && project?.status">
<button mat-icon-button class="value-action create"
(click)="showAddValueForm(prop)"
title="Add a new value">
@@ -48,7 +48,9 @@ export class ResourceListComponent implements OnInit {

ngOnInit() {
// select the first item in the list
this.selectResource({ checked: true, resIndex: 0, resId: this.resources.resources[0].id, resLabel: this.resources.resources[0].label, isCheckbox: false });
if (this.resources.resources.length) {
this.selectResource({ checked: true, resIndex: 0, resId: this.resources.resources[0].id, resLabel: this.resources.resources[0].label, isCheckbox: false });
}
}

selectResource(status: CheckboxUpdate) {
@@ -161,3 +161,20 @@ app-color-value {
display: none;
}
}

.mat-caption.space-reducer {
margin-top: 0;
margin-bottom: 6px;
}
.project-actions {
border-left: 1px solid $primary_200;
padding: 0 12px;
.mat-caption.space-reducer {
margin-top: -6px;
margin-bottom: 6px;
}
}

button.space-reducer {
margin: 0;
}

0 comments on commit d7bec78

Please sign in to comment.