Explore: Trace view now shows trace start time in selected timezone (#39054)

This commit is contained in:
Connor Lindsey
2021-09-10 07:52:59 -06:00
committed by GitHub
parent ba9d5540b8
commit b89f8fdfcb
2 changed files with 11 additions and 4 deletions

View File

@ -26,12 +26,13 @@ import TraceName from '../common/TraceName';
import { getTraceName } from '../model/trace-viewer';
import { TNil } from '../types';
import { Trace } from '../types/trace';
import { formatDatetime, formatDuration } from '../utils/date';
import { formatDuration } from '../utils/date';
import { getTraceLinks } from '../model/link-patterns';
import ExternalLinks from '../common/ExternalLinks';
import { createStyle } from '../Theme';
import { uTxMuted } from '../uberUtilityStyles';
import { dateTimeFormat, TimeZone } from '@grafana/data';
const getStyles = createStyle((theme: Theme) => {
return {
@ -157,14 +158,16 @@ type TracePageHeaderEmbedProps = {
searchValue: string;
onSearchValueChange: (value: string) => void;
hideSearchButtons?: boolean;
timeZone: TimeZone;
};
export const HEADER_ITEMS = [
{
key: 'timestamp',
label: 'Trace Start',
renderer(trace: Trace, styles: ReturnType<typeof getStyles>) {
const dateStr = formatDatetime(trace.startTime);
renderer(trace: Trace, timeZone: TimeZone, styles: ReturnType<typeof getStyles>) {
// Convert date from micro to milli seconds
const dateStr = dateTimeFormat(trace.startTime / 1000, { timeZone });
const match = dateStr.match(/^(.+)(:\d\d\.\d+)$/);
return match ? (
<span className={styles.TracePageHeaderOverviewItemValue}>
@ -219,6 +222,7 @@ export default function TracePageHeader(props: TracePageHeaderEmbedProps) {
searchValue,
onSearchValueChange,
hideSearchButtons,
timeZone,
} = props;
const styles = getStyles(useTheme());
@ -238,7 +242,7 @@ export default function TracePageHeader(props: TracePageHeaderEmbedProps) {
!slimView &&
HEADER_ITEMS.map((item) => {
const { renderer, ...rest } = item;
return { ...rest, value: renderer(trace, styles) };
return { ...rest, value: renderer(trace, timeZone, styles) };
});
const title = (