Task execution page: revisit the way we portray task arguments

Resolves #925

Author: oodamien

ui/src/app/tasks/task-execution/task-execution.component.html

@@ -28,7 +28,17 @@
       </tr>
       <tr>
         <td>Arguments</td>
-        <td>{{ taskExecution.arguments || 'N/A' }}</td>
+        <td>
+          <div *ngIf="taskExecution.arguments">
+            <div *ngFor="let arg of getArguments(taskExecution.arguments)">
+              {{ arg[0] }}:
+              <strong>{{ arg[1] }}</strong>
+            </div>
+          </div>
+          <div *ngIf="!taskExecution.arguments">
+            N/A
+          </div>
+        </td>
       </tr>
       <tr>
         <td>External Execution Id</td>

ui/src/app/tasks/task-execution/task-execution.component.ts

@@ -67,4 +67,13 @@ export class TaskExecutionComponent implements OnInit {
     this.routingStateService.back('/tasks/executions', /^(\/tasks\/executions\/)/);
   }
 
+  /**
+   * Prepare args (split line into array)
+   * @param {Array<any>} args
+   * @returns {Array<any>}
+   */
+  getArguments(args: Array<any>): Array<any> {
+    return args.map((arg) => arg.split('='));
+  }
+
 }