GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-07-29 03:12:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: added step interval instead of tplusone

Browse Source
This commit is contained in:
rahulkeswani101 2024-10-03 15:36:17 +05:30
parent c7bd7566c5
commit 6a4643558c
5 changed files with 57 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/container/MetricsApplication/Tabs/DBCall.tsx
View File

@ -14,10 +14,12 @@ import {
resourceAttributesToTagFilterItems,
} from 'hooks/useResourceAttribute/utils';
import useUrlQuery from 'hooks/useUrlQuery';
import getStep from 'lib/getStep';
import history from 'lib/history';
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { useDispatch } from 'react-redux';
import { useLocation, useParams } from 'react-router-dom';
import store from 'store';
import { UpdateTimeInterval } from 'store/actions';
import { TagFilterItem } from 'types/api/queryBuilder/queryBuilderData';
import { EQueryType } from 'types/common/dashboard';
@ -123,6 +125,16 @@ function DBCall(): JSX.Element {
[servicename, tagFilterItems],
);
const stepInterval = useMemo(
() =>
getStep({
end: store.getState().globalTime.maxTime,
inputFormat: 'ns',
start: store.getState().globalTime.minTime,
}),
[],
);
const logEventCalledRef = useRef(false);
useEffect(() => {
@ -158,6 +170,7 @@ function DBCall(): JSX.Element {
selectedTraceTags,
timestamp: selectedTimeStamp,
apmToTraceQuery,
stepInterval,
})}
>
View Traces
@ -192,6 +205,7 @@ function DBCall(): JSX.Element {
selectedTraceTags,
timestamp: selectedTimeStamp,
apmToTraceQuery,
stepInterval,
})}
>
View Traces

15
frontend/src/container/MetricsApplication/Tabs/External.tsx
View File

@ -16,10 +16,12 @@ import {
resourceAttributesToTagFilterItems,
} from 'hooks/useResourceAttribute/utils';
import useUrlQuery from 'hooks/useUrlQuery';
import getStep from 'lib/getStep';
import history from 'lib/history';
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { useDispatch } from 'react-redux';
import { useLocation, useParams } from 'react-router-dom';
import store from 'store';
import { UpdateTimeInterval } from 'store/actions';
import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
import { EQueryType } from 'types/common/dashboard';
@ -141,6 +143,15 @@ function External(): JSX.Element {
],
});
const stepInterval = useMemo(
() =>
getStep({
end: store.getState().globalTime.maxTime,
inputFormat: 'ns',
start: store.getState().globalTime.minTime,
}),
[],
);
const logEventCalledRef = useRef(false);
useEffect(() => {
if (!logEventCalledRef.current) {
@ -222,6 +233,7 @@ function External(): JSX.Element {
selectedTraceTags,
timestamp: selectedTimeStamp,
apmToTraceQuery: errorApmToTraceQuery,
stepInterval,
})}
>
View Traces
@ -257,6 +269,7 @@ function External(): JSX.Element {
selectedTraceTags,
timestamp: selectedTimeStamp,
apmToTraceQuery,
stepInterval,
})}
>
View Traces
@ -295,6 +308,7 @@ function External(): JSX.Element {
selectedTraceTags,
timestamp: selectedTimeStamp,
apmToTraceQuery,
stepInterval,
})}
>
View Traces
@ -330,6 +344,7 @@ function External(): JSX.Element {
selectedTraceTags,
timestamp: selectedTimeStamp,
apmToTraceQuery,
stepInterval,
})}
>
View Traces

21
frontend/src/container/MetricsApplication/Tabs/Overview.tsx
View File

@ -15,6 +15,7 @@ import {
resourceAttributesToTagFilterItems,
} from 'hooks/useResourceAttribute/utils';
import useUrlQuery from 'hooks/useUrlQuery';
import getStep from 'lib/getStep';
import history from 'lib/history';
import { OnClickPluginOpts } from 'lib/uPlotLib/plugins/onClickPlugin';
import { defaultTo } from 'lodash-es';
@ -180,6 +181,16 @@ function Application(): JSX.Element {
id: SERVICE_CHART_ID.errorPercentage,
});
const stepInterval = useMemo(
() =>
getStep({
end: maxTime,
inputFormat: 'ns',
start: minTime,
}),
[maxTime, minTime],
);
const onDragSelect = useCallback(
(start: number, end: number) => {
const startTimestamp = Math.trunc(start);
@ -204,11 +215,12 @@ function Application(): JSX.Element {
isViewLogsClicked?: boolean,
): (() => void) => (): void => {
const currentTime = timestamp;
const tPlusOne = timestamp + 60;
const endTime = timestamp + stepInterval;
console.log(endTime, stepInterval);
const urlParams = new URLSearchParams(search);
urlParams.set(QueryParams.startTime, currentTime.toString());
urlParams.set(QueryParams.endTime, tPlusOne.toString());
urlParams.set(QueryParams.endTime, endTime.toString());
urlParams.delete(QueryParams.relativeTime);
const avialableParams = routeConfig[ROUTES.TRACE];
const queryString = getQueryString(avialableParams, urlParams);
@ -229,7 +241,7 @@ function Application(): JSX.Element {
history.push(newPath);
},
// eslint-disable-next-line react-hooks/exhaustive-deps
[],
[stepInterval],
);
const logErrorQuery = useGetAPMToLogsQueries({
@ -280,6 +292,7 @@ function Application(): JSX.Element {
selectedTraceTags={selectedTraceTags}
topLevelOperationsRoute={topLevelOperationsRoute}
topLevelOperationsIsLoading={topLevelOperationsIsLoading}
stepInterval={stepInterval}
/>
</Col>
@ -293,6 +306,7 @@ function Application(): JSX.Element {
selectedTraceTags,
timestamp: selectedTimeStamp,
apmToTraceQuery,
stepInterval,
})}
>
View Traces
@ -321,6 +335,7 @@ function Application(): JSX.Element {
selectedTraceTags,
timestamp: selectedTimeStamp,
apmToTraceQuery,
stepInterval,
})}
>
View Traces

5
frontend/src/container/MetricsApplication/Tabs/Overview/ServiceOverview.tsx
View File

@ -35,6 +35,7 @@ function ServiceOverview({
selectedTimeStamp,
topLevelOperationsRoute,
topLevelOperationsIsLoading,
stepInterval,
}: ServiceOverviewProps): JSX.Element {
const { servicename: encodedServiceName } = useParams<IServiceName>();
const servicename = decodeURIComponent(encodedServiceName);
@ -88,12 +89,14 @@ function ServiceOverview({
timestamp: selectedTimeStamp,
apmToTraceQuery: apmToLogQuery,
isViewLogsClicked: true,
stepInterval,
})}
onViewTracesClick={onViewTracePopupClick({
servicename,
selectedTraceTags,
timestamp: selectedTimeStamp,
apmToTraceQuery,
stepInterval,
})}
/>
<Card data-testid="service_latency">
@ -120,8 +123,8 @@ function ServiceOverview({
</>
);
}
interface ServiceOverviewProps {
stepInterval: number;
selectedTimeStamp: number;
selectedTraceTags: string;
onDragSelect: (start: number, end: number) => void;

10
frontend/src/container/MetricsApplication/Tabs/util.ts
View File

@ -35,6 +35,7 @@ interface OnViewTracePopupClickProps {
timestamp: number;
apmToTraceQuery: Query;
isViewLogsClicked?: boolean;
stepInterval?: number;
}
export function generateExplorerPath(
@ -54,21 +55,22 @@ export function generateExplorerPath(
}=${JSONCompositeQuery}&${queryString.join('&')}`;
}
// TODO(@rahul-signoz): update the name of this function once we have view logs button in every panel
export function onViewTracePopupClick({
selectedTraceTags,
servicename,
timestamp,
apmToTraceQuery,
isViewLogsClicked,
stepInterval,
}: OnViewTracePopupClickProps): VoidFunction {
return (): void => {
const currentTime = timestamp;
const tPlusOne = timestamp + 60;
const endTime = timestamp + (stepInterval || 60);
const urlParams = new URLSearchParams(window.location.search);
urlParams.set(QueryParams.startTime, currentTime.toString());
urlParams.set(QueryParams.endTime, tPlusOne.toString());
urlParams.set(QueryParams.endTime, endTime.toString());
urlParams.delete(QueryParams.relativeTime);
const avialableParams = routeConfig[ROUTES.TRACE];
const queryString = getQueryString(avialableParams, urlParams);
@ -175,7 +177,7 @@ export function useGetAPMToLogsQueries({
const serviceName = {
id: 'service.name--string--resource--true',
dataType: DataTypes.String,
isColumn: true,
isColumn: false,
key: 'service.name',
type: 'resource',
isJSON: false,