Add delete buttons

src/app/components/task-list/task-list.component.html

@@ -3,40 +3,63 @@
     <a *ngFor="let task of analysis.tasks" class="list-item" [class.is-active]="task.token === token">
       <div *ngIf="!task.info.startedAt" (click)="open(task.token)">
         <p>
-          <span class="is-capitalized"><i class="fa" [class.fa-capsules]="task.info.target === 'drug'" [class.fa-crosshairs]="task.info.target === 'drug-target'"></i> {{task.info.algorithm}}</span>
+          <span class="is-capitalized"><i class="fa" [class.fa-capsules]="task.info.target === 'drug'"
+                                          [class.fa-crosshairs]="task.info.target === 'drug-target'"></i> {{task.info.algorithm}}</span>
           <span class="icon is-pulled-right"><i class="fas fa-pause" aria-hidden="true"></i></span>
         </p>
         <p>
           <small>Queue position: {{task.stats.queuePosition}}/{{task.stats.queueLength}}</small>
+          <a (click)="analysis.removeTask(task.token)" class="has-text-danger">
+            <span class="icon is-pulled-right">
+              <i class="fa fa-trash"></i>
+            </span>
+          </a>
         </p>
       </div>
       <div *ngIf="!task.info.done && !task.info.failed && task.info.startedAt" (click)="open(task.token)">
         <p>
-          <span class="is-capitalized"><i class="fa" [class.fa-capsules]="task.info.target === 'drug'" [class.fa-crosshairs]="task.info.target === 'drug-target'"></i> {{task.info.algorithm}}</span>
+          <span class="is-capitalized"><i class="fa" [class.fa-capsules]="task.info.target === 'drug'"
+                                          [class.fa-crosshairs]="task.info.target === 'drug-target'"></i> {{task.info.algorithm}}</span>
           <span class="icon is-pulled-right"><i class="fas fa-spinner fa-spin" aria-hidden="true"></i></span>
         </p>
         <p>
           <small>Started {{task.info.startedAt | date :'short'}}</small>
+          <a (click)="analysis.removeTask(task.token)" class="is-pulled-right has-text-danger">
+            <span class="icon is-pulled-right">
+              <i class="fa fa-trash"></i>
+            </span>
+          </a>
         </p>
         <progress class="progress is-success" [value]="task.info.progress * 100" max="100">Test</progress>
-
       </div>
       <div *ngIf="task.info.done" (click)="open(task.token)">
         <p>
-          <span class="is-capitalized"><i class="fa" [class.fa-capsules]="task.info.target === 'drug'" [class.fa-crosshairs]="task.info.target === 'drug-target'"></i> {{task.info.algorithm}}</span>
+          <span class="is-capitalized"><i class="fa" [class.fa-capsules]="task.info.target === 'drug'"
+                                          [class.fa-crosshairs]="task.info.target === 'drug-target'"></i> {{task.info.algorithm}}</span>
           <span class="icon is-pulled-right"><i class="fas fa-check" aria-hidden="true"></i></span>
         </p>
         <p>
           <small>Finished {{task.info.finishedAt | date :'short'}}</small>
+          <a (click)="analysis.removeTask(task.token)" class="is-pulled-right has-text-danger">
+            <span class="icon is-pulled-right">
+              <i class="fa fa-trash"></i>
+            </span>
+          </a>
         </p>
       </div>
       <div *ngIf="task.info.failed && task.info.finishedAt == null">
         <p>
-          <span class="is-capitalized"><i class="fa" [class.fa-capsules]="task.info.target === 'drug'" [class.fa-crosshairs]="task.info.target === 'drug-target'"></i> {{task.info.algorithm}}</span>
+          <span class="is-capitalized"><i class="fa" [class.fa-capsules]="task.info.target === 'drug'"
+                                          [class.fa-crosshairs]="task.info.target === 'drug-target'"></i> {{task.info.algorithm}}</span>
           <span class="icon is-pulled-right"><i class="fas fa-exclamation-triangle" aria-hidden="true"></i></span>
         </p>
         <p class="has-text-danger">
           <small>{{task.info.status}}</small>
+          <a (click)="analysis.removeTask(task.token)" class="is-pulled-right has-text-danger">
+            <span class="icon is-pulled-right">
+              <i class="fa fa-trash"></i>
+            </span>
+          </a>
         </p>
       </div>
     </a>