-
Notifications
You must be signed in to change notification settings - Fork 882
/
top_nav.tsx
68 lines (60 loc) · 1.99 KB
/
top_nav.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
/*
* Copyright OpenSearch Contributors
* SPDX-License-Identifier: Apache-2.0
*/
import React, { useMemo } from 'react';
import { useParams } from 'react-router-dom';
import { PLUGIN_ID } from '../../../common';
import { useOpenSearchDashboards } from '../../../../opensearch_dashboards_react/public';
import { getTopNavConfig } from '../utils/get_top_nav_config';
import { WizardServices } from '../../types';
import './top_nav.scss';
import { useIndexPattern } from '../utils/use';
import { useTypedSelector } from '../utils/state_management';
import { useSavedWizardVis } from '../utils/use/use_saved_wizard_vis';
export const TopNav = () => {
// id will only be set for the edit route
const { id: visualizationIdFromUrl } = useParams<{ id: string }>();
const { services } = useOpenSearchDashboards<WizardServices>();
const {
setHeaderActionMenu,
navigation: {
ui: { TopNavMenu },
},
} = services;
const rootState = useTypedSelector((state) => state);
const hasUnappliedChanges = useTypedSelector(
(state) => !!state.visualization.activeVisualization?.draftAgg
);
const savedWizardVis = useSavedWizardVis(services, visualizationIdFromUrl);
const config = useMemo(() => {
if (savedWizardVis === undefined) {
return;
}
const { visualization: visualizationState, style: styleState } = rootState;
return getTopNavConfig(
{
visualizationIdFromUrl,
savedWizardVis,
visualizationState,
styleState,
hasUnappliedChanges,
},
services
);
}, [hasUnappliedChanges, rootState, savedWizardVis, services, visualizationIdFromUrl]);
const indexPattern = useIndexPattern();
return (
<div className="wizTopNav">
<TopNavMenu
appName={PLUGIN_ID}
config={config}
setMenuMountPoint={setHeaderActionMenu}
showSearchBar={true}
useDefaultBehaviors={true}
screenTitle="Test"
indexPatterns={indexPattern ? [indexPattern] : []}
/>
</div>
);
};