From 0be05f321baf73e71e2577b0bb496d5c12f68f57 Mon Sep 17 00:00:00 2001
From: infacc <st154936@stud.uni-stuttgart.de>
Date: Fri, 4 Aug 2023 14:35:29 +0200
Subject: [PATCH] improve how timline step options are displayed

---
 .../export-experiment/export-experiment.component.html      | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/app/dialogs/export-experiment/export-experiment.component.html b/src/app/dialogs/export-experiment/export-experiment.component.html
index ee7f693..8b4b729 100644
--- a/src/app/dialogs/export-experiment/export-experiment.component.html
+++ b/src/app/dialogs/export-experiment/export-experiment.component.html
@@ -28,7 +28,11 @@ <h1 mat-dialog-title>Export Config</h1>
         <mat-selection-list>
             <mat-list-option *ngFor="let step of stepListPage" [value]="step.sequence" [selected]="stepList.includes(step.sequence)" 
                     (selectedChange)="selectStep(step.sequence, $event)">
-                Step {{step.sequence}} ({{step.processorName}}@{{step.processorVersion}}) - Status: {{step.status}}, Result Quality: {{step.resultQuality}}
+                <div class="export-selection">
+                    <span>Step {{step.sequence}} ({{step.processorName}}@{{step.processorVersion}})</span>
+                    <qhana-step-status matTooltip="Status: {{step.status}}" [step]="step" [noText]="step.status !== 'PENDING'" [spinner]="0"></qhana-step-status>
+                    <div matTooltip="Result Quality" *ngIf="step.resultQuality !== 'UNKNOWN'">- Quality: {{step.resultQuality}}</div>
+                </div>
             </mat-list-option>
         </mat-selection-list>
     </div>