From 3d1e345051d4ea3c73f7aa858fd01daeafc0764a Mon Sep 17 00:00:00 2001 From: Eric Date: Tue, 6 Feb 2024 07:17:42 +0000 Subject: [PATCH 01/17] add log explorer re-directon modal Signed-off-by: Eric --- .../public/components/sidebar/index.tsx | 84 +++++++++++++++++-- 1 file changed, 79 insertions(+), 5 deletions(-) diff --git a/src/plugins/data_explorer/public/components/sidebar/index.tsx b/src/plugins/data_explorer/public/components/sidebar/index.tsx index ee2dd63a6d5..4da9ef6df90 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.tsx @@ -4,7 +4,18 @@ */ import React, { FC, useCallback, useEffect, useState } from 'react'; -import { EuiPageSideBar, EuiSplitPanel } from '@elastic/eui'; +import { + EuiPageSideBar, + EuiSplitPanel, + EuiModal, + EuiModalHeader, + EuiModalBody, + EuiModalHeaderTitle, + EuiModalFooter, + EuiButtonEmpty, + EuiButton, + EuiText, +} from '@elastic/eui'; import { i18n } from '@osd/i18n'; import { DataSourceGroup, DataSourceSelectable, DataSourceType } from '../../../../data/public'; import { DataSourceOption } from '../../../../data/public/'; @@ -19,6 +30,8 @@ export const Sidebar: FC = ({ children }) => { const [selectedSources, setSelectedSources] = useState([]); const [dataSourceOptionList, setDataSourceOptionList] = useState([]); const [activeDataSources, setActiveDataSources] = useState([]); + const [modalContent, setModalContent] = useState(null); + const [isModalVisible, setIsModalVisible] = useState(false); const { services: { @@ -59,6 +72,67 @@ export const Sidebar: FC = ({ children }) => { } }, [indexPatternId, activeDataSources, dataSourceOptionList]); + const closeModal = useCallback(() => setIsModalVisible(false), [setIsModalVisible]); + + const redirectToLogExplorer = useCallback( + (dsName: string, dsType: string) => { + return application.navigateToUrl( + `../observability-logs#/explorer?datasourceName=${dsName}&datasourceType=${dsType}` + ); + }, + [application] + ); + + // show log explorer redirection modal when non-index data source clicked + const getRedirectModal = useCallback( + (dsName: string, dsType: string) => { + return ( + + + +

+ {i18n.translate('dataExplorer.sidebar.LogExplorerRedirectionModalTitle', { + defaultMessage: 'Open in Log Explorer', + })} +

+ + + + + {i18n.translate('dataExplorer.sidebar.LogExplorerRedirectionModalMessage', { + defaultMessage: + 'Selecting this data source will open the Log Explorer application, where you can query \ + data using PPL/SQL.', + })} + + + + Cancel + { + redirectToLogExplorer(dsName, dsType); + }} + fill + > + {i18n.translate('dataExplorer.sidebar.LogExplorerRedirectionModalFooterButtonTxt', { + defaultMessage: 'Open in Log Explorer ', + })} + + + + ); + }, + [closeModal, redirectToLogExplorer] + ); + + const showModal = useCallback( + (dsName: string, dsType: string) => { + setModalContent(getRedirectModal(dsName, dsType)); + setIsModalVisible(true); + }, + [setModalContent, setIsModalVisible, getRedirectModal] + ); + const handleSourceSelection = useCallback( (selectedDataSources: DataSourceOption[]) => { if (selectedDataSources.length === 0) { @@ -68,14 +142,13 @@ export const Sidebar: FC = ({ children }) => { // Temporary redirection solution for 2.11, where clicking non-index-pattern datasource // will redirect user to Observability event explorer if (selectedDataSources[0]?.ds?.getType() !== 'DEFAULT_INDEX_PATTERNS') { - return application.navigateToUrl( - `../observability-logs#/explorer?datasourceName=${selectedDataSources[0].label}&datasourceType=${selectedDataSources[0].type}` - ); + showModal(selectedDataSources[0].label, selectedDataSources[0].type); + return; } setSelectedSources(selectedDataSources); dispatch(setIndexPattern(selectedDataSources[0].value)); }, - [application, dispatch] + [dispatch, showModal, setSelectedSources] ); const handleGetDataSetError = useCallback( @@ -117,6 +190,7 @@ export const Sidebar: FC = ({ children }) => { {children} + {isModalVisible && modalContent} ); From 9d7d629e1f9d9ec4463cb6e31a647cf720cab235 Mon Sep 17 00:00:00 2001 From: Eric Date: Tue, 6 Feb 2024 16:23:57 +0000 Subject: [PATCH 02/17] adjustments to comments Signed-off-by: Eric --- .../data_explorer/public/components/sidebar/index.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/plugins/data_explorer/public/components/sidebar/index.tsx b/src/plugins/data_explorer/public/components/sidebar/index.tsx index 4da9ef6df90..8184348862b 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.tsx @@ -83,7 +83,6 @@ export const Sidebar: FC = ({ children }) => { [application] ); - // show log explorer redirection modal when non-index data source clicked const getRedirectModal = useCallback( (dsName: string, dsType: string) => { return ( @@ -139,8 +138,8 @@ export const Sidebar: FC = ({ children }) => { setSelectedSources(selectedDataSources); return; } - // Temporary redirection solution for 2.11, where clicking non-index-pattern datasource - // will redirect user to Observability event explorer + // Temporary redirection solution for 2.11, where clicking non-index-pattern data sources + // will prompt users with modal explaining they are being redirected to Observability log explorer if (selectedDataSources[0]?.ds?.getType() !== 'DEFAULT_INDEX_PATTERNS') { showModal(selectedDataSources[0].label, selectedDataSources[0].type); return; From 1899fa9b7dc47ba507fb27ada60f7b92ead3f817 Mon Sep 17 00:00:00 2001 From: Eric Date: Tue, 6 Feb 2024 16:27:42 +0000 Subject: [PATCH 03/17] add one missing i18n Signed-off-by: Eric --- .../data_explorer/public/components/sidebar/index.tsx | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/plugins/data_explorer/public/components/sidebar/index.tsx b/src/plugins/data_explorer/public/components/sidebar/index.tsx index 8184348862b..f45cf34e3d0 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.tsx @@ -106,7 +106,14 @@ export const Sidebar: FC = ({ children }) => { - Cancel + + {i18n.translate( + 'dataExplorer.sidebar.LogExplorerRedirectionModalFooterCancelButtonTxt', + { + defaultMessage: 'Cancel', + } + )} + { redirectToLogExplorer(dsName, dsType); From c946f5b5d5dc7e6825bdc13537d86f3395cf7f31 Mon Sep 17 00:00:00 2001 From: Eric Date: Tue, 6 Feb 2024 19:23:22 +0000 Subject: [PATCH 04/17] add redirection text to group title Signed-off-by: Eric --- .../datasource_selectable.tsx | 26 +++++++++++++++---- .../data_sources/datasource_selector/types.ts | 5 ++++ .../public/components/sidebar/index.tsx | 4 +++ 3 files changed, 30 insertions(+), 5 deletions(-) diff --git a/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx b/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx index 88abe18aa14..322d36241b3 100644 --- a/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx +++ b/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx @@ -8,7 +8,11 @@ import { EuiComboBox } from '@elastic/eui'; import { i18n } from '@osd/i18n'; import { ISourceDataSet, IndexPatternOption } from '../datasource'; import { DataSourceType, GenericDataSource } from '../datasource_services'; -import { DataSourceGroup, DataSourceSelectableProps } from './types'; +import { + DataSourceGroup, + DataSourceSelectableProps, + DataSourceSelectorConfigurations, +} from './types'; type DataSourceTypeKey = 'DEFAULT_INDEX_PATTERNS' | 's3glue' | 'spark'; @@ -63,11 +67,22 @@ export const getSourceOptions = (dataSource: DataSourceType, dataSet: DataSetTyp }; // Convert data sets into a structured format suitable for selector rendering. -const getSourceList = (allDataSets: ISourceDataSet[]) => { +const getSourceList = ( + allDataSets: ISourceDataSet[], + dataSourceSelectorConfigs: DataSourceSelectorConfigurations +) => { const finalList = [] as DataSourceGroup[]; allDataSets.forEach((curDataSet) => { const typeKey = curDataSet.ds.getType() as DataSourceTypeKey; - const groupName = DATASOURCE_TYPE_DISPLAY_NAME_MAP[typeKey] || 'Default Group'; + let groupName = + DATASOURCE_TYPE_DISPLAY_NAME_MAP[typeKey] || + `Default Group${dataSourceSelectorConfigs.customGroupTitleExtension || ''}`; + + // add '- Opens in Log Explorer' to hint user that selecting these types of data sources + // will lead to redirection to log explorer + if (typeKey !== 'DEFAULT_INDEX_PATTERNS') { + groupName = `${groupName}${dataSourceSelectorConfigs.customGroupTitleExtension || ''}`; + } const existingGroup = finalList.find((item) => item.label === groupName); const mappedOptions = curDataSet.data_sets.map((dataSet) => @@ -104,16 +119,17 @@ export const DataSourceSelectable = ({ setDataSourceOptionList, onGetDataSetError, // onGetDataSetError, Callback for handling get data set errors. Ensure it's memoized. singleSelection = { asPlainText: true }, + dataSourceSelectorConfigs, ...comboBoxProps }: DataSourceSelectableProps) => { // This effect gets data sets and prepares the datasource list for UI rendering. useEffect(() => { Promise.all(getDataSets(dataSources)) .then((results) => { - setDataSourceOptionList(getSourceList(results)); + setDataSourceOptionList(getSourceList(results, dataSourceSelectorConfigs)); }) .catch((e) => onGetDataSetError(e)); - }, [dataSources, setDataSourceOptionList, onGetDataSetError]); + }, [dataSources, setDataSourceOptionList, onGetDataSetError, dataSourceSelectorConfigs]); const handleSourceChange = useCallback( (selectedOptions: any) => onDataSourceSelect(selectedOptions), diff --git a/src/plugins/data/public/data_sources/datasource_selector/types.ts b/src/plugins/data/public/data_sources/datasource_selector/types.ts index 0fa1bf21cb1..d3b93c6ae16 100644 --- a/src/plugins/data/public/data_sources/datasource_selector/types.ts +++ b/src/plugins/data/public/data_sources/datasource_selector/types.ts @@ -30,4 +30,9 @@ export interface DataSourceSelectableProps extends Pick void; + dataSourceSelectorConfigs: DataSourceSelectorConfigurations; +} + +export interface DataSourceSelectorConfigurations { + customGroupTitleExtension: string; } diff --git a/src/plugins/data_explorer/public/components/sidebar/index.tsx b/src/plugins/data_explorer/public/components/sidebar/index.tsx index f45cf34e3d0..fd5adb54752 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.tsx @@ -24,6 +24,9 @@ import { DataExplorerServices } from '../../types'; import { setIndexPattern, useTypedDispatch, useTypedSelector } from '../../utils/state_management'; import './index.scss'; +const LOG_EXPLORER_TITLE_HINT = ' - Opens in Log Explorer'; +const DATA_SOURCE_SELECTOR_CONFIGS = { customGroupTitleExtension: LOG_EXPLORER_TITLE_HINT }; + export const Sidebar: FC = ({ children }) => { const { indexPattern: indexPatternId } = useTypedSelector((state) => state.metadata); const dispatch = useTypedDispatch(); @@ -190,6 +193,7 @@ export const Sidebar: FC = ({ children }) => { onDataSourceSelect={handleSourceSelection} selectedSources={selectedSources} onGetDataSetError={handleGetDataSetError} + dataSourceSelectorConfigs={DATA_SOURCE_SELECTOR_CONFIGS} fullWidth /> From 87a3db257b092c7238be3e9faa682013734c04c7 Mon Sep 17 00:00:00 2001 From: Eric Date: Tue, 6 Feb 2024 19:33:51 +0000 Subject: [PATCH 05/17] include changes in changelog Signed-off-by: Eric --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 8bf3d7338fa..dc67b013bef 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -113,6 +113,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/) - [Discover] Enhanced the data source selector with added sorting functionality ([#5609](https://github.com/opensearch-project/OpenSearch-Dashboards/issues/5609)) - [Multiple Datasource] Add datasource picker component and use it in devtools and tutorial page when multiple datasource is enabled ([#5756](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/5756)) - [Multiple Datasource] Add datasource picker to import saved object flyout when multiple data source is enabled ([#5781](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/5781)) +- [Discover] Add extension group title to non-index data source groups and present a modal to users upon selecting non-index pattern data sources. ([#5815](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/5815)) ### 🐛 Bug Fixes From 5babb73ce2a0ad6ed1ea0843b4f91b7f71c8969f Mon Sep 17 00:00:00 2001 From: Eric Date: Tue, 6 Feb 2024 22:49:54 +0000 Subject: [PATCH 06/17] remove redundent title addition and unnecessary modal toggle functions Signed-off-by: Eric --- .../datasource_selector/datasource_selectable.tsx | 4 +--- .../public/components/sidebar/index.tsx | 15 ++++++--------- 2 files changed, 7 insertions(+), 12 deletions(-) diff --git a/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx b/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx index 322d36241b3..7bb64b6038e 100644 --- a/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx +++ b/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx @@ -74,9 +74,7 @@ const getSourceList = ( const finalList = [] as DataSourceGroup[]; allDataSets.forEach((curDataSet) => { const typeKey = curDataSet.ds.getType() as DataSourceTypeKey; - let groupName = - DATASOURCE_TYPE_DISPLAY_NAME_MAP[typeKey] || - `Default Group${dataSourceSelectorConfigs.customGroupTitleExtension || ''}`; + let groupName = DATASOURCE_TYPE_DISPLAY_NAME_MAP[typeKey] || `Default Group`; // add '- Opens in Log Explorer' to hint user that selecting these types of data sources // will lead to redirection to log explorer diff --git a/src/plugins/data_explorer/public/components/sidebar/index.tsx b/src/plugins/data_explorer/public/components/sidebar/index.tsx index fd5adb54752..2469b3427ed 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.tsx @@ -34,7 +34,6 @@ export const Sidebar: FC = ({ children }) => { const [dataSourceOptionList, setDataSourceOptionList] = useState([]); const [activeDataSources, setActiveDataSources] = useState([]); const [modalContent, setModalContent] = useState(null); - const [isModalVisible, setIsModalVisible] = useState(false); const { services: { @@ -75,8 +74,6 @@ export const Sidebar: FC = ({ children }) => { } }, [indexPatternId, activeDataSources, dataSourceOptionList]); - const closeModal = useCallback(() => setIsModalVisible(false), [setIsModalVisible]); - const redirectToLogExplorer = useCallback( (dsName: string, dsType: string) => { return application.navigateToUrl( @@ -89,7 +86,7 @@ export const Sidebar: FC = ({ children }) => { const getRedirectModal = useCallback( (dsName: string, dsType: string) => { return ( - + setModalContent(null)}>

@@ -109,7 +106,7 @@ export const Sidebar: FC = ({ children }) => { - + setModalContent(null)}> {i18n.translate( 'dataExplorer.sidebar.LogExplorerRedirectionModalFooterCancelButtonTxt', { @@ -131,15 +128,15 @@ export const Sidebar: FC = ({ children }) => { ); }, - [closeModal, redirectToLogExplorer] + [redirectToLogExplorer] ); const showModal = useCallback( (dsName: string, dsType: string) => { setModalContent(getRedirectModal(dsName, dsType)); - setIsModalVisible(true); + // setIsModalVisible(true); }, - [setModalContent, setIsModalVisible, getRedirectModal] + [setModalContent, getRedirectModal] ); const handleSourceSelection = useCallback( @@ -200,7 +197,7 @@ export const Sidebar: FC = ({ children }) => { {children} - {isModalVisible && modalContent} + {modalContent} ); From 40b1a940d08bfa827991f4b8ad90254cfb7f706c Mon Sep 17 00:00:00 2001 From: Eric Date: Tue, 6 Feb 2024 22:53:31 +0000 Subject: [PATCH 07/17] remove one comment Signed-off-by: Eric --- src/plugins/data_explorer/public/components/sidebar/index.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/plugins/data_explorer/public/components/sidebar/index.tsx b/src/plugins/data_explorer/public/components/sidebar/index.tsx index 2469b3427ed..a7cd10677d5 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.tsx @@ -134,7 +134,6 @@ export const Sidebar: FC = ({ children }) => { const showModal = useCallback( (dsName: string, dsType: string) => { setModalContent(getRedirectModal(dsName, dsType)); - // setIsModalVisible(true); }, [setModalContent, getRedirectModal] ); From ac67245fc7a4a48132a3e3ad28b545520f319617 Mon Sep 17 00:00:00 2001 From: Eric Date: Thu, 8 Feb 2024 01:02:41 +0000 Subject: [PATCH 08/17] add i18n Signed-off-by: Eric --- .../datasource_selectable.tsx | 19 +++++++++++++++---- .../public/components/sidebar/index.tsx | 4 +++- 2 files changed, 18 insertions(+), 5 deletions(-) diff --git a/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx b/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx index 7bb64b6038e..7c61022dda3 100644 --- a/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx +++ b/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx @@ -17,10 +17,17 @@ import { type DataSourceTypeKey = 'DEFAULT_INDEX_PATTERNS' | 's3glue' | 'spark'; // Mapping between datasource type and its display name. +// Temporary solution, will be removed along with refactoring of data source APIs const DATASOURCE_TYPE_DISPLAY_NAME_MAP: Record = { - DEFAULT_INDEX_PATTERNS: 'Index patterns', - s3glue: 'Amazon S3', - spark: 'Spark', + DEFAULT_INDEX_PATTERNS: i18n.translate('dataExplorer.dataSourceSelector.indexPatternGroupTitle', { + defaultMessage: 'Index patterns', + }), + s3glue: i18n.translate('dataExplorer.dataSourceSelector.amazonS3GroupTitle', { + defaultMessage: 'Amazon S3', + }), + spark: i18n.translate('dataExplorer.dataSourceSelector.sparkGroupTitle', { + defaultMessage: 'Spark', + }), }; type DataSetType = ISourceDataSet['data_sets'][number]; @@ -74,7 +81,11 @@ const getSourceList = ( const finalList = [] as DataSourceGroup[]; allDataSets.forEach((curDataSet) => { const typeKey = curDataSet.ds.getType() as DataSourceTypeKey; - let groupName = DATASOURCE_TYPE_DISPLAY_NAME_MAP[typeKey] || `Default Group`; + let groupName = + DATASOURCE_TYPE_DISPLAY_NAME_MAP[typeKey] || + i18n.translate('dataExplorer.dataSourceSelector.defaultGroupTitle', { + defaultMessage: 'Default Group', + }); // add '- Opens in Log Explorer' to hint user that selecting these types of data sources // will lead to redirection to log explorer diff --git a/src/plugins/data_explorer/public/components/sidebar/index.tsx b/src/plugins/data_explorer/public/components/sidebar/index.tsx index a7cd10677d5..562a8ce3c87 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.tsx @@ -24,7 +24,9 @@ import { DataExplorerServices } from '../../types'; import { setIndexPattern, useTypedDispatch, useTypedSelector } from '../../utils/state_management'; import './index.scss'; -const LOG_EXPLORER_TITLE_HINT = ' - Opens in Log Explorer'; +const LOG_EXPLORER_TITLE_HINT = i18n.translate('dataExplorer.dataSourceSelector.redirectionHint', { + defaultMessage: ' - Opens in Log Explorer', +}); const DATA_SOURCE_SELECTOR_CONFIGS = { customGroupTitleExtension: LOG_EXPLORER_TITLE_HINT }; export const Sidebar: FC = ({ children }) => { From 34861976f31d0963b73db80fc9cd288e7d736dd9 Mon Sep 17 00:00:00 2001 From: Eric Date: Fri, 9 Feb 2024 00:07:29 +0000 Subject: [PATCH 09/17] add unit tests for modal Signed-off-by: Eric --- .../components/sidebar/index.test.mock.ts | 28 ++++ .../public/components/sidebar/index.test.tsx | 126 ++++++++++++++++++ .../public/components/sidebar/index.tsx | 1 + 3 files changed, 155 insertions(+) create mode 100644 src/plugins/data_explorer/public/components/sidebar/index.test.mock.ts create mode 100644 src/plugins/data_explorer/public/components/sidebar/index.test.tsx diff --git a/src/plugins/data_explorer/public/components/sidebar/index.test.mock.ts b/src/plugins/data_explorer/public/components/sidebar/index.test.mock.ts new file mode 100644 index 00000000000..6b09d1d8425 --- /dev/null +++ b/src/plugins/data_explorer/public/components/sidebar/index.test.mock.ts @@ -0,0 +1,28 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +export class MockS3DataSource { + protected name: string; + protected type: string; + protected metadata: any; + + constructor({ name, type, metadata }: { name: string; type: string; metadata: any }) { + this.name = name; + this.type = type; + this.metadata = metadata; + } + + async getDataSet(dataSetParams?: any) { + return [this.name]; + } + + getName() { + return this.name; + } + + getType() { + return this.type; + } +} diff --git a/src/plugins/data_explorer/public/components/sidebar/index.test.tsx b/src/plugins/data_explorer/public/components/sidebar/index.test.tsx new file mode 100644 index 00000000000..b931c0c3a0e --- /dev/null +++ b/src/plugins/data_explorer/public/components/sidebar/index.test.tsx @@ -0,0 +1,126 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import React from 'react'; +import { render, fireEvent, waitFor } from '@testing-library/react'; +import { Sidebar } from './index'; // Adjust the import path as necessary +import { Provider } from 'react-redux'; +import configureMockStore from 'redux-mock-store'; +import { MockS3DataSource } from './index.test.mock'; +import { createMemoryHistory } from 'history'; +import { Router } from 'react-router-dom'; + +const mockStore = configureMockStore(); +const initialState = { + metadata: { indexPattern: 'some-index-pattern-id' }, +}; +const store = mockStore(initialState); + +jest.mock('../../../../opensearch_dashboards_react/public', () => { + return { + useOpenSearchDashboards: jest.fn().mockReturnValue({ + services: { + data: { + indexPatterns: {}, + dataSources: { + dataSourceService: { + dataSources$: { + subscribe: jest.fn((callback) => { + callback({ + 's3-prod-mock': new MockS3DataSource({ + name: 's3-prod-mock', + type: 's3glue', + metadata: {}, + }), + }); + return { unsubscribe: jest.fn() }; + }), + }, + }, + }, + }, + notifications: { + toasts: { + addError: jest.fn(), + }, + }, + application: { + navigateToUrl: jest.fn(), + }, + }, + }), + withOpenSearchDashboards: () => (Component: React.ComponentClass) => (props: any) => ( + + ), + }; +}); + +jest.mock('../../../../data_explorer/public', () => ({ + useTypedSelector: jest.fn(), + useTypedDispatch: jest.fn(), +})); + +describe('Sidebar Component', () => { + it('renders without crashing', () => { + const { container, getByTestId } = render( + + + + ); + expect(container).toBeInTheDocument(); + expect(getByTestId('dataExplorerDSSelect')).toBeInTheDocument(); + }); + + it('shows title extensions on the non-index pattern data source', () => { + const { getByText, getByTestId } = render( + + + + ); + + fireEvent.click(getByTestId('comboBoxToggleListButton')); + waitFor(() => { + expect(getByText('Open in Log Explorer')).toBeInTheDocument(); + }); + }); + + it('shows a modal when clicking a non-index pattern data source', () => { + const { getByText, getByTestId } = render( + + + + ); + + fireEvent.click(getByTestId('comboBoxToggleListButton')); + waitFor(() => { + expect(getByText('s3-prod-mock')).toBeInTheDocument(); + fireEvent.click(getByText('s3-prod-mock')); + expect(getByText('Open in Log Explorer')).toBeInTheDocument(); + expect(getByText('Cancel')).toBeInTheDocument(); + fireEvent.click(getByText('Cancel')); + expect(getByText('Open in Log Explorer')).not.toBeInTheDocument(); + }); + }); + + it('redirects to log explorer when clicking open-in-log-explorer button', () => { + const history = createMemoryHistory(); + const { getByText, getByTestId } = render( + + + + + + ); + + fireEvent.click(getByTestId('comboBoxToggleListButton')); + waitFor(() => { + expect(getByText('s3-prod-mock')).toBeInTheDocument(); + fireEvent.click(getByText('s3-prod-mock')); + fireEvent.click(getByTestId('dataExplorer__DSSModalOpenInExplorerBtn')); + expect(getByText('Open in Log Explorer')).not.toBeInTheDocument(); + expect(history.location.pathname).toContain('observability-logs#/explorer'); + }); + }); +}); diff --git a/src/plugins/data_explorer/public/components/sidebar/index.tsx b/src/plugins/data_explorer/public/components/sidebar/index.tsx index 562a8ce3c87..1b6a61b1a55 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.tsx @@ -120,6 +120,7 @@ export const Sidebar: FC = ({ children }) => { onClick={() => { redirectToLogExplorer(dsName, dsType); }} + data-test-subj="dataExplorer__dataSourceSelectorModelOpenInExplorerBtn" fill > {i18n.translate('dataExplorer.sidebar.LogExplorerRedirectionModalFooterButtonTxt', { From 9b1cc32b16359d1469e89574b5cf94e8cf4975b3 Mon Sep 17 00:00:00 2001 From: Eric Date: Fri, 9 Feb 2024 00:18:06 +0000 Subject: [PATCH 10/17] test id change Signed-off-by: Eric --- src/plugins/data_explorer/public/components/sidebar/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/plugins/data_explorer/public/components/sidebar/index.tsx b/src/plugins/data_explorer/public/components/sidebar/index.tsx index 1b6a61b1a55..dad5b0f5fbe 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.tsx @@ -120,7 +120,7 @@ export const Sidebar: FC = ({ children }) => { onClick={() => { redirectToLogExplorer(dsName, dsType); }} - data-test-subj="dataExplorer__dataSourceSelectorModelOpenInExplorerBtn" + data-test-subj="dataExplorer__DSSModalOpenInExplorerBtn" fill > {i18n.translate('dataExplorer.sidebar.LogExplorerRedirectionModalFooterButtonTxt', { From 7cdfbf0c44ce28f316bab85a3dd95bbd97483218 Mon Sep 17 00:00:00 2001 From: Eric Date: Fri, 9 Feb 2024 01:39:21 +0000 Subject: [PATCH 11/17] add devDependencies for tests Signed-off-by: Eric --- package.json | 2 ++ yarn.lock | 14 ++++++++++++++ 2 files changed, 16 insertions(+) diff --git a/package.json b/package.json index 40c9c2eab62..fa32355daf4 100644 --- a/package.json +++ b/package.json @@ -334,6 +334,7 @@ "@types/react-router-dom": "^5.3.2", "@types/react-virtualized": "^9.18.7", "@types/recompose": "^0.30.6", + "@types/redux-mock-store": "^1.0.6", "@types/selenium-webdriver": "^4.0.9", "@types/semver": "^7.5.0", "@types/sinon": "^7.0.13", @@ -451,6 +452,7 @@ "react-test-renderer": "^16.12.0", "reactcss": "1.2.3", "redux": "^4.0.5", + "redux-mock-store": "^1.5.4", "regenerate": "^1.4.0", "reselect": "^4.0.0", "resize-observer-polyfill": "^1.5.1", diff --git a/yarn.lock b/yarn.lock index 38e15ad0d51..43d08286579 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3904,6 +3904,13 @@ dependencies: "@types/react" "*" +"@types/redux-mock-store@^1.0.6": + version "1.0.6" + resolved "https://registry.yarnpkg.com/@types/redux-mock-store/-/redux-mock-store-1.0.6.tgz#0a03b2655028b7cf62670d41ac1de5ca1b1f5958" + integrity sha512-eg5RDfhJTXuoJjOMyXiJbaDb1B8tfTaJixscmu+jOusj6adGC0Krntz09Tf4gJgXeCqCrM5bBMd+B7ez0izcAQ== + dependencies: + redux "^4.0.5" + "@types/refractor@^3.0.0": version "3.0.2" resolved "https://registry.yarnpkg.com/@types/refractor/-/refractor-3.0.2.tgz#2d42128d59f78f84d2c799ffc5ab5cadbcba2d82" @@ -15472,6 +15479,13 @@ redent@^3.0.0: indent-string "^4.0.0" strip-indent "^3.0.0" +redux-mock-store@^1.5.4: + version "1.5.4" + resolved "https://registry.yarnpkg.com/redux-mock-store/-/redux-mock-store-1.5.4.tgz#90d02495fd918ddbaa96b83aef626287c9ab5872" + integrity sha512-xmcA0O/tjCLXhh9Fuiq6pMrJCwFRaouA8436zcikdIpYWWCjU76CRk+i2bHx8EeiSiMGnB85/lZdU3wIJVXHTA== + dependencies: + lodash.isplainobject "^4.0.6" + redux-thunk@^2.3.0, redux-thunk@^2.4.1: version "2.4.1" resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.4.1.tgz#0dd8042cf47868f4b29699941de03c9301a75714" From 999efa4176fd31d6828282375dfcb7286e35da12 Mon Sep 17 00:00:00 2001 From: Eric Date: Wed, 13 Mar 2024 23:38:55 +0000 Subject: [PATCH 12/17] use open confirm api and move mock file to discover mock folder Signed-off-by: Eric --- .../datasource_selectable.tsx | 20 ++-- .../data_sources/datasource_selector/types.ts | 1 - .../public/components/sidebar/index.test.tsx | 6 +- .../public/components/sidebar/index.tsx | 112 ++++++------------ .../public/__mock__}/index.test.mock.ts | 0 5 files changed, 51 insertions(+), 88 deletions(-) rename src/plugins/{data_explorer/public/components/sidebar => discover/public/__mock__}/index.test.mock.ts (100%) diff --git a/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx b/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx index 7c61022dda3..2aaa023de32 100644 --- a/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx +++ b/src/plugins/data/public/data_sources/datasource_selector/datasource_selectable.tsx @@ -8,11 +8,7 @@ import { EuiComboBox } from '@elastic/eui'; import { i18n } from '@osd/i18n'; import { ISourceDataSet, IndexPatternOption } from '../datasource'; import { DataSourceType, GenericDataSource } from '../datasource_services'; -import { - DataSourceGroup, - DataSourceSelectableProps, - DataSourceSelectorConfigurations, -} from './types'; +import { DataSourceGroup, DataSourceSelectableProps } from './types'; type DataSourceTypeKey = 'DEFAULT_INDEX_PATTERNS' | 's3glue' | 'spark'; @@ -74,10 +70,7 @@ export const getSourceOptions = (dataSource: DataSourceType, dataSet: DataSetTyp }; // Convert data sets into a structured format suitable for selector rendering. -const getSourceList = ( - allDataSets: ISourceDataSet[], - dataSourceSelectorConfigs: DataSourceSelectorConfigurations -) => { +const getSourceList = (allDataSets: ISourceDataSet[]) => { const finalList = [] as DataSourceGroup[]; allDataSets.forEach((curDataSet) => { const typeKey = curDataSet.ds.getType() as DataSourceTypeKey; @@ -90,7 +83,9 @@ const getSourceList = ( // add '- Opens in Log Explorer' to hint user that selecting these types of data sources // will lead to redirection to log explorer if (typeKey !== 'DEFAULT_INDEX_PATTERNS') { - groupName = `${groupName}${dataSourceSelectorConfigs.customGroupTitleExtension || ''}`; + groupName = `${groupName}${i18n.translate('dataExplorer.dataSourceSelector.redirectionHint', { + defaultMessage: ' - Opens in Log Explorer', + })}`; } const existingGroup = finalList.find((item) => item.label === groupName); @@ -128,17 +123,16 @@ export const DataSourceSelectable = ({ setDataSourceOptionList, onGetDataSetError, // onGetDataSetError, Callback for handling get data set errors. Ensure it's memoized. singleSelection = { asPlainText: true }, - dataSourceSelectorConfigs, ...comboBoxProps }: DataSourceSelectableProps) => { // This effect gets data sets and prepares the datasource list for UI rendering. useEffect(() => { Promise.all(getDataSets(dataSources)) .then((results) => { - setDataSourceOptionList(getSourceList(results, dataSourceSelectorConfigs)); + setDataSourceOptionList(getSourceList(results)); }) .catch((e) => onGetDataSetError(e)); - }, [dataSources, setDataSourceOptionList, onGetDataSetError, dataSourceSelectorConfigs]); + }, [dataSources, setDataSourceOptionList, onGetDataSetError]); const handleSourceChange = useCallback( (selectedOptions: any) => onDataSourceSelect(selectedOptions), diff --git a/src/plugins/data/public/data_sources/datasource_selector/types.ts b/src/plugins/data/public/data_sources/datasource_selector/types.ts index d3b93c6ae16..b2fc05c42c7 100644 --- a/src/plugins/data/public/data_sources/datasource_selector/types.ts +++ b/src/plugins/data/public/data_sources/datasource_selector/types.ts @@ -30,7 +30,6 @@ export interface DataSourceSelectableProps extends Pick void; - dataSourceSelectorConfigs: DataSourceSelectorConfigurations; } export interface DataSourceSelectorConfigurations { diff --git a/src/plugins/data_explorer/public/components/sidebar/index.test.tsx b/src/plugins/data_explorer/public/components/sidebar/index.test.tsx index b931c0c3a0e..220c9ae45ef 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.test.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.test.tsx @@ -8,7 +8,7 @@ import { render, fireEvent, waitFor } from '@testing-library/react'; import { Sidebar } from './index'; // Adjust the import path as necessary import { Provider } from 'react-redux'; import configureMockStore from 'redux-mock-store'; -import { MockS3DataSource } from './index.test.mock'; +import { MockS3DataSource } from '../../../../discover/public/__mock__/index.test.mock'; import { createMemoryHistory } from 'history'; import { Router } from 'react-router-dom'; @@ -20,6 +20,7 @@ const store = mockStore(initialState); jest.mock('../../../../opensearch_dashboards_react/public', () => { return { + toMountPoint: jest.fn().mockImplementation((component) => () => component), useOpenSearchDashboards: jest.fn().mockReturnValue({ services: { data: { @@ -49,6 +50,9 @@ jest.mock('../../../../opensearch_dashboards_react/public', () => { application: { navigateToUrl: jest.fn(), }, + overlays: { + openConfirm: jest.fn(), + }, }, }), withOpenSearchDashboards: () => (Component: React.ComponentClass) => (props: any) => ( diff --git a/src/plugins/data_explorer/public/components/sidebar/index.tsx b/src/plugins/data_explorer/public/components/sidebar/index.tsx index dad5b0f5fbe..3e08590be0f 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.tsx @@ -4,44 +4,31 @@ */ import React, { FC, useCallback, useEffect, useState } from 'react'; -import { - EuiPageSideBar, - EuiSplitPanel, - EuiModal, - EuiModalHeader, - EuiModalBody, - EuiModalHeaderTitle, - EuiModalFooter, - EuiButtonEmpty, - EuiButton, - EuiText, -} from '@elastic/eui'; +import { EuiPageSideBar, EuiSplitPanel, EuiText } from '@elastic/eui'; import { i18n } from '@osd/i18n'; import { DataSourceGroup, DataSourceSelectable, DataSourceType } from '../../../../data/public'; import { DataSourceOption } from '../../../../data/public/'; -import { useOpenSearchDashboards } from '../../../../opensearch_dashboards_react/public'; +import { + toMountPoint, + useOpenSearchDashboards, +} from '../../../../opensearch_dashboards_react/public'; import { DataExplorerServices } from '../../types'; import { setIndexPattern, useTypedDispatch, useTypedSelector } from '../../utils/state_management'; import './index.scss'; -const LOG_EXPLORER_TITLE_HINT = i18n.translate('dataExplorer.dataSourceSelector.redirectionHint', { - defaultMessage: ' - Opens in Log Explorer', -}); -const DATA_SOURCE_SELECTOR_CONFIGS = { customGroupTitleExtension: LOG_EXPLORER_TITLE_HINT }; - export const Sidebar: FC = ({ children }) => { const { indexPattern: indexPatternId } = useTypedSelector((state) => state.metadata); const dispatch = useTypedDispatch(); const [selectedSources, setSelectedSources] = useState([]); const [dataSourceOptionList, setDataSourceOptionList] = useState([]); const [activeDataSources, setActiveDataSources] = useState([]); - const [modalContent, setModalContent] = useState(null); const { services: { data: { indexPatterns, dataSources }, notifications: { toasts }, application, + overlays, }, } = useOpenSearchDashboards(); @@ -85,60 +72,41 @@ export const Sidebar: FC = ({ children }) => { [application] ); - const getRedirectModal = useCallback( - (dsName: string, dsType: string) => { - return ( - setModalContent(null)}> - - -

- {i18n.translate('dataExplorer.sidebar.LogExplorerRedirectionModalTitle', { - defaultMessage: 'Open in Log Explorer', - })} -

- - - - - {i18n.translate('dataExplorer.sidebar.LogExplorerRedirectionModalMessage', { - defaultMessage: - 'Selecting this data source will open the Log Explorer application, where you can query \ - data using PPL/SQL.', - })} - - - - setModalContent(null)}> - {i18n.translate( - 'dataExplorer.sidebar.LogExplorerRedirectionModalFooterCancelButtonTxt', - { - defaultMessage: 'Cancel', - } - )} - - { - redirectToLogExplorer(dsName, dsType); - }} - data-test-subj="dataExplorer__DSSModalOpenInExplorerBtn" - fill - > - {i18n.translate('dataExplorer.sidebar.LogExplorerRedirectionModalFooterButtonTxt', { - defaultMessage: 'Open in Log Explorer ', - })} - - - - ); - }, - [redirectToLogExplorer] - ); - const showModal = useCallback( - (dsName: string, dsType: string) => { - setModalContent(getRedirectModal(dsName, dsType)); + async (dsName: string, dsType: string) => { + const confirmed = await overlays.openConfirm( + toMountPoint( + + {i18n.translate('dataExplorer.sidebar.LogExplorerRedirectionModalMessage', { + defaultMessage: + 'Selecting this data source will open the Log Explorer application, where you can query \ + data using PPL/SQL.', + })} + + ), + { + title: i18n.translate('dataExplorer.sidebar.LogExplorerRedirectionModalTitle', { + defaultMessage: 'Open in Log Explorer', + }), + cancelButtonText: i18n.translate( + 'dataExplorer.sidebar.LogExplorerRedirectionModalFooterCancelButtonTxt', + { + defaultMessage: 'Cancel', + } + ), + confirmButtonText: i18n.translate( + 'dataExplorer.sidebar.LogExplorerRedirectionModalFooterButtonTxt', + { + defaultMessage: 'Open in Log Explorer ', + } + ), + } + ); + if (confirmed) { + redirectToLogExplorer(dsName, dsType); + } }, - [setModalContent, getRedirectModal] + [overlays, redirectToLogExplorer] ); const handleSourceSelection = useCallback( @@ -192,14 +160,12 @@ export const Sidebar: FC = ({ children }) => { onDataSourceSelect={handleSourceSelection} selectedSources={selectedSources} onGetDataSetError={handleGetDataSetError} - dataSourceSelectorConfigs={DATA_SOURCE_SELECTOR_CONFIGS} fullWidth /> {children} - {modalContent} ); diff --git a/src/plugins/data_explorer/public/components/sidebar/index.test.mock.ts b/src/plugins/discover/public/__mock__/index.test.mock.ts similarity index 100% rename from src/plugins/data_explorer/public/components/sidebar/index.test.mock.ts rename to src/plugins/discover/public/__mock__/index.test.mock.ts From f83b1a1f0290474cf6e36ea35e2727544be1e245 Mon Sep 17 00:00:00 2001 From: Eric Date: Wed, 13 Mar 2024 23:49:28 +0000 Subject: [PATCH 13/17] remove unused type Signed-off-by: Eric --- .../data/public/data_sources/datasource_selector/types.ts | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/plugins/data/public/data_sources/datasource_selector/types.ts b/src/plugins/data/public/data_sources/datasource_selector/types.ts index b2fc05c42c7..0fa1bf21cb1 100644 --- a/src/plugins/data/public/data_sources/datasource_selector/types.ts +++ b/src/plugins/data/public/data_sources/datasource_selector/types.ts @@ -31,7 +31,3 @@ export interface DataSourceSelectableProps extends Pick void; } - -export interface DataSourceSelectorConfigurations { - customGroupTitleExtension: string; -} From cfeeb620fc8e89b9ea0df090341ac0d562d7d580 Mon Sep 17 00:00:00 2001 From: Eric Date: Fri, 15 Mar 2024 21:06:45 +0000 Subject: [PATCH 14/17] remove modal for log explorer redirection Signed-off-by: Eric --- .../public/components/sidebar/index.tsx | 49 ++----------------- 1 file changed, 4 insertions(+), 45 deletions(-) diff --git a/src/plugins/data_explorer/public/components/sidebar/index.tsx b/src/plugins/data_explorer/public/components/sidebar/index.tsx index 3e08590be0f..ff07a59ab4b 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.tsx @@ -4,14 +4,11 @@ */ import React, { FC, useCallback, useEffect, useState } from 'react'; -import { EuiPageSideBar, EuiSplitPanel, EuiText } from '@elastic/eui'; +import { EuiPageSideBar, EuiSplitPanel } from '@elastic/eui'; import { i18n } from '@osd/i18n'; import { DataSourceGroup, DataSourceSelectable, DataSourceType } from '../../../../data/public'; import { DataSourceOption } from '../../../../data/public/'; -import { - toMountPoint, - useOpenSearchDashboards, -} from '../../../../opensearch_dashboards_react/public'; +import { useOpenSearchDashboards } from '../../../../opensearch_dashboards_react/public'; import { DataExplorerServices } from '../../types'; import { setIndexPattern, useTypedDispatch, useTypedSelector } from '../../utils/state_management'; import './index.scss'; @@ -28,7 +25,6 @@ export const Sidebar: FC = ({ children }) => { data: { indexPatterns, dataSources }, notifications: { toasts }, application, - overlays, }, } = useOpenSearchDashboards(); @@ -72,43 +68,6 @@ export const Sidebar: FC = ({ children }) => { [application] ); - const showModal = useCallback( - async (dsName: string, dsType: string) => { - const confirmed = await overlays.openConfirm( - toMountPoint( - - {i18n.translate('dataExplorer.sidebar.LogExplorerRedirectionModalMessage', { - defaultMessage: - 'Selecting this data source will open the Log Explorer application, where you can query \ - data using PPL/SQL.', - })} - - ), - { - title: i18n.translate('dataExplorer.sidebar.LogExplorerRedirectionModalTitle', { - defaultMessage: 'Open in Log Explorer', - }), - cancelButtonText: i18n.translate( - 'dataExplorer.sidebar.LogExplorerRedirectionModalFooterCancelButtonTxt', - { - defaultMessage: 'Cancel', - } - ), - confirmButtonText: i18n.translate( - 'dataExplorer.sidebar.LogExplorerRedirectionModalFooterButtonTxt', - { - defaultMessage: 'Open in Log Explorer ', - } - ), - } - ); - if (confirmed) { - redirectToLogExplorer(dsName, dsType); - } - }, - [overlays, redirectToLogExplorer] - ); - const handleSourceSelection = useCallback( (selectedDataSources: DataSourceOption[]) => { if (selectedDataSources.length === 0) { @@ -118,13 +77,13 @@ export const Sidebar: FC = ({ children }) => { // Temporary redirection solution for 2.11, where clicking non-index-pattern data sources // will prompt users with modal explaining they are being redirected to Observability log explorer if (selectedDataSources[0]?.ds?.getType() !== 'DEFAULT_INDEX_PATTERNS') { - showModal(selectedDataSources[0].label, selectedDataSources[0].type); + redirectToLogExplorer(selectedDataSources[0].label, selectedDataSources[0].type); return; } setSelectedSources(selectedDataSources); dispatch(setIndexPattern(selectedDataSources[0].value)); }, - [dispatch, showModal, setSelectedSources] + [dispatch, redirectToLogExplorer, setSelectedSources] ); const handleGetDataSetError = useCallback( From 3295dc02115f48e1d28f6ee8a7fc647e38d02993 Mon Sep 17 00:00:00 2001 From: Eric Date: Fri, 15 Mar 2024 21:09:24 +0000 Subject: [PATCH 15/17] modify changelog Signed-off-by: Eric --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index dc67b013bef..5b236208891 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -113,7 +113,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/) - [Discover] Enhanced the data source selector with added sorting functionality ([#5609](https://github.com/opensearch-project/OpenSearch-Dashboards/issues/5609)) - [Multiple Datasource] Add datasource picker component and use it in devtools and tutorial page when multiple datasource is enabled ([#5756](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/5756)) - [Multiple Datasource] Add datasource picker to import saved object flyout when multiple data source is enabled ([#5781](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/5781)) -- [Discover] Add extension group title to non-index data source groups and present a modal to users upon selecting non-index pattern data sources. ([#5815](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/5815)) +- [Discover] Add extension group title to non-index data source groups to indicate log explorer redirection in discover data source selector. ([#5815](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/5815)) ### 🐛 Bug Fixes From 8be8a1c837c48ecf0697921f0cd16946faccecf3 Mon Sep 17 00:00:00 2001 From: Eric Date: Fri, 15 Mar 2024 21:11:49 +0000 Subject: [PATCH 16/17] remove modal test Signed-off-by: Eric --- .../public/components/sidebar/index.test.tsx | 18 ------------------ 1 file changed, 18 deletions(-) diff --git a/src/plugins/data_explorer/public/components/sidebar/index.test.tsx b/src/plugins/data_explorer/public/components/sidebar/index.test.tsx index 220c9ae45ef..63811a5fd3e 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.test.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.test.tsx @@ -90,24 +90,6 @@ describe('Sidebar Component', () => { }); }); - it('shows a modal when clicking a non-index pattern data source', () => { - const { getByText, getByTestId } = render( - - - - ); - - fireEvent.click(getByTestId('comboBoxToggleListButton')); - waitFor(() => { - expect(getByText('s3-prod-mock')).toBeInTheDocument(); - fireEvent.click(getByText('s3-prod-mock')); - expect(getByText('Open in Log Explorer')).toBeInTheDocument(); - expect(getByText('Cancel')).toBeInTheDocument(); - fireEvent.click(getByText('Cancel')); - expect(getByText('Open in Log Explorer')).not.toBeInTheDocument(); - }); - }); - it('redirects to log explorer when clicking open-in-log-explorer button', () => { const history = createMemoryHistory(); const { getByText, getByTestId } = render( From 1dc902f176038da01ff8b4336a331eb6d44e2ad2 Mon Sep 17 00:00:00 2001 From: Eric Date: Mon, 18 Mar 2024 18:01:10 +0000 Subject: [PATCH 17/17] remove one modal related test Signed-off-by: Eric --- .../data_explorer/public/components/sidebar/index.test.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/plugins/data_explorer/public/components/sidebar/index.test.tsx b/src/plugins/data_explorer/public/components/sidebar/index.test.tsx index 63811a5fd3e..eccb0ffa909 100644 --- a/src/plugins/data_explorer/public/components/sidebar/index.test.tsx +++ b/src/plugins/data_explorer/public/components/sidebar/index.test.tsx @@ -104,8 +104,6 @@ describe('Sidebar Component', () => { waitFor(() => { expect(getByText('s3-prod-mock')).toBeInTheDocument(); fireEvent.click(getByText('s3-prod-mock')); - fireEvent.click(getByTestId('dataExplorer__DSSModalOpenInExplorerBtn')); - expect(getByText('Open in Log Explorer')).not.toBeInTheDocument(); expect(history.location.pathname).toContain('observability-logs#/explorer'); }); });