Fix filtered spans (#403)

* fix(BUG): redirection is fixed

* chore(bug): redirection issue is fixed

* chore(UI): bug is now fixed
This commit is contained in:
pal-sig 2021-11-22 15:45:20 +05:30 committed by GitHub
parent 319ca6af07
commit 4427f60708
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 10 additions and 8 deletions

View File

@ -3,7 +3,7 @@ const ROUTES = {
SERVICE_METRICS: '/application/:servicename', SERVICE_METRICS: '/application/:servicename',
SERVICE_MAP: '/service-map', SERVICE_MAP: '/service-map',
TRACE: '/trace', TRACE: '/trace',
TRACE_GRAPH: '/traces/:id', TRACE_GRAPH: '/trace/:id',
SETTINGS: '/settings', SETTINGS: '/settings',
INSTRUMENTATION: '/add-instrumentation', INSTRUMENTATION: '/add-instrumentation',
USAGE_EXPLORER: '/usage-explorer', USAGE_EXPLORER: '/usage-explorer',

View File

@ -116,7 +116,7 @@ const TraceDetails = (): JSX.Element => {
): React.HTMLAttributes<HTMLElement> => ({ ): React.HTMLAttributes<HTMLElement> => ({
onClick: (): void => { onClick: (): void => {
history.push({ history.push({
pathname: ROUTES.TRACES + '/' + record.traceid, pathname: ROUTES.TRACE + '/' + record.traceid,
state: { state: {
spanId: record.spanid, spanId: record.spanid,
}, },

View File

@ -6,7 +6,7 @@ import { flamegraph } from 'd3-flame-graph';
import * as d3Tip from 'd3-tip'; import * as d3Tip from 'd3-tip';
import { isEmpty, sortBy } from 'lodash-es'; import { isEmpty, sortBy } from 'lodash-es';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { connect } from 'react-redux'; import { connect, useDispatch } from 'react-redux';
import { useLocation, useParams } from 'react-router-dom'; import { useLocation, useParams } from 'react-router-dom';
import { import {
fetchTraceItem, fetchTraceItem,
@ -33,7 +33,8 @@ const TraceGanttChartContainer = styled(Card)`
const _TraceGraph = (props: TraceGraphProps) => { const _TraceGraph = (props: TraceGraphProps) => {
const location = useLocation(); const location = useLocation();
const spanId = location?.state?.spanId; const spanId = location?.state?.spanId;
const params = useParams<{ id?: string }>(); const { id } = useParams<{ id?: string }>();
const [clickedSpanTags, setClickedSpanTags] = useState<pushDStree>([]); const [clickedSpanTags, setClickedSpanTags] = useState<pushDStree>([]);
const [selectedSpan, setSelectedSpan] = useState({}); const [selectedSpan, setSelectedSpan] = useState({});
const [clickedSpan, setClickedSpan] = useState(null); const [clickedSpan, setClickedSpan] = useState(null);
@ -62,11 +63,12 @@ const _TraceGraph = (props: TraceGraphProps) => {
}; };
const tree = spanToTreeUtil(props.traceItem[0].events); const tree = spanToTreeUtil(props.traceItem[0].events);
const dispatch = useDispatch();
useEffect(() => { useEffect(() => {
//sets span width based on value - which is mapped to duration //sets span width based on value - which is mapped to duration
props.fetchTraceItem(params.id); fetchTraceItem(id || '')(dispatch);
}, []); }, [dispatch, id]);
useEffect(() => { useEffect(() => {
if (props.traceItem) { if (props.traceItem) {
@ -176,7 +178,7 @@ const _TraceGraph = (props: TraceGraphProps) => {
}} }}
> >
<div style={{ textAlign: 'center' }}> <div style={{ textAlign: 'center' }}>
Trace Graph component ID is {params.id}{' '} Trace Graph component ID is {id}{' '}
</div> </div>
<div id="chart" style={{ fontSize: 12, marginTop: 20 }}></div> <div id="chart" style={{ fontSize: 12, marginTop: 20 }}></div>
</div> </div>

View File

@ -142,7 +142,7 @@ export const fetchTraces = (globalTime: GlobalTime, filter_params: string) => {
export const fetchTraceItem = (traceID: string) => { export const fetchTraceItem = (traceID: string) => {
return async (dispatch: Dispatch): Promise<void> => { return async (dispatch: Dispatch): Promise<void> => {
const request_string = ROUTES.TRACES + '/' + traceID; const request_string = '/traces' + '/' + traceID;
const response = await api.get<spansWSameTraceIDResponse>(request_string); const response = await api.get<spansWSameTraceIDResponse>(request_string);
dispatch<FetchTraceItemAction>({ dispatch<FetchTraceItemAction>({