Add support for service from metrics to trace page

This commit is contained in:
“himanshu” 2021-01-23 09:25:35 +05:30
parent 08ba714637
commit 1ebfa0679e
3 changed files with 25 additions and 9 deletions

View File

@ -31,24 +31,29 @@ interface ServicesMetricsProps extends RouteComponentProps<any> {
}
const _ServiceMetrics = (props: ServicesMetricsProps) => {
const params = useParams<{ servicename?: string }>();
const {servicename} = useParams<{ servicename?: string }>();
useEffect(() => {
props.getServicesMetrics(params.servicename, props.globalTime);
props.getTopEndpoints(params.servicename, props.globalTime);
}, [props.globalTime, params.servicename]);
props.getServicesMetrics(servicename, props.globalTime);
props.getTopEndpoints(servicename, props.globalTime);
}, [props.globalTime, servicename]);
const onTracePopupClick = (timestamp: number) => {
const tMinus5Min = timestamp / 1000000 - 5 * 60 * 1000;
const tMinus15Min = timestamp / 1000000 - 15 * 60 * 1000;
const currentTime = timestamp / 1000000;
props.updateTimeInterval("custom", [
tMinus5Min,
tMinus15Min,
currentTime,
]); // 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())
if(servicename){
urlParams.set(METRICS_PAGE_QUERY_PARAM.service,servicename)
}
props.history.push(`/traces?${METRICS_PAGE_QUERY_PARAM.startTime}=${tMinus5Min}&${METRICS_PAGE_QUERY_PARAM.endTime}=${currentTime}`);
props.history.push(`/traces?${urlParams.toString()}`);
};
return (
<Tabs defaultActiveKey="1">

View File

@ -16,6 +16,8 @@ import { FilterStateDisplay } from "./FilterStateDisplay";
import FormItem from "antd/lib/form/FormItem";
import metricsAPI from "../../api/metricsAPI";
import { useLocation } from "react-router-dom";
import { METRICS_PAGE_QUERY_PARAM } from "../../constants/query";
const { Option } = Select;
@ -39,12 +41,20 @@ interface TagKeyOptionItem {
const _TraceFilter = (props: TraceFilterProps) => {
const [serviceList, setServiceList] = useState<string[]>([]);
const [service, setSelectedService] = useState<string|null>(null);
const [operationList, setOperationsList] = useState<string[]>([]);
const [tagKeyOptions, setTagKeyOptions] = useState<TagKeyOptionItem[]>([]);
const location = useLocation()
const urlParams = new URLSearchParams(location.search.split("?")[1]);
useEffect(() => {
metricsAPI.get<string[]>("services/list").then((response) => {
setServiceList(response.data);
}).then(()=>{
const serviceName =urlParams.get(METRICS_PAGE_QUERY_PARAM.service);
if(serviceName){
handleChangeService(serviceName)
}
});
}, []);

View File

@ -1,6 +1,7 @@
export enum METRICS_PAGE_QUERY_PARAM {
interval = "interval",
startTime = "startTime",
endTime = "endTime"
endTime = "endTime",
service = "service"
}