Improve display of vertical tree gridlines in timegraph views

v0.4.2 introduced vertical gridlines for the trees of timegraph views.
However, 2 vertical lines were drawn so that they appeared thicker. This
commit fixes that.

Besides, the vertical line on the right of the last column are not
drawn anymore. For that, the hideFiller flag needed to be added to the
EntryTree props so that that flag can be set to true, propagated and
hence the filler can be hidden.

Signed-off-by: Bernd Hufmann <bernd.hufmann@ericsson.com>

packages/react-components/src/components/timegraph-output-component.tsx

@@ -541,6 +541,7 @@ export class TimegraphOutputComponent extends AbstractTreeOutputComponent<Timegr
                         emptyNodes={this.state.emptyNodes}
                         hideEmptyNodes={this.shouldHideEmptyNodes}
                         headers={this.state.columns}
+                        hideFillers={true}
                     />
                 </div>
                 <div ref={this.markerTreeRef} className="scrollable" style={{ height: this.getMarkersLayerHeight() }}>
@@ -556,6 +557,7 @@ export class TimegraphOutputComponent extends AbstractTreeOutputComponent<Timegr
                         onClose={this.onMarkerCategoryRowClose}
                         showHeader={false}
                         className="table-tree timegraph-tree"
+                        hideFillers={true}
                     />
                 </div>
             </>

packages/react-components/src/components/utils/filter-tree/entry-tree.tsx

@@ -26,6 +26,7 @@ interface EntryTreeProps {
     showHeader: boolean;
     headers: ColumnHeader[];
     className: string;
+    hideFillers?: boolean;
 }
 
 export class EntryTree extends React.Component<EntryTreeProps> {

packages/react-components/style/output-components-style.css

@@ -307,18 +307,19 @@ canvas {
 
 .timegraph-tree {
     border-collapse: collapse;
+    border: none;
 }
 
 .timegraph-tree tr {
     /* TODO: Fix row alignment, this number is arbitrary, it works [on my machine], but it should match line height in timeline-chart */
     line-height: 18px;
-    border:none;
 }
 
 .timegraph-tree td {
     padding: 1px;
     border-left: 1px solid var(--trace-viewer-tree-inactiveIndentGuidesStroke);
-    border-bottom:none;
+    border-right: none;
+    border-bottom: none;
 }
 
 #input-filter-container {