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

USE_SPAN_METRICS for latency graph on Feature flag (#3172)

Browse Source
This commit is contained in:
Rajat Dabade 2023-07-20 12:02:21 +05:30 committed by GitHub
parent 98a2ef4080
commit 6d7081a4bd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 75 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/constants/features.ts
View File

@ -8,4 +8,5 @@ export enum FeatureKeys {
QUERY_BUILDER_PANELS = 'QUERY_BUILDER_PANELS',
QUERY_BUILDER_ALERTS = 'QUERY_BUILDER_ALERTS',
DISABLE_UPSELL = 'DISABLE_UPSELL',
USE_SPAN_METRICS = 'USE_SPAN_METRICS',
}

2
frontend/src/container/MetricsApplication/MetricsPageQueries/MetricsPageQueriesFactory.ts
View File

@ -43,11 +43,11 @@ export const getQueryBuilderQueries = ({
inputFormat: 'ns',
start: store.getState().globalTime.minTime,
}),
reduceTo: 'sum',
filters: {
items: filterItems[index],
op: 'AND',
},
reduceTo: 'sum',
dataSource,
};

102
frontend/src/container/MetricsApplication/MetricsPageQueries/OverviewQueries.ts
View File

@ -7,7 +7,8 @@ import {
DataType,
FORMULA,
GraphTitle,
LETENCY_LEGENDS_AGGREGATEOPERATOR,
LATENCY_AGGREGATEOPERATOR,
LATENCY_AGGREGATEOPERATOR_SPAN_METRICS,
MetricsType,
OPERATION_LEGENDS,
QUERYNAME_AND_EXPRESSION,
@ -22,79 +23,58 @@ import {
export const latency = ({
servicename,
tagFilterItems,
isSpanMetricEnable = false,
topLevelOperationsRoute,
}: LatencyProps): QueryBuilderData => {
const autocompleteData: BaseAutocompleteData[] = [
{
key: WidgetKeys.DurationNano,
const newAutoCompleteData: BaseAutocompleteData = {
key: isSpanMetricEnable
? WidgetKeys.Signoz_latency_bucket
: WidgetKeys.DurationNano,
dataType: DataType.FLOAT64,
isColumn: true,
type: MetricsType.Tag,
type: isSpanMetricEnable ? null : MetricsType.Tag,
};
const autocompleteData: BaseAutocompleteData[] = Array(3).fill(
newAutoCompleteData,
);
const filterItem: TagFilterItem[] = [
{
id: '',
key: {
key: isSpanMetricEnable ? WidgetKeys.Service_name : WidgetKeys.ServiceName,
dataType: DataType.STRING,
type: isSpanMetricEnable ? MetricsType.Resource : MetricsType.Tag,
isColumn: !isSpanMetricEnable,
},
op: isSpanMetricEnable ? OPERATORS.IN : OPERATORS['='],
value: isSpanMetricEnable ? [servicename] : servicename,
},
{
key: WidgetKeys.DurationNano,
dataType: DataType.FLOAT64,
isColumn: true,
id: '',
key: {
dataType: DataType.STRING,
isColumn: !isSpanMetricEnable,
key: isSpanMetricEnable ? WidgetKeys.Operation : WidgetKeys.Name,
type: MetricsType.Tag,
},
{
key: WidgetKeys.DurationNano,
dataType: DataType.FLOAT64,
isColumn: true,
type: MetricsType.Tag,
op: OPERATORS.IN.toLowerCase(), // TODO: need to remove toLowerCase() this once backend is changed
value: [...topLevelOperationsRoute],
},
...tagFilterItems,
];
const filterItems: TagFilterItem[][] = [
[
{
id: '',
key: {
key: WidgetKeys.ServiceName,
dataType: DataType.STRING,
type: MetricsType.Tag,
isColumn: true,
},
op: OPERATORS['='],
value: `${servicename}`,
},
...tagFilterItems,
],
[
{
id: '',
key: {
key: WidgetKeys.ServiceName,
dataType: DataType.STRING,
type: MetricsType.Tag,
isColumn: true,
},
op: OPERATORS['='],
value: `${servicename}`,
},
...tagFilterItems,
],
[
{
id: '',
key: {
key: WidgetKeys.ServiceName,
dataType: DataType.STRING,
type: MetricsType.Tag,
isColumn: true,
},
op: OPERATORS['='],
value: `${servicename}`,
},
...tagFilterItems,
],
];
const filterItems: TagFilterItem[][] = Array(3).fill([...filterItem]);
return getQueryBuilderQueries({
autocompleteData,
legends: LETENCY_LEGENDS_AGGREGATEOPERATOR,
legends: LATENCY_AGGREGATEOPERATOR,
filterItems,
aggregateOperator: LETENCY_LEGENDS_AGGREGATEOPERATOR,
dataSource: DataSource.TRACES,
aggregateOperator: isSpanMetricEnable
? LATENCY_AGGREGATEOPERATOR_SPAN_METRICS
: LATENCY_AGGREGATEOPERATOR,
dataSource: isSpanMetricEnable ? DataSource.METRICS : DataSource.TRACES,
queryNameAndExpression: QUERYNAME_AND_EXPRESSION,
});
};
@ -250,4 +230,6 @@ export interface OperationPerSecProps {
export interface LatencyProps {
servicename: IServiceName['servicename'];
tagFilterItems: TagFilterItem[];
isSpanMetricEnable?: boolean;
topLevelOperationsRoute: string[];
}

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

@ -97,6 +97,11 @@ function Application(): JSX.Element {
[queries],
);
const topLevelOperationsRoute = useMemo(
() => (topLevelOperations ? topLevelOperations[servicename || ''] : []),
[servicename, topLevelOperations],
);
const operationPerSecWidget = useMemo(
() =>
getWidgetQueryBuilder(
@ -106,16 +111,14 @@ function Application(): JSX.Element {
builder: operationPerSec({
servicename,
tagFilterItems,
topLevelOperations: topLevelOperations
? topLevelOperations[servicename || '']
: [],
topLevelOperations: topLevelOperationsRoute,
}),
clickhouse_sql: [],
id: uuid(),
},
GraphTitle.RATE_PER_OPS,
),
[servicename, topLevelOperations, tagFilterItems],
[servicename, tagFilterItems, topLevelOperationsRoute],
);
const errorPercentageWidget = useMemo(
@ -127,16 +130,14 @@ function Application(): JSX.Element {
builder: errorPercentage({
servicename,
tagFilterItems,
topLevelOperations: topLevelOperations
? topLevelOperations[servicename || '']
: [],
topLevelOperations: topLevelOperationsRoute,
}),
clickhouse_sql: [],
id: uuid(),
},
GraphTitle.ERROR_PERCENTAGE,
),
[servicename, topLevelOperations, tagFilterItems],
[servicename, tagFilterItems, topLevelOperationsRoute],
);
const onDragSelect = useCallback(
@ -181,6 +182,7 @@ function Application(): JSX.Element {
selectedTimeStamp={selectedTimeStamp}
selectedTraceTags={selectedTraceTags}
tagFilterItems={tagFilterItems}
topLevelOperationsRoute={topLevelOperationsRoute}
/>
</Col>

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

@ -1,8 +1,10 @@
import { FeatureKeys } from 'constants/features';
import Graph from 'container/GridGraphLayout/Graph/';
import { GraphTitle } from 'container/MetricsApplication/constant';
import { getWidgetQueryBuilder } from 'container/MetricsApplication/MetricsApplication.factory';
import { latency } from 'container/MetricsApplication/MetricsPageQueries/OverviewQueries';
import { Card, GraphContainer } from 'container/MetricsApplication/styles';
import useFeatureFlag from 'hooks/useFeatureFlag';
import { useMemo } from 'react';
import { useParams } from 'react-router-dom';
import { TagFilterItem } from 'types/api/queryBuilder/queryBuilderData';
@ -20,9 +22,13 @@ function ServiceOverview({
selectedTraceTags,
selectedTimeStamp,
tagFilterItems,
topLevelOperationsRoute,
}: ServiceOverviewProps): JSX.Element {
const { servicename } = useParams<IServiceName>();
const isSpanMetricEnable = useFeatureFlag(FeatureKeys.USE_SPAN_METRICS)
?.active;
const latencyWidget = useMemo(
() =>
getWidgetQueryBuilder(
@ -32,13 +38,15 @@ function ServiceOverview({
builder: latency({
servicename,
tagFilterItems,
isSpanMetricEnable,
topLevelOperationsRoute,
}),
clickhouse_sql: [],
id: uuid(),
},
GraphTitle.LATENCY,
),
[servicename, tagFilterItems],
[servicename, tagFilterItems, isSpanMetricEnable, topLevelOperationsRoute],
);
return (
@ -79,6 +87,7 @@ interface ServiceOverviewProps {
onDragSelect: (start: number, end: number) => void;
handleGraphClick: (type: string) => ClickHandlerType;
tagFilterItems: TagFilterItem[];
topLevelOperationsRoute: string[];
}
export default ServiceOverview;

9
frontend/src/container/MetricsApplication/constant.ts
View File

@ -3,7 +3,12 @@ export const legend = {
};
export const QUERYNAME_AND_EXPRESSION = ['A', 'B', 'C'];
export const LETENCY_LEGENDS_AGGREGATEOPERATOR = ['p50', 'p90', 'p99'];
export const LATENCY_AGGREGATEOPERATOR = ['p50', 'p90', 'p99'];
export const LATENCY_AGGREGATEOPERATOR_SPAN_METRICS = [
'hist_quantile_50',
'hist_quantile_90',
'hist_quantile_99',
];
export const OPERATION_LEGENDS = ['Operations'];
export enum FORMULA {
@ -35,6 +40,7 @@ export enum MetricsType {
}
export enum WidgetKeys {
Name = 'name',
Address = 'address',
DurationNano = 'durationNano',
StatusCode = 'status_code',
@ -50,4 +56,5 @@ export enum WidgetKeys {
SignozCallsTotal = 'signoz_calls_total',
SignozExternalCallLatencyCount = 'signoz_external_call_latency_count',
SignozExternalCallLatencySum = 'signoz_external_call_latency_sum',
Signoz_latency_bucket = 'signoz_latency_bucket',
}