From 12eee030995a2f151757f1f2a71660e03476b678 Mon Sep 17 00:00:00 2001
From: Tristan Cacqueray <tdecacqu@redhat.com>
Date: Fri, 8 Mar 2019 15:00:23 +0000
Subject: [PATCH] web: add flatten checkbox

This change adds a checkbox to display the jobs as a flat list.

Change-Id: Iaf7c8f9de356661c9ab24c83c409c59f866ffaaf
---
 web/src/containers/jobs/Jobs.jsx | 44 ++++++++++++++++++++------------
 1 file changed, 28 insertions(+), 16 deletions(-)

diff --git a/web/src/containers/jobs/Jobs.jsx b/web/src/containers/jobs/Jobs.jsx
index 6a83d9bc46..fd7cd8d41a 100644
--- a/web/src/containers/jobs/Jobs.jsx
+++ b/web/src/containers/jobs/Jobs.jsx
@@ -17,6 +17,7 @@ import PropTypes from 'prop-types'
 import { connect } from 'react-redux'
 import { Link } from 'react-router-dom'
 import {
+  Checkbox,
   Form,
   FormGroup,
   FormControl,
@@ -32,7 +33,8 @@ class JobsList extends React.Component {
   }
 
   state = {
-    filter: null
+    filter: null,
+    flatten: false,
   }
 
   handleKeyPress = (e) => {
@@ -45,7 +47,7 @@ class JobsList extends React.Component {
 
   render () {
     const { jobs } = this.props
-    const { filter } = this.state
+    const { filter, flatten } = this.state
 
     const linkPrefix = this.props.tenant.linkPrefix + '/job/'
 
@@ -84,8 +86,10 @@ class JobsList extends React.Component {
           filtered: filtered,
         }
         // Visit parent recursively
-        for (let parent of parents) {
-          getNode(jobMap[parent], filtered)
+        if (!flatten) {
+          for (let parent of parents) {
+            getNode(jobMap[parent], filtered)
+          }
         }
       }
       return visited[job.name]
@@ -110,19 +114,21 @@ class JobsList extends React.Component {
       const jobNode = getNode(job, filtered)
       if (!jobNode.filtered) {
         let attached = false
-        // add tree node to each parent and expand the parent
-        for (let parent of jobNode.parents) {
-          const parentNode = visited[parent]
-          if (!parentNode) {
-            console.log(
-              'Job ', job.name, ' parent ', parent, ' does not exist!')
-            continue
+        if (!flatten) {
+          // add tree node to each parent and expand the parent
+          for (let parent of jobNode.parents) {
+            const parentNode = visited[parent]
+            if (!parentNode) {
+              console.log(
+                'Job ', job.name, ' parent ', parent, ' does not exist!')
+              continue
+            }
+            if (!parentNode.nodes) {
+              parentNode.nodes = []
+            }
+            parentNode.nodes.push(jobNode)
+            attached = true
           }
-          if (!parentNode.nodes) {
-            parentNode.nodes = []
-          }
-          parentNode.nodes.push(jobNode)
-          attached = true
         }
         // else add node at the tree root
         if (!attached || jobNode.parents.length === 0) {
@@ -153,6 +159,12 @@ class JobsList extends React.Component {
               </FormControl.Feedback>
             )}
           </FormGroup>
+          <FormGroup controlId='jobs-flatten'>
+            &nbsp; Flatten list &nbsp;
+            <Checkbox
+              defaultChecked={flatten}
+              onChange={(e) => this.setState({flatten: e.target.checked})} />
+          </FormGroup>
         </Form>
         <TreeView nodes={nodes} />
       </div>