Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Backport 2.x] Metrics analytics support for MDS #1895

Merged
merged 3 commits into from
Jun 11, 2024
Merged

[Backport 2.x] Metrics analytics support for MDS #1895

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
c81ee66
backport mds metrics change
sumukhswamy Jun 8, 2024
1b238c3
added linter fix
sumukhswamy Jun 11, 2024
612c390
added linter fix
sumukhswamy Jun 11, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 28 additions & 9 deletions public/components/custom_panels/helpers/utils.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -170,13 +170,14 @@
endTime: string,
filterQuery = '',
timestampField = 'timestamp',
metricVisualization = false
metricVisualization = false,
dataSourceMDSId?: string
) => {
const finalQuery = metricVisualization
? query
: queryAccumulator(query, timestampField, startTime, endTime, filterQuery);

const res = await pplService.fetch({ query: finalQuery, format: 'jdbc' });
const res = await pplService.fetch({ query: finalQuery, format: 'jdbc' }, dataSourceMDSId);

if (res === undefined) throw new Error('Please check the validity of PPL Filter');

Expand All @@ -198,6 +199,7 @@
setIsLoading,
setIsError,
visualization,
dataSourceMDSId,
}: {
pplService: PPLService;
startTime: string;
Expand All @@ -212,6 +214,7 @@
setIsLoading: React.Dispatch<React.SetStateAction<boolean>>;
setIsError: React.Dispatch<React.SetStateAction<VizContainerError>>;
visualization: SavedVisualizationType;
dataSourceMDSId?: string;
}) => {
setIsLoading(true);
setIsError({} as VizContainerError);
Expand Down Expand Up @@ -244,7 +247,9 @@
startTime,
endTime,
filterQuery,
visualization.timeField
visualization.timeField,
false,
dataSourceMDSId
);
setVisualizationData(queryData);
} catch (error) {
Expand Down Expand Up @@ -330,6 +335,7 @@
setIsLoading,
setIsError,
visualization,
dataSourceMDSId,
}: {
pplService: PPLService;
catalogSource: string;
Expand All @@ -346,6 +352,7 @@
setIsError: React.Dispatch<React.SetStateAction<VizContainerError>>;
queryMetaData?: MetricType;
visualization: SavedVisualizationType;
dataSourceMDSId?: string;
}) => {
setIsLoading(true);
setIsError({} as VizContainerError);
Expand Down Expand Up @@ -373,7 +380,8 @@
endTime,
filterQuery,
visualizationTimeField,
true
true,
dataSourceMDSId
);
setVisualizationData(queryData);

Expand Down Expand Up @@ -432,7 +440,8 @@
documentName: string,
selectedOtelIndex: string,
setIsError: React.Dispatch<React.SetStateAction<VizContainerError>>,
setIsLoading: React.Dispatch<React.SetStateAction<boolean>>
setIsLoading: React.Dispatch<React.SetStateAction<boolean>>,
dataSourceMDSId: string
) => {
const http = getOSDHttp();
try {
Expand All @@ -444,6 +453,7 @@
endTime,
documentName,
index: selectedOtelIndex,
dataSourceMDSId,
}),
});
return response;
Expand All @@ -459,11 +469,17 @@
}
};

export const fetchSampleOTDocument = async (selectedOtelIndex: string, documentName: string) => {
export const fetchSampleOTDocument = async (
selectedOtelIndex: string,
documentName: string,
dataSourceMDSId: string
) => {
const http = getOSDHttp();
try {
const response = await http.get(
`${OBSERVABILITY_BASE}/metrics/otel/${selectedOtelIndex}/${documentName}`
`${OBSERVABILITY_BASE}/metrics/otel/${selectedOtelIndex}/${documentName}/${
dataSourceMDSId ?? ''
}`
);
return response;
} catch (error) {
Expand Down Expand Up @@ -495,6 +511,7 @@
setIsError,
visualization,
setToast,
dataSourceMDSId,
}: {
startTime: string;
endTime: string;
Expand All @@ -504,13 +521,14 @@
setVisualizationMetaData: React.Dispatch<React.SetStateAction<undefined>>;
setIsLoading: React.Dispatch<React.SetStateAction<boolean>>;
setIsError: React.Dispatch<React.SetStateAction<VizContainerError>>;
visualization: any;

Check warning on line 524 in public/components/custom_panels/helpers/utils.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
setToast: (
title: string,
color?: string,
text?: React.ReactChild | undefined,
side?: string | undefined
) => void;
dataSourceMDSId?: string;
}) => {
setIsLoading(true);
setIsError({} as VizContainerError);
Expand All @@ -527,13 +545,13 @@
setToast('Document name is undefined', 'danger', undefined, 'right');
}

const fetchSampleDocument = await fetchSampleOTDocument(index, documentName);
const fetchSampleDocument = await fetchSampleOTDocument(index, documentName, dataSourceMDSId);
const source = fetchSampleDocument.hits[0]._source;

setVisualizationType(visualizationType);
setVisualizationTitle(source.name);

const dataBinsPromises = source.buckets.map(async (bucket: any) => {

Check warning on line 554 in public/components/custom_panels/helpers/utils.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
try {
const formattedStartTime = convertDateTime(startTime, false, false, OTEL_METRIC_SUBTYPE);
const formattedEndTime = convertDateTime(endTime, false, false, OTEL_METRIC_SUBTYPE);
Expand All @@ -545,7 +563,8 @@
documentName,
index,
setIsError,
setIsLoading
setIsLoading,
dataSourceMDSId
);

return {
Expand Down Expand Up @@ -666,7 +685,7 @@
return true;
};

export const processMetricsData = (schema: any) => {

Check warning on line 688 in public/components/custom_panels/helpers/utils.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
if (isEmpty(schema)) return {};
if (
schema.length === 3 &&
Expand All @@ -677,10 +696,10 @@
return {};
};

export const prepareMetricsData = (schema: any) => {

Check warning on line 699 in public/components/custom_panels/helpers/utils.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
const metricBreakdown: any[] = [];

Check warning on line 700 in public/components/custom_panels/helpers/utils.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
const metricSeries: any[] = [];

Check warning on line 701 in public/components/custom_panels/helpers/utils.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
const metricDimension: any[] = [];

Check warning on line 702 in public/components/custom_panels/helpers/utils.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type

forEach(schema, (field) => {
if (field.name === '@timestamp')
Expand All @@ -698,8 +717,8 @@
};

export const constructOtelMetricsMetaData = () => {
const otelMetricSeries: any[] = [];

Check warning on line 720 in public/components/custom_panels/helpers/utils.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
const otelMetricDimension: any[] = [];

Check warning on line 721 in public/components/custom_panels/helpers/utils.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type

otelMetricDimension.push({ name: 'xAxis', label: 'xAxis', customLabel: '' });
otelMetricSeries.push({ name: '', label: '', aggregation: 'count', customLabel: '' });
Expand All @@ -724,7 +743,7 @@
};

// Renders visualization in the vizualization container component
export const displayVisualization = (metaData: any, data: any, type: string) => {

Check warning on line 746 in public/components/custom_panels/helpers/utils.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
if (metaData === undefined || isEmpty(metaData)) {
return <></>;
}
Expand Down
9 changes: 7 additions & 2 deletions ...omponents/custom_panels/panel_modules/visualization_container/visualization_container.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ import {
EuiText,
EuiToolTip,
} from '@elastic/eui';
import { isEmpty } from 'lodash';
import isEmpty from 'lodash/isEmpty';
import React, { useEffect, useMemo, useState } from 'react';
import { useSelector } from 'react-redux';
import {
Expand All @@ -41,7 +41,7 @@ import {
fetchVisualizationById,
renderCatalogVisualization,
renderOpenTelemetryVisualization,
renderSavedVisualization
renderSavedVisualization,
} from '../../helpers/utils';
import './visualization_container.scss';

Expand Down Expand Up @@ -85,6 +85,7 @@ interface Props {
catalogVisualization?: boolean;
inlineEditor?: JSX.Element;
actionMenuType?: string;
dataSourceMDSId?: string;
}

export const VisualizationContainer = ({
Expand All @@ -106,6 +107,7 @@ export const VisualizationContainer = ({
catalogVisualization,
inlineEditor,
actionMenuType,
dataSourceMDSId,
}: Props) => {
const [isPopoverOpen, setIsPopoverOpen] = useState(false);
const [visualizationTitle, setVisualizationTitle] = useState('');
Expand Down Expand Up @@ -263,6 +265,7 @@ export const VisualizationContainer = ({
setIsLoading,
setIsError,
setToast,
dataSourceMDSId,
});
else if (visualization.metricType === PROMQL_METRIC_SUBTYPE)
renderCatalogVisualization({
Expand All @@ -281,6 +284,7 @@ export const VisualizationContainer = ({
setIsLoading,
setIsError,
queryMetaData,
dataSourceMDSId,
});
else
await renderSavedVisualization({
Expand All @@ -299,6 +303,7 @@ export const VisualizationContainer = ({
setVisualizationMetaData,
setIsLoading,
setIsError,
dataSourceMDSId,
});
};

Expand Down
16 changes: 10 additions & 6 deletions public/components/metrics/helpers/utils.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,12 @@ import { Layout } from 'react-grid-layout';
import { VISUALIZATION } from '../../../../common/constants/metrics';
import {
OTEL_METRIC_SUBTYPE,
PROMQL_METRIC_SUBTYPE,
PPL_METRIC_SUBTYPE,
PROMQL_METRIC_SUBTYPE,
} from '../../../../common/constants/shared';
import PPLService from '../../../services/requests/ppl';
import { MetricType } from '../../../../common/types/metrics';
import { VisualizationType } from '../../../../common/types/custom_panels';
import { MetricType } from '../../../../common/types/metrics';
import PPLService from '../../../services/requests/ppl';

export const onTimeChange = (
start: ShortDate,
Expand All @@ -36,9 +36,13 @@ export const onTimeChange = (
};

// PPL Service requestor
export const pplServiceRequestor = (pplService: PPLService, finalQuery: string) => {
export const pplServiceRequestor = (
pplService: PPLService,
finalQuery: string,
dataSourceMDSId?: string
) => {
return pplService
.fetch({ query: finalQuery, format: VISUALIZATION })
.fetch({ query: finalQuery, format: VISUALIZATION }, dataSourceMDSId)
.then((res) => {
return res;
})
Expand All @@ -56,7 +60,7 @@ export const mergeLayoutAndMetrics = (

for (let i = 0; i < newVisualizationList.length; i++) {
for (let j = 0; j < layout.length; j++) {
if (newVisualizationList[i].id == layout[j].i) {
if (newVisualizationList[i].id === layout[j].i) {
newPanelVisualizations.push({
...newVisualizationList[i],
x: layout[j].x,
Expand Down
Loading
Loading