diff --git a/x-pack/legacy/plugins/apm/public/components/app/TraceOverview/TraceList.tsx b/x-pack/legacy/plugins/apm/public/components/app/TraceOverview/TraceList.tsx index 1447b2380cd1f..ca10b06c11cbf 100644 --- a/x-pack/legacy/plugins/apm/public/components/app/TraceOverview/TraceList.tsx +++ b/x-pack/legacy/plugins/apm/public/components/app/TraceOverview/TraceList.tsx @@ -4,7 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import { EuiToolTip } from '@elastic/eui'; +import { EuiIcon, EuiToolTip } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import React from 'react'; import styled from 'styled-components'; @@ -85,11 +85,31 @@ const traceListColumns: Array> = [ }, { field: 'impact', - name: i18n.translate('xpack.apm.tracesTable.impactColumnLabel', { - defaultMessage: 'Impact' - }), + name: ( + + <> + {i18n.translate('xpack.apm.tracesTable.impactColumnLabel', { + defaultMessage: 'Impact' + })}{' '} + + + + ), width: '20%', - align: 'right', + align: 'left', sortable: true, render: (value: number) => } diff --git a/x-pack/legacy/plugins/apm/public/components/app/TransactionOverview/List/index.tsx b/x-pack/legacy/plugins/apm/public/components/app/TransactionOverview/List/index.tsx index 94cf375035260..062d103bfc448 100644 --- a/x-pack/legacy/plugins/apm/public/components/app/TransactionOverview/List/index.tsx +++ b/x-pack/legacy/plugins/apm/public/components/app/TransactionOverview/List/index.tsx @@ -4,7 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import { EuiToolTip } from '@elastic/eui'; +import { EuiIcon, EuiToolTip } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import React, { useMemo } from 'react'; import styled from 'styled-components'; @@ -101,9 +101,29 @@ export function TransactionList({ items, isLoading }: Props) { }, { field: 'impact', - name: i18n.translate('xpack.apm.transactionsTable.impactColumnLabel', { - defaultMessage: 'Impact' - }), + name: ( + + <> + {i18n.translate('xpack.apm.transactionsTable.impactColumnLabel', { + defaultMessage: 'Impact' + })}{' '} + + + + ), sortable: true, dataType: 'number', render: (value: number) => diff --git a/x-pack/legacy/plugins/apm/public/components/shared/ManagedTable/index.tsx b/x-pack/legacy/plugins/apm/public/components/shared/ManagedTable/index.tsx index 32c356dda63a1..0f5fcceea3d20 100644 --- a/x-pack/legacy/plugins/apm/public/components/shared/ManagedTable/index.tsx +++ b/x-pack/legacy/plugins/apm/public/components/shared/ManagedTable/index.tsx @@ -6,7 +6,7 @@ import { EuiBasicTable } from '@elastic/eui'; import { sortByOrder } from 'lodash'; -import React, { useMemo, useCallback } from 'react'; +import React, { useMemo, useCallback, ReactNode } from 'react'; import { idx } from '@kbn/elastic-idx'; import { StringMap } from '../../../../typings/common'; import { useUrlParams } from '../../../hooks/useUrlParams'; @@ -15,7 +15,7 @@ import { fromQuery, toQuery } from '../Links/url_helpers'; // TODO: this should really be imported from EUI export interface ITableColumn { - name: string; + name: ReactNode; actions?: StringMap[]; field?: string; dataType?: string;