minor refinements

Signed-off-by: Patrick Coray <patrick.coray@bluewin.ch>
copa2 · Nov 18, 2018 · db2ac3b · db2ac3b
1 parent 09dafb4
commit db2ac3b
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 15 deletions.
diff --git a/packages/jaeger-ui/src/components/TracePage/TraceGraph/OpNode.css b/packages/jaeger-ui/src/components/TracePage/TraceGraph/OpNode.css
@@ -15,10 +15,16 @@ limitations under the License.
 */
 
 .OpNode {
-  border: 1px solid #777;
-  box-shadow: 0 0px 3px rgba(0, 0, 0, 0.2);
+  border: 1px solid #111;
   cursor: pointer;
   white-space: nowrap;
+  border-collapse: separate;
+  border-radius: 2px;
+}
+
+.OpNode td,
+th {
+  border: none;
 }
 
 .OpMode--mode-service {

diff --git a/packages/jaeger-ui/src/components/TracePage/TraceGraph/OpNode.js b/packages/jaeger-ui/src/components/TracePage/TraceGraph/OpNode.js
@@ -33,7 +33,7 @@ type Props = {
 };
 
 function formatPercent(percent) {
-  return Math.round(percent * 10000) / 100;
+  return Math.round(percent * 100) / 100;
 }
 
 export default class OpNode extends React.PureComponent<Props> {
@@ -74,15 +74,15 @@ export default class OpNode extends React.PureComponent<Props> {
     const { count, time, percent, selfTime, operation, service, mode } = this.props;
     const modeType = mode ? 'time' : 'service';
     // Spans over 20 % time are full red - we have probably to reconsider better approach
-    const percentBoosted = Math.min(percent * 5, 1);
+    const percentBoosted = Math.min(percent / 20, 1);
     const backgroundColor = mode
       ? [255, 0, 0, percentBoosted].join()
       : colorGenerator
           .getRgbColorByKey(service)
           .concat(0.8)
           .join();
     const table = (
-      <table className={`OpNode OpNode--mode-${modeType}`}>
+      <table className={`OpNode OpNode--mode-${modeType}`} cellSpacing="0">
         <tbody
           style={{
             background: `rgba(${backgroundColor})`,

diff --git a/packages/jaeger-ui/src/components/TracePage/TraceGraph/OpNode.test.js b/packages/jaeger-ui/src/components/TracePage/TraceGraph/OpNode.test.js
@@ -24,7 +24,7 @@ describe('<OpNode>', () => {
     const props = {
       count: 5,
       time: 200000,
-      percent: 0.0789,
+      percent: 7.89,
       selfTime: 180000,
       operation: 'op1',
       service: 'service1',

diff --git a/packages/jaeger-ui/src/components/TracePage/TraceGraph/TraceGraph.js b/packages/jaeger-ui/src/components/TracePage/TraceGraph/TraceGraph.js
@@ -97,7 +97,7 @@ export default class TraceGraph extends React.PureComponent<Props, State> {
       const nd = {
         count: n.members.length,
         time: ntime,
-        percent: 1.0 / this.props.trace.duration * ntime,
+        percent: 100 / this.props.trace.duration * ntime,
         selfTime: ntime - n.members.reduce((p, m) => p + this.getChildOfDuration(m.span.spanID), 0),
         mode: this.state.nodeMode,
       };

diff --git a/packages/jaeger-ui/src/components/TracePage/TraceGraph/TraceGraph.test.js b/packages/jaeger-ui/src/components/TracePage/TraceGraph/TraceGraph.test.js
@@ -26,7 +26,7 @@ function assertData(nodes, service, operation, count, time, percent, selfTime) {
   expect(d).toBeDefined();
   expect(d.count).toBe(count);
   expect(d.time).toBe(time * 1000);
-  expect(d.percent).toBeCloseTo(percent,2);
+  expect(d.percent).toBeCloseTo(percent, 2);
   expect(d.selfTime).toBe(selfTime * 1000);
 }
 
@@ -50,16 +50,16 @@ describe('<TraceGraph>', () => {
     const traceDag = wrapper.instance().calculateTraceDag();
     expect(traceDag.nodesMap.size).toBe(7);
     const nodes = [...traceDag.nodesMap.values()];
-    assertData(nodes, 'service1', 'op1', 1, 390, .39, 204);
+    assertData(nodes, 'service1', 'op1', 1, 390, 39, 204);
     // accumulate data (count,times)
-    assertData(nodes, 'service1', 'op2', 2, 100, .1, 100);
+    assertData(nodes, 'service1', 'op2', 2, 100, 10, 100);
     // child of durations are valid
-    assertData(nodes, 'service1', 'op3', 1, 66, .066, 46);
-    assertData(nodes, 'service2', 'op1', 1, 20, .02, 2);
-    assertData(nodes, 'service2', 'op2', 1, 18, .018, 18);
+    assertData(nodes, 'service1', 'op3', 1, 66, 6.6, 46);
+    assertData(nodes, 'service2', 'op1', 1, 20, 2, 2);
+    assertData(nodes, 'service2', 'op2', 1, 18, 1.8, 18);
     // follows relation will not accumulate to inmethod
-    assertData(nodes, 'service1', 'op4', 1, 20, .02, 20);
-    assertData(nodes, 'service2', 'op3', 1, 200, .2, 200);
+    assertData(nodes, 'service1', 'op4', 1, 20, 2, 20);
+    assertData(nodes, 'service2', 'op3', 1, 200, 20, 200);
   });
 
   it('it may show no traces', () => {