From ad1a69c88310c5b9b81b604574770a3035af443d Mon Sep 17 00:00:00 2001 From: nofar9792 Date: Mon, 31 Jan 2022 15:13:06 +0200 Subject: [PATCH 1/3] Unit time Signed-off-by: nofar9792 --- .../__snapshots__/index.test.js.snap | 690 ++++++++++++++++++ .../operationDetailsTable/index.test.js | 8 + .../operationDetailsTable/index.tsx | 44 +- 3 files changed, 741 insertions(+), 1 deletion(-) diff --git a/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/__snapshots__/index.test.js.snap b/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/__snapshots__/index.test.js.snap index 1222d27460..0f5f70397d 100644 --- a/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/__snapshots__/index.test.js.snap +++ b/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/__snapshots__/index.test.js.snap @@ -418,6 +418,696 @@ exports[` render No data table 1`] = ` `; +exports[` render latency in seconds in the table 1`] = ` +
+
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + Name +
+ + + + + + +
+ + 		+ + P95 Latency +
+ + + + + + +
+ + 		+ + Request rate +
+ + + + + + +
+ + 		+ + Error rate +
+ + + + + + +
+ + 		+ +
+ + Impact   + + +
+
+ + + + + + +
+ +
+ + /PlaceOrder + +
+
+
+ + + + +
+
+
+ 8 sec +
+
+ 		+
+
+
+ + + + +
+
+
+ 0.01 req/s +
+
+ 		+
+
+
+ + + + +
+
+
+ 1% +
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+`; + exports[` render some values in the table 1`] = `
', () => { expect(wrapper).toMatchSnapshot(); }); + it('render latency in seconds in the table', () => { + const cloneServiceOpsMetrics = {}; + Object.assign(cloneServiceOpsMetrics, serviceOpsMetrics[0]); + cloneServiceOpsMetrics.latency = 8000; + wrapper.setProps({ ...props, data: [cloneServiceOpsMetrics], loading: false }); + expect(wrapper).toMatchSnapshot(); + }); + it('test column render function', () => { wrapper.setProps({ ...props, diff --git a/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/index.tsx b/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/index.tsx index 002e6fd15c..d25305ed80 100644 --- a/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/index.tsx +++ b/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/index.tsx @@ -34,6 +34,48 @@ type TState = { hoveredRowKey: number; }; +type TDuration = { + mseconds: number; + seconds: number; + minutes: number; + hours: number; + days: number; +}; + +function msToTime(durationInMs: number): string { + const milliseconds = durationInMs % 1000; + const seconds = Math.floor((durationInMs / 1000) % 60); + const minutes = Math.floor((durationInMs / (1000 * 60)) % 60); + const hours = Math.floor((durationInMs / (1000 * 60 * 60)) % 24); + const days = Math.floor((durationInMs / (1000 * 60 * 60 * 24)) % 24); + + const durationObj: TDuration = { + mseconds: milliseconds, + seconds: seconds < 1 ? 0 + seconds : seconds, + minutes: minutes < 1 ? 0 + minutes : minutes, + hours: hours < 1 ? 0 + hours : hours, + days: days < 1 ? 0 + days : days, + }; + + if (durationObj.days > 0) { + return `${durationObj.days} day${durationObj.days === 1 ? '' : 's'}`; + } + + if (durationObj.hours > 0) { + return `${durationObj.hours} hour${durationObj.hours === 1 ? '' : 's'}`; + } + + if (durationObj.minutes > 0) { + return `${durationObj.minutes} min`; + } + + if (durationObj.seconds > 0) { + return `${durationObj.seconds} sec`; + } + + return `${durationObj.mseconds} ms`; +} + export class OperationTableDetails extends React.PureComponent { state = { hoveredRowKey: -1, @@ -73,7 +115,7 @@ export class OperationTableDetails extends React.PureComponent { />
{typeof value === 'number' && row.dataPoints.service_operation_latencies.length > 0 - ? `${value} ms` + ? msToTime(value) : ''}
From c370c6dd6886ef5eb8b77a3cdd03b60d6b9be52c Mon Sep 17 00:00:00 2001 From: nofar9792 Date: Thu, 24 Feb 2022 00:33:13 +0200 Subject: [PATCH 2/3] Use timeConversion Signed-off-by: nofar9792 --- .../__snapshots__/index.test.js.snap | 4 +- .../operationDetailsTable/index.tsx | 45 +------------------ 2 files changed, 4 insertions(+), 45 deletions(-) diff --git a/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/__snapshots__/index.test.js.snap b/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/__snapshots__/index.test.js.snap index 0f5f70397d..d10bfe6862 100644 --- a/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/__snapshots__/index.test.js.snap +++ b/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/__snapshots__/index.test.js.snap @@ -799,7 +799,7 @@ exports[` render latency in seconds in the table 1`] = `
- 8 sec + 8Sec
@@ -1489,7 +1489,7 @@ exports[` render some values in the table 1`] = `
- 736.16 ms + 736ms
diff --git a/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/index.tsx b/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/index.tsx index d25305ed80..cac7d087dc 100644 --- a/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/index.tsx +++ b/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/index.tsx @@ -20,6 +20,7 @@ import { MetricsReduxState, ServiceOpsMetrics } from '../../../../types/metrics' import prefixUrl from '../../../../utils/prefix-url'; import './index.css'; +import { timeConversion } from '../../../../utils/date'; type TProps = { data: ServiceOpsMetrics[] | undefined; @@ -34,48 +35,6 @@ type TState = { hoveredRowKey: number; }; -type TDuration = { - mseconds: number; - seconds: number; - minutes: number; - hours: number; - days: number; -}; - -function msToTime(durationInMs: number): string { - const milliseconds = durationInMs % 1000; - const seconds = Math.floor((durationInMs / 1000) % 60); - const minutes = Math.floor((durationInMs / (1000 * 60)) % 60); - const hours = Math.floor((durationInMs / (1000 * 60 * 60)) % 24); - const days = Math.floor((durationInMs / (1000 * 60 * 60 * 24)) % 24); - - const durationObj: TDuration = { - mseconds: milliseconds, - seconds: seconds < 1 ? 0 + seconds : seconds, - minutes: minutes < 1 ? 0 + minutes : minutes, - hours: hours < 1 ? 0 + hours : hours, - days: days < 1 ? 0 + days : days, - }; - - if (durationObj.days > 0) { - return `${durationObj.days} day${durationObj.days === 1 ? '' : 's'}`; - } - - if (durationObj.hours > 0) { - return `${durationObj.hours} hour${durationObj.hours === 1 ? '' : 's'}`; - } - - if (durationObj.minutes > 0) { - return `${durationObj.minutes} min`; - } - - if (durationObj.seconds > 0) { - return `${durationObj.seconds} sec`; - } - - return `${durationObj.mseconds} ms`; -} - export class OperationTableDetails extends React.PureComponent { state = { hoveredRowKey: -1, @@ -115,7 +74,7 @@ export class OperationTableDetails extends React.PureComponent { />
{typeof value === 'number' && row.dataPoints.service_operation_latencies.length > 0 - ? msToTime(value) + ? timeConversion(value * 1000) : ''}
From aebbb98b2a3f17f4f3456a251226f76683f2e4c4 Mon Sep 17 00:00:00 2001 From: nofar9792 Date: Sun, 27 Feb 2022 10:57:37 +0200 Subject: [PATCH 3/3] Lower case Signed-off-by: nofar9792 --- .../__snapshots__/index.test.js.snap | 2 +- packages/jaeger-ui/src/utils/date.test.js | 8 ++++---- packages/jaeger-ui/src/utils/date.tsx | 8 ++++---- 3 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/__snapshots__/index.test.js.snap b/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/__snapshots__/index.test.js.snap index d10bfe6862..c21f82594f 100644 --- a/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/__snapshots__/index.test.js.snap +++ b/packages/jaeger-ui/src/components/Monitor/ServicesView/operationDetailsTable/__snapshots__/index.test.js.snap @@ -799,7 +799,7 @@ exports[` render latency in seconds in the table 1`] = `
- 8Sec + 8s
diff --git a/packages/jaeger-ui/src/utils/date.test.js b/packages/jaeger-ui/src/utils/date.test.js index 778f1b5dfb..6caca33b46 100644 --- a/packages/jaeger-ui/src/utils/date.test.js +++ b/packages/jaeger-ui/src/utils/date.test.js @@ -79,18 +79,18 @@ describe('timeConversion', () => { }); it('displays time in seconds', () => { const input = 5000000; - expect(timeConversion(input)).toBe('5Sec'); + expect(timeConversion(input)).toBe('5s'); }); it('displays time in mintues', () => { const input = 120000000; - expect(timeConversion(input)).toBe('2Min'); + expect(timeConversion(input)).toBe('2m'); }); it('displays time in hours', () => { const input = 7200000000; - expect(timeConversion(input)).toBe('2Hrs'); + expect(timeConversion(input)).toBe('2h'); }); it('displays time in days', () => { const input = 172800000000; - expect(timeConversion(input)).toBe('2Days'); + expect(timeConversion(input)).toBe('2d'); }); }); diff --git a/packages/jaeger-ui/src/utils/date.tsx b/packages/jaeger-ui/src/utils/date.tsx index 16f6626652..97ffcc4f9e 100644 --- a/packages/jaeger-ui/src/utils/date.tsx +++ b/packages/jaeger-ui/src/utils/date.tsx @@ -157,13 +157,13 @@ export function timeConversion(microseconds: number) { } else if (milliseconds < 1000) { timeText = `${milliseconds}ms`; } else if (seconds < 60) { - timeText = `${seconds}Sec`; + timeText = `${seconds}s`; } else if (minutes < 60) { - timeText = `${minutes}Min`; + timeText = `${minutes}m`; } else if (hours < 24) { - timeText = `${hours}Hrs`; + timeText = `${hours}h`; } else { - timeText = `${days}Days`; + timeText = `${days}d`; } return timeText; }