#166 created a mat-icon delete component

Signed-off-by: Karol Bakas <karol.bakas@fau.de>

src/digitalIdentity-frontend/src/app/app.module.ts

@@ -25,6 +25,7 @@ import { MenuItemComponent } from './components/menu-item/menu-item.component';
 import { FilteredTableComponent } from './shared/filtered-table/filtered-table.component';
 import { ChangePasswordComponent } from './pages/change-password-page/change-password-page.component';
 import { CredDefOverviewPageComponent } from './pages/credential/credential-overview-page/credDef-overview-page.component';
+import { DeleteIconClickableComponent } from './shared/delete-icon-clickable/delete-icon-clickable.component';
 
 @NgModule({
   declarations: [
@@ -43,6 +44,7 @@ import { CredDefOverviewPageComponent } from './pages/credential/credential-over
     FilteredTableComponent,
     ChangePasswordComponent,
     CredDefOverviewPageComponent,
+    DeleteIconClickableComponent,
   ],
   imports: [
     AppRoutingModule,
@@ -51,7 +53,7 @@ import { CredDefOverviewPageComponent } from './pages/credential/credential-over
     FormsModule,
     HttpClientModule,
     MaterialModule,
-    ReactiveFormsModule
+    ReactiveFormsModule,
   ],
   bootstrap: [AppComponent],
   providers: [],

src/digitalIdentity-frontend/src/app/components/material/material.module.ts

@@ -13,6 +13,7 @@ import { MatMenuModule } from '@angular/material/menu';
 
 import { MatDatepickerModule } from '@angular/material/datepicker';
 import { MatNativeDateModule } from '@angular/material/core';
+
 //module for DD/MM/YYYY date format
 import { MAT_DATE_LOCALE } from '@angular/material/core';
 

src/digitalIdentity-frontend/src/app/shared/delete-icon-clickable/delete-icon-clickable.component.html

@@ -0,0 +1,3 @@
+<button mat-icon-button (mousedown)="deleteEvent()">
+  <mat-icon [attr.aria-label]="'Delete item'"> delete </mat-icon>
+</button>

src/digitalIdentity-frontend/src/app/shared/delete-icon-clickable/delete-icon-clickable.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DeleteIconClickableComponent } from './delete-icon-clickable.component';
+
+describe('DeleteIconClickableComponent', () => {
+  let component: DeleteIconClickableComponent;
+  let fixture: ComponentFixture<DeleteIconClickableComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ DeleteIconClickableComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DeleteIconClickableComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/digitalIdentity-frontend/src/app/shared/delete-icon-clickable/delete-icon-clickable.component.ts

@@ -0,0 +1,30 @@
+import {
+  animate,
+  state,
+  style,
+  transition,
+  trigger,
+} from '@angular/animations';
+import { Component, Input, OnInit } from '@angular/core';
+import { BackendHttpService } from 'src/app/services/backend-http-service/backend-http-service.service';
+
+@Component({
+  selector: 'app-delete-icon-clickable',
+  templateUrl: './delete-icon-clickable.component.html',
+  styleUrls: ['./delete-icon-clickable.component.css'],
+})
+export class DeleteIconClickableComponent implements OnInit {
+  @Input() id: number = -1;
+  @Input() deleteRequest: (id: number) => void = (id: number) => {
+    ('');
+  };
+
+  constructor(private httpService: BackendHttpService) {}
+
+  ngOnInit(): void {}
+
+  deleteEvent() {
+    console.log('Delete this item' + this.id);
+    this.deleteRequest(this.id);
+  }
+}