Skip to content

Commit

Permalink
[APM] Use asTransactionRate consistently everywhere (#84213)
Browse files Browse the repository at this point in the history
  • Loading branch information
sorenlouv authored Nov 24, 2020
1 parent d47460d commit 31a5b15
Show file tree
Hide file tree
Showing 11 changed files with 29 additions and 122 deletions.
11 changes: 0 additions & 11 deletions x-pack/plugins/apm/common/utils/formatters/formatters.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
* you may not use this file except in compliance with the Elastic License.
*/
import numeral from '@elastic/numeral';
import { i18n } from '@kbn/i18n';
import { Maybe } from '../../../typings/common';
import { NOT_AVAILABLE_LABEL } from '../../i18n';
import { isFiniteNumber } from '../is_finite_number';
Expand All @@ -17,16 +16,6 @@ export function asInteger(value: number) {
return numeral(value).format('0,0');
}

export function tpmUnit(type?: string) {
return type === 'request'
? i18n.translate('xpack.apm.formatters.requestsPerMinLabel', {
defaultMessage: 'rpm',
})
: i18n.translate('xpack.apm.formatters.transactionsPerMinLabel', {
defaultMessage: 'tpm',
});
}

export function asPercent(
numerator: Maybe<number>,
denominator: number | undefined,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import styled from 'styled-components';
import {
asDuration,
asPercent,
tpmUnit,
asTransactionRate,
} from '../../../../../common/utils/formatters';
import { ServiceNodeStats } from '../../../../../common/service_map';

Expand Down Expand Up @@ -55,11 +55,7 @@ export function ServiceStatsList({
defaultMessage: 'Req. per minute (avg.)',
}
),
description: isNumber(transactionStats.avgRequestsPerMinute)
? `${transactionStats.avgRequestsPerMinute.toFixed(2)} ${tpmUnit(
'request'
)}`
: null,
description: asTransactionRate(transactionStats.avgRequestsPerMinute),
},
{
title: i18n.translate('xpack.apm.serviceMap.errorRatePopoverStat', {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,10 @@ import { EuiIcon, EuiToolTip } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React from 'react';
import styled from 'styled-components';
import { asMillisecondDuration } from '../../../../common/utils/formatters';
import {
asMillisecondDuration,
asTransactionRate,
} from '../../../../common/utils/formatters';
import { fontSizes, truncate } from '../../../style/variables';
import { EmptyMessage } from '../../shared/EmptyMessage';
import { ImpactBar } from '../../shared/ImpactBar';
Expand Down Expand Up @@ -78,13 +81,7 @@ const traceListColumns: Array<ITableColumn<TraceGroup>> = [
}),
sortable: true,
dataType: 'number',
render: (value: number) =>
`${value.toLocaleString()} ${i18n.translate(
'xpack.apm.tracesTable.tracesPerMinuteUnitLabel',
{
defaultMessage: 'tpm',
}
)}`,
render: (value: number) => asTransactionRate(value),
},
{
field: 'impact',
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ import { EuiIconTip, EuiTitle } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import d3 from 'd3';
import { isEmpty } from 'lodash';
import React, { useCallback } from 'react';
import React from 'react';
import { ValuesType } from 'utility-types';
import { APIReturnType } from '../../../../services/rest/createCallApmApi';
import { useTheme } from '../../../../../../observability/public';
Expand Down Expand Up @@ -70,46 +70,29 @@ export function getFormattedBuckets(
);
}

const getFormatYShort = (transactionType: string | undefined) => (
t: number
) => {
const formatYShort = (t: number) => {
return i18n.translate(
'xpack.apm.transactionDetails.transactionsDurationDistributionChart.unitShortLabel',
{
defaultMessage: '{transCount} trans.',
values: { transCount: t },
}
);
};

const formatYLong = (t: number) => {
return i18n.translate(
'xpack.apm.transactionDetails.transactionsDurationDistributionChart.transactionTypeUnitLongLabel',
{
defaultMessage:
'{transCount} {transType, select, request {req.} other {trans.}}',
'{transCount, plural, =0 {transactions} one {transaction} other {transactions}}',
values: {
transCount: t,
transType: transactionType,
},
}
);
};

const getFormatYLong = (transactionType: string | undefined) => (t: number) => {
return transactionType === 'request'
? i18n.translate(
'xpack.apm.transactionDetails.transactionsDurationDistributionChart.requestTypeUnitLongLabel',
{
defaultMessage:
'{transCount, plural, =0 {request} one {request} other {requests}}',
values: {
transCount: t,
},
}
)
: i18n.translate(
'xpack.apm.transactionDetails.transactionsDurationDistributionChart.transactionTypeUnitLongLabel',
{
defaultMessage:
'{transCount, plural, =0 {transaction} one {transaction} other {transactions}}',
values: {
transCount: t,
},
}
);
};

interface Props {
distribution?: TransactionDistributionAPIResponse;
urlParams: IUrlParams;
Expand All @@ -129,16 +112,6 @@ export function TransactionDistribution({
}: Props) {
const theme = useTheme();

/* eslint-disable-next-line react-hooks/exhaustive-deps */
const formatYShort = useCallback(getFormatYShort(transactionType), [
transactionType,
]);

/* eslint-disable-next-line react-hooks/exhaustive-deps */
const formatYLong = useCallback(getFormatYLong(transactionType), [
transactionType,
]);

// no data in response
if (
(!distribution || distribution.noHits) &&
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,8 @@ import { APIReturnType } from '../../../../services/rest/createCallApmApi';
import { ServiceHealthStatus } from '../../../../../common/service_health_status';
import {
asPercent,
asDecimal,
asMillisecondDuration,
asTransactionRate,
} from '../../../../../common/utils/formatters';
import { NOT_AVAILABLE_LABEL } from '../../../../../common/i18n';
import { fontSizes, px, truncate, unit } from '../../../../style/variables';
Expand All @@ -35,16 +35,6 @@ interface Props {
}
type ServiceListItem = ValuesType<Items>;

function formatNumber(value: number) {
if (value === 0) {
return '0';
} else if (value <= 0.1) {
return '< 0.1';
} else {
return asDecimal(value);
}
}

function formatString(value?: string | null) {
return value || NOT_AVAILABLE_LABEL;
}
Expand Down Expand Up @@ -154,14 +144,7 @@ export const SERVICE_COLUMNS: Array<ITableColumn<ServiceListItem>> = [
<ServiceListMetric
series={transactionsPerMinute?.timeseries}
color="euiColorVis0"
valueLabel={`${formatNumber(
transactionsPerMinute?.value || 0
)} ${i18n.translate(
'xpack.apm.servicesTable.transactionsPerMinuteUnitLabel',
{
defaultMessage: 'tpm',
}
)}`}
valueLabel={asTransactionRate(transactionsPerMinute?.value)}
/>
),
align: 'left',
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@ import React, { useMemo } from 'react';
import styled from 'styled-components';
import { APIReturnType } from '../../../../services/rest/createCallApmApi';
import {
asDecimal,
asMillisecondDuration,
asTransactionRate,
} from '../../../../../common/utils/formatters';
import { fontFamilyCode, truncate } from '../../../../style/variables';
import { ImpactBar } from '../../../shared/ImpactBar';
Expand Down Expand Up @@ -103,13 +103,7 @@ export function TransactionList({ items, isLoading }: Props) {
),
sortable: true,
dataType: 'number',
render: (value: number) =>
`${asDecimal(value)} ${i18n.translate(
'xpack.apm.transactionsTable.transactionsPerMinuteUnitLabel',
{
defaultMessage: 'tpm',
}
)}`,
render: (value: number) => asTransactionRate(value),
},
{
field: 'impact',
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,20 +14,17 @@ import {
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React from 'react';
import { NOT_AVAILABLE_LABEL } from '../../../../../common/i18n';
import {
TRANSACTION_PAGE_LOAD,
TRANSACTION_REQUEST,
TRANSACTION_ROUTE_CHANGE,
} from '../../../../../common/transaction_types';
import { asDecimal, tpmUnit } from '../../../../../common/utils/formatters';
import { Coordinate } from '../../../../../typings/timeseries';
import { asTransactionRate } from '../../../../../common/utils/formatters';
import { ChartsSyncContextProvider } from '../../../../context/charts_sync_context';
import { LicenseContext } from '../../../../context/LicenseContext';
import { IUrlParams } from '../../../../context/UrlParamsContext/types';
import { FETCH_STATUS } from '../../../../hooks/useFetcher';
import { ITransactionChartData } from '../../../../selectors/chart_selectors';
import { isValidCoordinateValue } from '../../../../utils/isValidCoordinateValue';
import { TransactionBreakdownChart } from '../transaction_breakdown_chart';
import { TimeseriesChart } from '../timeseries_chart';
import { TransactionErrorRateChart } from '../transaction_error_rate_chart/';
Expand All @@ -46,14 +43,6 @@ export function TransactionCharts({
urlParams,
fetchStatus,
}: TransactionChartProps) {
const getTPMFormatter = (t: number) => {
return `${asDecimal(t)} ${tpmUnit(urlParams.transactionType)}`;
};

const getTPMTooltipFormatter = (y: Coordinate['y']) => {
return isValidCoordinateValue(y) ? getTPMFormatter(y) : NOT_AVAILABLE_LABEL;
};

const { transactionType } = urlParams;

const { responseTimeSeries, tpmSeries } = charts;
Expand Down Expand Up @@ -104,7 +93,7 @@ export function TransactionCharts({
fetchStatus={fetchStatus}
id="requestPerMinutes"
timeseries={tpmSeries || []}
yLabelFormat={getTPMTooltipFormatter}
yLabelFormat={asTransactionRate}
/>
</EuiPanel>
</EuiFlexItem>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -144,7 +144,7 @@ describe('chart selectors', () => {
{
color: errorColor,
data: [{ x: 0, y: 0 }],
legendValue: '0.0 tpm',
legendValue: '0 tpm',
title: 'HTTP 5xx',
type: 'linemark',
},
Expand Down
4 changes: 2 additions & 2 deletions x-pack/plugins/apm/public/selectors/chart_selectors.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import {
import { IUrlParams } from '../context/UrlParamsContext/types';
import { getEmptySeries } from '../components/shared/charts/helper/get_empty_series';
import { httpStatusCodeToColor } from '../utils/httpStatusCodeToColor';
import { asDecimal, asDuration, tpmUnit } from '../../common/utils/formatters';
import { asDuration, asTransactionRate } from '../../common/utils/formatters';

export interface ITpmBucket {
title: string;
Expand Down Expand Up @@ -171,7 +171,7 @@ export function getTpmSeries(
return {
title: bucket.key,
data: bucket.dataPoints,
legendValue: `${asDecimal(bucket.avg)} ${tpmUnit(transactionType || '')}`,
legendValue: asTransactionRate(bucket.avg),
type: 'linemark',
color: getColor(bucket.key),
};
Expand Down
7 changes: 0 additions & 7 deletions x-pack/plugins/translations/translations/ja-JP.json
Original file line number Diff line number Diff line change
Expand Up @@ -4874,9 +4874,7 @@
"xpack.apm.formatters.microsTimeUnitLabel": "マイクロ秒",
"xpack.apm.formatters.millisTimeUnitLabel": "ミリ秒",
"xpack.apm.formatters.minutesTimeUnitLabel": "最低",
"xpack.apm.formatters.requestsPerMinLabel": "1分あたりリクエスト数",
"xpack.apm.formatters.secondsTimeUnitLabel": "秒",
"xpack.apm.formatters.transactionsPerMinLabel": "1分あたりトランザクション数",
"xpack.apm.header.badge.readOnly.text": "読み込み専用",
"xpack.apm.header.badge.readOnly.tooltip": "を保存できませんでした",
"xpack.apm.helpMenu.upgradeAssistantLink": "アップグレードアシスタント",
Expand Down Expand Up @@ -5052,7 +5050,6 @@
"xpack.apm.servicesTable.notFoundLabel": "サービスが見つかりません",
"xpack.apm.servicesTable.transactionErrorRate": "エラー率%",
"xpack.apm.servicesTable.transactionsPerMinuteColumnLabel": "1 分あたりのトランザクション",
"xpack.apm.servicesTable.transactionsPerMinuteUnitLabel": "1分あたりトランザクション数",
"xpack.apm.servicesTable.UpgradeAssistantLink": "Kibana アップグレードアシスタントで詳細をご覧ください",
"xpack.apm.settings.agentConfig": "エージェントの編集",
"xpack.apm.settings.anomaly_detection.legacy_jobs.body": "以前の統合のレガシー機械学習ジョブが見つかりました。これは、APMアプリでは使用されていません。",
Expand Down Expand Up @@ -5155,7 +5152,6 @@
"xpack.apm.tracesTable.notFoundLabel": "このクエリのトレースが見つかりません",
"xpack.apm.tracesTable.originatingServiceColumnLabel": "発生元サービス",
"xpack.apm.tracesTable.tracesPerMinuteColumnLabel": "1 分あたりのトレース",
"xpack.apm.tracesTable.tracesPerMinuteUnitLabel": "1分あたりトランザクション数",
"xpack.apm.transactionActionMenu.actionsButtonLabel": "アクション",
"xpack.apm.transactionActionMenu.container.subtitle": "このコンテナーのログとインデックスを表示し、さらに詳細を確認できます。",
"xpack.apm.transactionActionMenu.container.title": "コンテナーの詳細",
Expand Down Expand Up @@ -5206,9 +5202,7 @@
"xpack.apm.transactionDetails.traceNotFound": "選択されたトレースが見つかりません",
"xpack.apm.transactionDetails.traceSampleTitle": "トレースのサンプル",
"xpack.apm.transactionDetails.transactionLabel": "トランザクション",
"xpack.apm.transactionDetails.transactionsDurationDistributionChart.requestTypeUnitLongLabel": "{transCount, plural, =0 {# request} 1 {# 件のリクエスト} other {# 件のリクエスト}}",
"xpack.apm.transactionDetails.transactionsDurationDistributionChart.transactionTypeUnitLongLabel": "{transCount, plural, =0 {# transaction} 1 {# 件のトランザクション} other {# 件のトランザクション}}",
"xpack.apm.transactionDetails.transactionsDurationDistributionChart.unitShortLabel": "{transCount} {transType, select, request {件のリクエスト} other {件のトランザクション}}",
"xpack.apm.transactionDetails.transactionsDurationDistributionChartTitle": "トラザクション時間の分布",
"xpack.apm.transactionDetails.transactionsDurationDistributionChartTooltip.samplingDescription": "各バケットはサンプルトランザクションを示します。利用可能なサンプルがない場合、恐らくエージェントの構成で設定されたサンプリング制限が原因です。",
"xpack.apm.transactionDetails.transactionsDurationDistributionChartTooltip.samplingLabel": "サンプリング",
Expand Down Expand Up @@ -5241,7 +5235,6 @@
"xpack.apm.transactionsTable.nameColumnLabel": "名前",
"xpack.apm.transactionsTable.notFoundLabel": "トランザクションが見つかりませんでした。",
"xpack.apm.transactionsTable.transactionsPerMinuteColumnLabel": "1 分あたりのトランザクション",
"xpack.apm.transactionsTable.transactionsPerMinuteUnitLabel": "1分あたりトランザクション数",
"xpack.apm.tutorial.apmServer.title": "APM Server",
"xpack.apm.tutorial.elasticCloud.textPre": "APM Server を有効にするには、[the Elastic Cloud console](https://cloud.elastic.co/deployments?q={cloudId}) に移動し、展開設定で APM を有効にします。有効になったら、このページを更新してください。",
"xpack.apm.tutorial.elasticCloudInstructions.title": "APM エージェント",
Expand Down
7 changes: 0 additions & 7 deletions x-pack/plugins/translations/translations/zh-CN.json
Original file line number Diff line number Diff line change
Expand Up @@ -4876,9 +4876,7 @@
"xpack.apm.formatters.microsTimeUnitLabel": "μs",
"xpack.apm.formatters.millisTimeUnitLabel": "ms",
"xpack.apm.formatters.minutesTimeUnitLabel": "分钟",
"xpack.apm.formatters.requestsPerMinLabel": "rpm",
"xpack.apm.formatters.secondsTimeUnitLabel": "s",
"xpack.apm.formatters.transactionsPerMinLabel": "tpm",
"xpack.apm.header.badge.readOnly.text": "只读",
"xpack.apm.header.badge.readOnly.tooltip": "无法保存",
"xpack.apm.helpMenu.upgradeAssistantLink": "升级助手",
Expand Down Expand Up @@ -5056,7 +5054,6 @@
"xpack.apm.servicesTable.notFoundLabel": "未找到任何服务",
"xpack.apm.servicesTable.transactionErrorRate": "错误率 %",
"xpack.apm.servicesTable.transactionsPerMinuteColumnLabel": "每分钟事务数",
"xpack.apm.servicesTable.transactionsPerMinuteUnitLabel": "tpm",
"xpack.apm.servicesTable.UpgradeAssistantLink": "通过访问 Kibana 升级助手来了解详情",
"xpack.apm.settings.agentConfig": "代理配置",
"xpack.apm.settings.anomaly_detection.legacy_jobs.body": "我们在以前的集成中发现 APM 应用中不再使用的旧版 Machine Learning 作业",
Expand Down Expand Up @@ -5159,7 +5156,6 @@
"xpack.apm.tracesTable.notFoundLabel": "未找到与此查询的任何追溯信息",
"xpack.apm.tracesTable.originatingServiceColumnLabel": "发起服务",
"xpack.apm.tracesTable.tracesPerMinuteColumnLabel": "每分钟追溯次数",
"xpack.apm.tracesTable.tracesPerMinuteUnitLabel": "tpm",
"xpack.apm.transactionActionMenu.actionsButtonLabel": "操作",
"xpack.apm.transactionActionMenu.container.subtitle": "查看此容器的日志和指标以获取进一步详情。",
"xpack.apm.transactionActionMenu.container.title": "容器详情",
Expand Down Expand Up @@ -5210,9 +5206,7 @@
"xpack.apm.transactionDetails.traceNotFound": "找不到所选跟踪",
"xpack.apm.transactionDetails.traceSampleTitle": "跟踪样例",
"xpack.apm.transactionDetails.transactionLabel": "事务",
"xpack.apm.transactionDetails.transactionsDurationDistributionChart.requestTypeUnitLongLabel": "{transCount, plural, =0 {# 个请求} one {# 个请求} other {# 个请求}}",
"xpack.apm.transactionDetails.transactionsDurationDistributionChart.transactionTypeUnitLongLabel": "{transCount, plural, =0 {# 个事务} one {# 个事务} other {# 个事务}}",
"xpack.apm.transactionDetails.transactionsDurationDistributionChart.unitShortLabel": "{transCount} 个{transType, select, request {请求} other {事务}}",
"xpack.apm.transactionDetails.transactionsDurationDistributionChartTitle": "事务持续时间分布",
"xpack.apm.transactionDetails.transactionsDurationDistributionChartTooltip.samplingDescription": "每个存储桶将显示一个样例事务。如果没有可用的样例,很可能是在代理配置设置了采样限制。",
"xpack.apm.transactionDetails.transactionsDurationDistributionChartTooltip.samplingLabel": "采样",
Expand Down Expand Up @@ -5245,7 +5239,6 @@
"xpack.apm.transactionsTable.nameColumnLabel": "名称",
"xpack.apm.transactionsTable.notFoundLabel": "未找到任何事务。",
"xpack.apm.transactionsTable.transactionsPerMinuteColumnLabel": "每分钟事务数",
"xpack.apm.transactionsTable.transactionsPerMinuteUnitLabel": "tpm",
"xpack.apm.tutorial.apmServer.title": "APM Server",
"xpack.apm.tutorial.elasticCloud.textPre": "要启用 APM Server,请前往 [Elastic Cloud 控制台](https://cloud.elastic.co/deployments?q={cloudId}) 并在部署设置中启用 APM。启用后,请刷新此页面。",
"xpack.apm.tutorial.elasticCloudInstructions.title": "APM 代理",
Expand Down

0 comments on commit 31a5b15

Please sign in to comment.