Prefix workflows list with repositories

ManageIQ · Aug 31, 2023 · cdc1132 · cdc1132
1 parent 27e424e
commit cdc1132
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 3 deletions.
diff --git a/src/dialog-editor/components/tree-selector/tree-selector.html b/src/dialog-editor/components/tree-selector/tree-selector.html
@@ -42,9 +42,16 @@
     </div>
     <div ng-if="$ctrl.treeOptions.automationType==$ctrl.treeOptions.automationTypes.workflow">
       <div ng-if="$ctrl.treeOptions.data">
-        <ul class="nav nav-list workflows_list_wrapper" ng-repeat="workflow in $ctrl.treeOptions.data">
-          <li class="workflow_item" ng-click="$ctrl.treeOptions.onSelect(workflow)">
-              {{workflow.name}}
+        <ul class="nav nav-list workflows_list_wrapper">
+          <li class="workflows_list_header">
+            <div class="col-md-6">Repository</div>
+            <div class="col-md-6">Workflow Name</div>
+          </li>
+          <li class="workflow_item" ng-repeat="workflow in $ctrl.treeOptions.data">
+            <div class="workflow_item_row" ng-click="$ctrl.treeOptions.onSelect(workflow)">
+              <div class="col-md-6">{{workflow.configuration_script_source.name}}</div>
+              <div class="col-md-6">{{workflow.name}}</div>
+            </div>
           </li>
         </ul>
       </div>

diff --git a/src/styles/dialog-editor-boxes.scss b/src/styles/dialog-editor-boxes.scss
@@ -192,11 +192,30 @@ l.nav.nav-list.workflows {
 
     ul.workflows_list_wrapper {
       display: flex;
+      flex-direction: column;
+      border: 1px solid lightgray;
+
+      li.workflows_list_header {
+        background: lightgray;
+        padding: 10px 0;
+        font-weight: bold;
+      }
 
       li.workflow_item {
         display: flex;
         flex-grow: 1;
         padding: 5px;
+        border-bottom: 1px solid lightgray;
+
+        &:last-child {
+          border-bottom: 0 !important;
+        }
+
+        .workflow_item_row {
+          display: flex;
+          flex-grow: 1;
+          margin-left: -5px;
+        }
 
         &:hover {
           background: #e4e5e6;