diff --git a/frontend/src/components/metrics/ServiceMetrics.tsx b/frontend/src/components/metrics/ServiceMetrics.tsx index c35e81213d..94eb0b7ad2 100644 --- a/frontend/src/components/metrics/ServiceMetrics.tsx +++ b/frontend/src/components/metrics/ServiceMetrics.tsx @@ -38,14 +38,14 @@ const _ServiceMetrics = (props: ServicesMetricsProps) => { }, [props.globalTime, servicename]); const onTracePopupClick = (timestamp: number) => { - const tMinus15Min = timestamp / 1000000 - 15 * 60 * 1000; const currentTime = timestamp / 1000000; + const tPlusOne = timestamp / 1000000 + 1 * 60 * 1000; - props.updateTimeInterval("custom", [tMinus15Min, currentTime]); // updateTimeInterval takes second range in ms -- give -5 min to selected time, + props.updateTimeInterval("custom", [currentTime, tPlusOne]); // updateTimeInterval takes second range in ms -- give -5 min to selected time, const urlParams = new URLSearchParams(); - urlParams.set(METRICS_PAGE_QUERY_PARAM.startTime, tMinus15Min.toString()); - urlParams.set(METRICS_PAGE_QUERY_PARAM.endTime, currentTime.toString()); + urlParams.set(METRICS_PAGE_QUERY_PARAM.startTime, currentTime.toString()); + urlParams.set(METRICS_PAGE_QUERY_PARAM.endTime, tPlusOne.toString()); if (servicename) { urlParams.set(METRICS_PAGE_QUERY_PARAM.service, servicename); } diff --git a/frontend/src/components/traces/FilterStateDisplay.tsx b/frontend/src/components/traces/FilterStateDisplay.tsx index 4de5b30348..0dcbfb07b9 100644 --- a/frontend/src/components/traces/FilterStateDisplay.tsx +++ b/frontend/src/components/traces/FilterStateDisplay.tsx @@ -1,10 +1,17 @@ import React from "react"; -import { Card, Tag } from "antd"; +import { Card, Tag as AntTag } from "antd"; import { connect } from "react-redux"; - +import styled from "styled-components"; import { StoreState } from "../../reducers"; import { TagItem, TraceFilters, updateTraceFilters } from "../../actions"; +const Tag = styled(AntTag)` + .anticon { + position: relative; + top: -3px; + } +`; + interface FilterStateDisplayProps { traceFilters: TraceFilters; updateTraceFilters: Function; diff --git a/frontend/src/components/traces/TraceCustomVisualizations.tsx b/frontend/src/components/traces/TraceCustomVisualizations.tsx index ca5ee7c7ce..21e85fd69f 100644 --- a/frontend/src/components/traces/TraceCustomVisualizations.tsx +++ b/frontend/src/components/traces/TraceCustomVisualizations.tsx @@ -151,7 +151,6 @@ const _TraceCustomVisualizations = (props: TraceCustomVisualizationsProps) => { {/* */}
Custom Visualizations
-
{ const location = useLocation(); const urlParams = new URLSearchParams(location.search.split("?")[1]); - useEffect(()=>{ + useEffect(() => { handleApplyFilterForm({ service: "", tags: [], operation: "", latency: { min: "", max: "" }, - }) - },[]) + }); + }, []); useEffect(() => { metricsAPI @@ -287,21 +287,21 @@ const _TraceFilter = (props: TraceFilterProps) => { operation: values.operation, latency: { max: "", - min: "" + min: "", }, }); }; - useEffect(()=>{ - return ()=>{ + useEffect(() => { + return () => { props.updateTraceFilters({ service: "", operation: "", tags: [], latency: { min: "", max: "" }, }); - } - },[]) + }; + }, []); return (
diff --git a/frontend/src/components/traces/TraceList.tsx b/frontend/src/components/traces/TraceList.tsx index 2742daec3f..a784d0525a 100644 --- a/frontend/src/components/traces/TraceList.tsx +++ b/frontend/src/components/traces/TraceList.tsx @@ -6,7 +6,12 @@ import { Space, Table } from "antd"; import { traceResponseNew, fetchTraces, pushDStree } from "../../actions"; import { StoreState } from "../../reducers"; import { isOnboardingSkipped } from "../../utils/app"; +import moment from "moment"; +import styled from "styled-components"; +const TraceHeader = styled.div` + margin: 16px 0; +`; interface TraceListProps { traces: traceResponseNew; fetchTraces: Function; @@ -41,12 +46,12 @@ const _TraceList = (props: TraceListProps) => { const columns: any = [ { - title: "Start Time (UTC Time)", + title: "Start Time", dataIndex: "startTime", key: "startTime", sorter: (a: any, b: any) => a.startTime - b.startTime, sortDirections: ["descend", "ascend"], - render: (value: number) => new Date(Math.round(value)).toUTCString(), + render: (value: number) => moment(value).format("YYYY-MM-DD hh:mm:ss"), // new Date() assumes input in milliseconds. Start Time stamp returned by druid api for span list is in ms }, @@ -130,7 +135,7 @@ const _TraceList = (props: TraceListProps) => { return (
-
List of traces with spanID
+ List of traces with spanID
{renderTraces()}
); diff --git a/frontend/webpack.config.js b/frontend/webpack.config.js index 6a7ecc73ae..561b06ff64 100644 --- a/frontend/webpack.config.js +++ b/frontend/webpack.config.js @@ -10,6 +10,8 @@ module.exports = { historyApiFallback: true, publicPath: "/", transportMode: "ws", + open: true, + openPage: "application", contentBase: [resolve(__dirname, "./public")], hot: true, liveReload: false,