Deletion supported in context menu

src/app/app.module.ts

@@ -164,6 +164,7 @@ import { SymbolsMenuComponent } from './components/preferences/common/symbols-me
 import { SearchFilter } from './filters/searchFilter.pipe';
 import { RecentlyOpenedProjectService } from './services/recentlyOpenedProject.service';
 import { ServerManagementService } from './services/server-management.service';
+import { DeleteActionComponent } from './components/project-map/context-menu/actions/delete-action/delete-action.component';
 
 if (environment.production) {
   Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', {
@@ -198,6 +199,7 @@ if (environment.production) {
     MoveLayerUpActionComponent,
     EditStyleActionComponent,
     EditTextActionComponent,
+    DeleteActionComponent,
     ProjectMapShortcutsComponent,
     SettingsComponent,
     PreferencesComponent,

src/app/components/project-map/context-menu/actions/delete-action/delete-action.component.html

@@ -0,0 +1,4 @@
+<button mat-menu-item (click)="delete()">
+    <mat-icon>delete</mat-icon>
+    <span>Delete</span>
+</button>

src/app/components/project-map/context-menu/actions/delete-action/delete-action.component.spec.ts

@@ -0,0 +1,66 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { DeleteActionComponent } from './delete-action.component';
+import { MatIconModule, MatMenuModule } from '@angular/material';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { NodesDataSource } from '../../../../../cartography/datasources/nodes-datasource';
+import { DrawingsDataSource } from '../../../../../cartography/datasources/drawings-datasource';
+import { NodeService } from '../../../../../services/node.service';
+import { DrawingService } from '../../../../../services/drawing.service';
+import { MockedDrawingService, MockedNodeService } from '../../../project-map.component.spec';
+import { Node } from '../../../../../cartography/models/node';
+import { Drawing } from '../../../../../cartography/models/drawing';
+import { of } from 'rxjs';
+
+describe('DeleteActionComponent', () => {
+    let component: DeleteActionComponent;
+    let fixture: ComponentFixture<DeleteActionComponent>;
+    let mockedNodeService: MockedNodeService = new MockedNodeService();
+    let mockedDrawingService: MockedDrawingService = new MockedDrawingService();
+
+    beforeEach(async(() => {
+        TestBed.configureTestingModule({
+            imports: [MatIconModule, MatMenuModule, NoopAnimationsModule],
+            providers: [
+                { provide: NodesDataSource,  useClass: NodesDataSource },
+                { provide: DrawingsDataSource, useClass: DrawingsDataSource },
+                { provide: NodeService, useValue: mockedNodeService },
+                { provide: DrawingService, useValue: mockedDrawingService },
+            ],
+            declarations: [DeleteActionComponent]
+        }).compileComponents();
+    }));
+
+    beforeEach(() => {
+        fixture = TestBed.createComponent(DeleteActionComponent);
+        component = fixture.componentInstance;
+        fixture.detectChanges();
+    });
+
+    it('should create', () => {
+        expect(component).toBeTruthy();
+    });
+
+    it('should call delete action in drawing service', () => {
+        let node = { node_id: '1' } as Node;
+        component.nodes = [node];
+        let drawing = { drawing_id: '1' } as Drawing;
+        component.drawings = [drawing];
+        spyOn(mockedDrawingService, 'delete').and.returnValue(of());
+
+        component.delete();
+
+        expect(mockedDrawingService.delete).toHaveBeenCalled();
+    });
+
+    it('should call delete action in node service', () => {
+        let node = { node_id: '1' } as Node;
+        component.nodes = [node];
+        let drawing = { drawing_id: '1' } as Drawing;
+        component.drawings = [drawing];
+        spyOn(mockedNodeService, 'delete').and.returnValue(of());
+
+        component.delete();
+
+        expect(mockedNodeService.delete).toHaveBeenCalled();
+    });
+});

src/app/components/project-map/context-menu/actions/delete-action/delete-action.component.ts

@@ -0,0 +1,41 @@
+import { Component, OnInit, Input } from '@angular/core';
+import { Server } from '../../../../../models/server';
+import { Node } from '../../../../../cartography/models/node';
+import { NodesDataSource } from '../../../../../cartography/datasources/nodes-datasource';
+import { NodeService } from '../../../../../services/node.service';
+import { Drawing } from '../../../../../cartography/models/drawing';
+import { DrawingsDataSource } from '../../../../../cartography/datasources/drawings-datasource';
+import { DrawingService } from '../../../../../services/drawing.service';
+
+@Component({
+  selector: 'app-delete-action',
+  templateUrl: './delete-action.component.html'
+})
+export class DeleteActionComponent implements OnInit {
+  @Input() server: Server;
+  @Input() nodes: Node[];
+  @Input() drawings: Drawing[];
+
+  constructor(
+    private nodesDataSource: NodesDataSource,
+    private drawingsDataSource: DrawingsDataSource,
+    private nodeService: NodeService,
+    private drawingService: DrawingService
+  ) {}
+
+  ngOnInit() {}
+
+  delete() {
+    this.nodes.forEach((node) => {
+        this.nodesDataSource.remove(node);
+
+        this.nodeService.delete(this.server, node).subscribe((node: Node) => {});
+    });
+
+    this.drawings.forEach((drawing) => {
+        this.drawingsDataSource.remove(drawing);
+
+        this.drawingService.delete(this.server, drawing).subscribe((drawing: Drawing) => {});
+    });
+  }
+}

src/app/components/project-map/context-menu/context-menu.component.html

@@ -26,5 +26,11 @@
       [nodes]="nodes"
       [drawings]="drawings"
     ></app-move-layer-down-action>
+    <app-delete-action
+      *ngIf="!projectService.isReadOnly(project)"
+      [server]="server"
+      [nodes]="nodes"
+      [drawings]="drawings"
+    ></app-delete-action>
   </mat-menu>
 </div>

src/app/components/project-map/project-map.component.spec.ts

@@ -53,6 +53,10 @@ export class MockedNodeService {
   updatePosition(): Observable<Node> {
     return of(this.node);
   }
+
+  delete(server: Server, node: Node) {
+    return of();
+  }
 }
 
 export class MockedDrawingService {