Merge branch 'develop' into release/v0.24.0

frontend/src/constants/features.ts

@@ -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',
 }

frontend/src/container/MetricsApplication/MetricsPageQueries/MetricsPageQueriesFactory.ts

@@ -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,
  };
 

frontend/src/container/MetricsApplication/MetricsPageQueries/OverviewQueries.ts

@@ -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,
- dataType: DataType.FLOAT64,
- isColumn: true,
- type: MetricsType.Tag,
- },
+ const newAutoCompleteData: BaseAutocompleteData = {
+ key: isSpanMetricEnable
+ ? WidgetKeys.Signoz_latency_bucket
+ : WidgetKeys.DurationNano,
+ dataType: DataType.FLOAT64,
+ isColumn: true,
+ type: isSpanMetricEnable ? null : MetricsType.Tag,
+ };
+
+ const autocompleteData: BaseAutocompleteData[] = Array(3).fill(
+ newAutoCompleteData,
+ );
+
+ const filterItem: TagFilterItem[] = [
  {
- key: WidgetKeys.DurationNano,
- dataType: DataType.FLOAT64,
- isColumn: true,
- type: MetricsType.Tag,
+ 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,
- type: MetricsType.Tag,
+ id: '',
+ key: {
+ dataType: DataType.STRING,
+ isColumn: !isSpanMetricEnable,
+ key: isSpanMetricEnable ? WidgetKeys.Operation : WidgetKeys.Name,
+ 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[];
 }

frontend/src/container/MetricsApplication/Tabs/Overview.tsx

@@ -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>
 

frontend/src/container/MetricsApplication/Tabs/Overview/ServiceOverview.tsx

@@ -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;

frontend/src/container/MetricsApplication/constant.ts

@@ -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',
 }