From 1ecd7ea3d9d77d644e14adbba0b6769690e99046 Mon Sep 17 00:00:00 2001 From: Shenoy Pratik Date: Tue, 18 Apr 2023 16:23:36 -0700 Subject: [PATCH] Metrics analytics support for SOpanels (#386) Signed-off-by: Shenoy Pratik --- .cypress/integration/2_notebooks.spec.js | 2 +- public/components/metrics/helpers/utils.tsx | 1 - .../__tests__/metrics_export_panel.test.tsx | 12 +++++++-- .../metrics/top_menu/metrics_export_panel.tsx | 25 +++++++++++-------- .../components/metrics/top_menu/top_menu.tsx | 12 +++++++-- 5 files changed, 35 insertions(+), 17 deletions(-) diff --git a/.cypress/integration/2_notebooks.spec.js b/.cypress/integration/2_notebooks.spec.js index 3ba071215..5743cd07a 100644 --- a/.cypress/integration/2_notebooks.spec.js +++ b/.cypress/integration/2_notebooks.spec.js @@ -497,7 +497,7 @@ describe('Testing paragraphs', () => { cy.get('.euiButton__text').contains('Create notebook').should('exist'); }); - + it('Cleans up test notebooks', () => { cy.get('[data-test-subj="notebook-notebook-actions-button"]').click(); cy.wait(delay); diff --git a/public/components/metrics/helpers/utils.tsx b/public/components/metrics/helpers/utils.tsx index dd7524bd3..96f7fe477 100644 --- a/public/components/metrics/helpers/utils.tsx +++ b/public/components/metrics/helpers/utils.tsx @@ -20,7 +20,6 @@ import { CoreStart } from '../../../../../../src/core/public'; import { MetricType } from '../../../../common/types/metrics'; import { VisualizationType } from '../../../../common/types/custom_panels'; import { DEFAULT_METRIC_HEIGHT, DEFAULT_METRIC_WIDTH } from '../../../../common/constants/metrics'; -import { UNITS_OF_MEASURE } from '../../../../common/constants/explorer'; import { updateQuerySpanInterval } from '../../custom_panels/helpers/utils'; export const onTimeChange = ( diff --git a/public/components/metrics/top_menu/__tests__/metrics_export_panel.test.tsx b/public/components/metrics/top_menu/__tests__/metrics_export_panel.test.tsx index c6d30fdc3..df95065e1 100644 --- a/public/components/metrics/top_menu/__tests__/metrics_export_panel.test.tsx +++ b/public/components/metrics/top_menu/__tests__/metrics_export_panel.test.tsx @@ -13,16 +13,24 @@ import { sampleSortedMetricsLayout, sampleVisualizationById, } from '../../../../../test/metrics_contants'; -import { createStore } from '@reduxjs/toolkit'; +import { applyMiddleware, createStore } from '@reduxjs/toolkit'; import { rootReducer } from '../../../../framework/redux/reducers'; import { Provider } from 'react-redux'; import { HttpResponse } from '../../../../../../../src/core/public'; import { MetricsExportPanel } from '../metrics_export_panel'; import { EuiComboBoxOptionOption } from '@elastic/eui'; +import thunk from 'redux-thunk'; +import { coreRefs } from '../../../../framework/core_refs'; describe('Export Metrics Panel Component', () => { configure({ adapter: new Adapter() }); - const store = createStore(rootReducer); + const store = createStore(rootReducer, applyMiddleware(thunk)); + coreRefs.savedObjectsClient.find = jest.fn(() => + Promise.resolve({ + savedObjects: [], + then: () => Promise.resolve(), + }) + ); it('renders Export Metrics Panel Component', async () => { let httpFlag = 1; diff --git a/public/components/metrics/top_menu/metrics_export_panel.tsx b/public/components/metrics/top_menu/metrics_export_panel.tsx index 9a26d4630..50819bcf6 100644 --- a/public/components/metrics/top_menu/metrics_export_panel.tsx +++ b/public/components/metrics/top_menu/metrics_export_panel.tsx @@ -18,6 +18,11 @@ import { import { createPrometheusMetricById } from '../helpers/utils'; import { MetricType } from '../../../../common/types/metrics'; import { fetchVisualizationById } from '../../custom_panels/helpers/utils'; +import { useDispatch, useSelector } from 'react-redux'; +import { + fetchPanels, + selectPanelList, +} from '../../../../public/components/custom_panels/redux/panel_slice'; interface MetricsExportPanelProps { http: CoreStart['http']; @@ -49,14 +54,13 @@ export const MetricsExportPanel = ({ const [errorResponse, setErrorResponse] = useState(''); - const getCustomPanelList = async () => { - http - .get(`${CUSTOM_PANELS_API_PREFIX}/panels`) - .then((res: any) => { - setOptions(res.panels || []); - }) - .catch((error: any) => console.error(error)); - }; + const customPanels = useSelector(selectPanelList); + + const dispatch = useDispatch(); + + useEffect(() => { + dispatch(fetchPanels()); + }, []); const fetchAllvisualizationsById = async () => { let tempVisualizationsMetaData = await Promise.all( @@ -70,7 +74,6 @@ export const MetricsExportPanel = ({ }; useEffect(() => { - getCustomPanelList(); fetchAllvisualizationsById(); }, []); @@ -92,10 +95,10 @@ export const MetricsExportPanel = ({ setSelectedPanelOptions(options); }} selectedOptions={selectedPanelOptions} - options={options.map((option: CustomPanelOptions) => { + options={customPanels.map((option: any) => { return { panel: option, - label: option.name, + label: option.title, }; })} isClearable={true} diff --git a/public/components/metrics/top_menu/top_menu.tsx b/public/components/metrics/top_menu/top_menu.tsx index 8ab98fb2e..eeaf50268 100644 --- a/public/components/metrics/top_menu/top_menu.tsx +++ b/public/components/metrics/top_menu/top_menu.tsx @@ -37,6 +37,7 @@ import SavedObjects from '../../../services/saved_objects/event_analytics/saved_ import { sortMetricLayout, updateMetricsWithSelections } from '../helpers/utils'; import { CUSTOM_PANELS_API_PREFIX } from '../../../../common/constants/custom_panels'; import { MetricsExportPanel } from './metrics_export_panel'; +import { addVizToPanels, uuidRx } from '../../custom_panels/redux/panel_slice'; interface TopMenuProps { http: CoreStart['http']; @@ -191,8 +192,11 @@ export const TopMenu = ({ if (selectedPanelOptions.length > 0) { try { const allMetricIds = savedMetricIds.map((metric) => metric.objectId); - savedMetricsInPanels = await Promise.all( - selectedPanelOptions.map((panel) => { + const soPanels = selectedPanelOptions.filter((panel) => uuidRx.test(panel.panel.id)); + const opsPanels = selectedPanelOptions.filter((panel) => !uuidRx.test(panel.panel.id)); + + const savedMetricsInOpsPanels = await Promise.all( + opsPanels.map((panel) => { return http.post(`${CUSTOM_PANELS_API_PREFIX}/visualizations/multiple`, { body: JSON.stringify({ panelId: panel.panel.id, @@ -201,6 +205,10 @@ export const TopMenu = ({ }); }) ); + + allMetricIds.forEach((metricId) => { + dispatch(addVizToPanels(soPanels, metricId)); + }); } catch (e) { const message = 'Issue in saving metrics to panels'; console.error(message, e);