forked from opensearch-project/OpenSearch-Dashboards
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Signed-off-by: Ashwin P Chandran <ashwinpc@amazon.com>
- Loading branch information
Showing
16 changed files
with
435 additions
and
67 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
102 changes: 102 additions & 0 deletions
102
src/plugins/data_explorer/public/components/sidebar/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,102 @@ | ||
/* | ||
* Copyright OpenSearch Contributors | ||
* SPDX-License-Identifier: Apache-2.0 | ||
*/ | ||
|
||
import React, { useMemo, FC, useEffect, useState } from 'react'; | ||
import { i18n } from '@osd/i18n'; | ||
import { | ||
EuiPanel, | ||
EuiComboBox, | ||
EuiSelect, | ||
EuiSelectOption, | ||
EuiComboBoxOptionOption, | ||
} from '@elastic/eui'; | ||
import { useOpenSearchDashboards } from '../../../../opensearch_dashboards_react/public'; | ||
import { useView } from '../../utils/use'; | ||
import { DataExplorerServices } from '../../types'; | ||
import { useTypedDispatch, useTypedSelector, setIndexPattern } from '../../utils/state_management'; | ||
|
||
export const Sidebar: FC = ({ children }) => { | ||
const { indexPattern: indexPatternId } = useTypedSelector((state) => state.metadata); | ||
const dispatch = useTypedDispatch(); | ||
const [options, setOptions] = useState<Array<EuiComboBoxOptionOption<string>>>([]); | ||
const [selectedOption, setSelectedOption] = useState<EuiComboBoxOptionOption<string>>(); | ||
const { view, viewRegistry } = useView(); | ||
const views = viewRegistry.all(); | ||
const viewOptions: EuiSelectOption[] = useMemo( | ||
() => | ||
views.map(({ id, title }) => ({ | ||
value: id, | ||
text: title, | ||
})), | ||
[views] | ||
); | ||
|
||
const { | ||
services: { | ||
data: { indexPatterns }, | ||
notifications: { toasts }, | ||
}, | ||
} = useOpenSearchDashboards<DataExplorerServices>(); | ||
|
||
useEffect(() => { | ||
const fetchIndexPatterns = async () => { | ||
await indexPatterns.ensureDefaultIndexPattern(); | ||
const cache = await indexPatterns.getCache(); | ||
const currentOptions = (cache || []).map((indexPattern) => ({ | ||
label: indexPattern.attributes.title, | ||
value: indexPattern.id, | ||
})); | ||
setOptions(currentOptions); | ||
}; | ||
fetchIndexPatterns(); | ||
}, [indexPatterns]); | ||
|
||
// Set option to the current index pattern | ||
useEffect(() => { | ||
if (indexPatternId) { | ||
const option = options.find((o) => o.value === indexPatternId); | ||
setSelectedOption(option); | ||
} | ||
}, [indexPatternId, options]); | ||
|
||
return ( | ||
<> | ||
<EuiPanel borderRadius="none" hasShadow={false}> | ||
<EuiComboBox | ||
placeholder="Select a datasource" | ||
singleSelection={{ asPlainText: true }} | ||
options={options} | ||
selectedOptions={selectedOption ? [selectedOption] : []} | ||
onChange={(selected) => { | ||
// TODO: There are many issues with this approach, but it's a start | ||
// 1. Combo box can delete a selected index pattern. This should not be possible | ||
// 2. Combo box is severely truncated. This should be fixed in the EUI component | ||
// 3. The onchange can fire with a option that is not valid. discuss where to handle this. | ||
// 4. value is optional. If the combobox needs to act as a slecet, this should be required. | ||
const { value } = selected[0] || {}; | ||
|
||
if (!value) { | ||
toasts.addWarning({ | ||
id: 'index-pattern-not-found', | ||
title: i18n.translate('dataExplorer.indexPatternError', { | ||
defaultMessage: 'Index pattern not found', | ||
}), | ||
}); | ||
return; | ||
} | ||
|
||
dispatch( | ||
setIndexPattern({ | ||
state: value, | ||
}) | ||
); | ||
}} | ||
/> | ||
<EuiSelect options={viewOptions} value={view?.id} /> | ||
</EuiPanel> | ||
{children} | ||
</> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,35 @@ | ||
/* | ||
* Copyright OpenSearch Contributors | ||
* SPDX-License-Identifier: Apache-2.0 | ||
*/ | ||
|
||
import { ScopedHistory } from '../../../../core/public'; | ||
import { coreMock, scopedHistoryMock } from '../../../../core/public/mocks'; | ||
import { dataPluginMock } from '../../../data/public/mocks'; | ||
import { embeddablePluginMock } from '../../../embeddable/public/mocks'; | ||
import { expressionsPluginMock } from '../../../expressions/public/mocks'; | ||
import { createOsdUrlStateStorage } from '../../../opensearch_dashboards_utils/public'; | ||
import { DataExplorerServices } from '../types'; | ||
|
||
export const createDataExplorerServicesMock = () => { | ||
const coreStartMock = coreMock.createStart(); | ||
const dataMock = dataPluginMock.createStartContract(); | ||
const embeddableMock = embeddablePluginMock.createStartContract(); | ||
const expressionMock = expressionsPluginMock.createStartContract(); | ||
const osdUrlStateStorageMock = createOsdUrlStateStorage({ useHash: false }); | ||
|
||
const dataExplorerServicesMock: DataExplorerServices = { | ||
...coreStartMock, | ||
expressions: expressionMock, | ||
data: dataMock, | ||
osdUrlStateStorage: osdUrlStateStorageMock, | ||
embeddable: embeddableMock, | ||
scopedHistory: (scopedHistoryMock.create() as unknown) as ScopedHistory, | ||
viewRegistry: { | ||
get: jest.fn(), | ||
all: jest.fn(), | ||
}, | ||
}; | ||
|
||
return (dataExplorerServicesMock as unknown) as jest.Mocked<DataExplorerServices>; | ||
}; |
11 changes: 11 additions & 0 deletions
11
src/plugins/data_explorer/public/utils/state_management/hooks.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
/* | ||
* Copyright OpenSearch Contributors | ||
* SPDX-License-Identifier: Apache-2.0 | ||
*/ | ||
|
||
import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux'; | ||
import type { RootState, AppDispatch } from './store'; | ||
|
||
// Use throughout the app instead of plain `useDispatch` and `useSelector` | ||
export const useTypedDispatch = () => useDispatch<AppDispatch>(); | ||
export const useTypedSelector: TypedUseSelectorHook<RootState> = useSelector; |
7 changes: 7 additions & 0 deletions
7
src/plugins/data_explorer/public/utils/state_management/index.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
/* | ||
* Copyright OpenSearch Contributors | ||
* SPDX-License-Identifier: Apache-2.0 | ||
*/ | ||
|
||
export * from './store'; | ||
export * from './hooks'; |
Oops, something went wrong.