[Discover] Remove Options of top navigation (#159087)

This commit removes Discover's top menu `Options` entry.
This commit is contained in:
Matthias Wilhelm 2023-06-07 22:00:36 +02:00 committed by GitHub
parent cb09e8c448
commit badc116729
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 5 additions and 281 deletions

View file

@ -13,7 +13,7 @@ import { DiscoverTopNav, DiscoverTopNavProps } from './discover_topnav';
import { TopNavMenu, TopNavMenuData } from '@kbn/navigation-plugin/public';
import { Query } from '@kbn/es-query';
import { setHeaderActionMenuMounter } from '../../../../kibana_services';
import { discoverServiceMock } from '../../../../__mocks__/services';
import { discoverServiceMock as mockDiscoverService } from '../../../../__mocks__/services';
import { getDiscoverStateMock } from '../../../../__mocks__/discover_state.mock';
import { DiscoverMainProvider } from '../../services/discover_state_provider';
@ -22,12 +22,12 @@ setHeaderActionMenuMounter(jest.fn());
jest.mock('@kbn/kibana-react-plugin/public', () => ({
...jest.requireActual('@kbn/kibana-react-plugin/public'),
useKibana: () => ({
services: jest.requireActual('../../../../__mocks__/services').discoverServiceMock,
services: mockDiscoverService,
}),
}));
function getProps(savePermissions = true): DiscoverTopNavProps {
discoverServiceMock.capabilities.discover!.save = savePermissions;
mockDiscoverService.capabilities.discover!.save = savePermissions;
const stateContainer = getDiscoverStateMock({ isTimeBased: true });
stateContainer.internalState.transitions.setDataView(dataViewMock);
@ -53,7 +53,7 @@ describe('Discover topnav component', () => {
);
const topNavMenu = component.find(TopNavMenu);
const topMenuConfig = topNavMenu.props().config?.map((obj: TopNavMenuData) => obj.id);
expect(topMenuConfig).toEqual(['options', 'new', 'open', 'share', 'inspect', 'save']);
expect(topMenuConfig).toEqual(['new', 'open', 'share', 'inspect', 'save']);
});
test('generated config of TopNavMenu config is correct when no discover save permissions are assigned', () => {
@ -65,6 +65,6 @@ describe('Discover topnav component', () => {
);
const topNavMenu = component.find(TopNavMenu).props();
const topMenuConfig = topNavMenu.config?.map((obj: TopNavMenuData) => obj.id);
expect(topMenuConfig).toEqual(['options', 'new', 'open', 'share', 'inspect']);
expect(topMenuConfig).toEqual(['new', 'open', 'share', 'inspect']);
});
});

View file

@ -16,9 +16,6 @@ const services = {
discover: {
save: true,
},
advancedSettings: {
save: true,
},
},
} as unknown as DiscoverServices;
@ -36,13 +33,6 @@ test('getTopNavLinks result', () => {
});
expect(topNavLinks).toMatchInlineSnapshot(`
Array [
Object {
"description": "Options",
"id": "options",
"label": "Options",
"run": [Function],
"testId": "discoverOptionsButton",
},
Object {
"description": "New Search",
"id": "new",
@ -96,13 +86,6 @@ test('getTopNavLinks result for sql mode', () => {
});
expect(topNavLinks).toMatchInlineSnapshot(`
Array [
Object {
"description": "Options",
"id": "options",
"label": "Options",
"run": [Function],
"testId": "discoverOptionsButton",
},
Object {
"description": "New Search",
"id": "new",

View file

@ -15,7 +15,6 @@ import { getSharingData, showPublicUrlSwitch } from '../../../../utils/get_shari
import { DiscoverServices } from '../../../../build_services';
import { onSaveSearch } from './on_save_search';
import { DiscoverStateContainer } from '../../services/discover_state';
import { openOptionsPopover } from './open_options_popover';
import { openAlertsPopover } from './open_alerts_popover';
/**
@ -38,24 +37,6 @@ export const getTopNavLinks = ({
isPlainRecord: boolean;
adHocDataViews: DataView[];
}): TopNavMenuData[] => {
const options = {
id: 'options',
label: i18n.translate('discover.localMenu.localMenu.optionsTitle', {
defaultMessage: 'Options',
}),
description: i18n.translate('discover.localMenu.optionsDescription', {
defaultMessage: 'Options',
}),
run: (anchorElement: HTMLElement) =>
openOptionsPopover({
I18nContext: services.core.i18n.Context,
anchorElement,
theme$: services.core.theme.theme$,
services,
}),
testId: 'discoverOptionsButton',
};
const alerts = {
id: 'alerts',
label: i18n.translate('discover.localMenu.localMenu.alertsTitle', {
@ -225,7 +206,6 @@ export const getTopNavLinks = ({
};
return [
...(services.capabilities.advancedSettings.save ? [options] : []),
newSearch,
openSearch,
shareSearch,

View file

@ -1,5 +0,0 @@
$dscOptionsPopoverWidth: $euiSizeL * 14;
.dscOptionsPopover {
width: $dscOptionsPopoverWidth;
}

View file

@ -1,38 +0,0 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/
import React from 'react';
import { mountWithIntl } from '@kbn/test-jest-helpers';
import { findTestSubject } from '@elastic/eui/lib/test';
import { OptionsPopover } from './open_options_popover';
import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public';
test('should display the correct text if datagrid is selected', () => {
const element = document.createElement('div');
const component = mountWithIntl(
<KibanaContextProvider
services={{ addBasePath: () => '', core: { uiSettings: { get: () => false } } }}
>
<OptionsPopover onClose={jest.fn()} anchorElement={element} />
</KibanaContextProvider>
);
expect(findTestSubject(component, 'docTableMode').text()).toBe('Document Explorer');
});
test('should display the correct text if legacy table is selected', () => {
const element = document.createElement('div');
const component = mountWithIntl(
<KibanaContextProvider
services={{ addBasePath: () => '', core: { uiSettings: { get: () => true } } }}
>
<OptionsPopover onClose={jest.fn()} anchorElement={element} />
</KibanaContextProvider>
);
expect(findTestSubject(component, 'docTableMode').text()).toBe('Classic');
});

View file

@ -1,163 +0,0 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/
import React, { useCallback } from 'react';
import ReactDOM from 'react-dom';
import { CoreTheme, I18nStart } from '@kbn/core/public';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n-react';
import {
EuiSpacer,
EuiButton,
EuiText,
EuiWrappingPopover,
EuiCode,
EuiHorizontalRule,
EuiButtonEmpty,
EuiTextAlign,
} from '@elastic/eui';
import './open_options_popover.scss';
import { Observable } from 'rxjs';
import { KibanaContextProvider, KibanaThemeProvider } from '@kbn/kibana-react-plugin/public';
import { useDiscoverServices } from '../../../../hooks/use_discover_services';
import { DiscoverServices } from '../../../../build_services';
import { DOC_TABLE_LEGACY } from '../../../../../common';
const container = document.createElement('div');
let isOpen = false;
interface OptionsPopoverProps {
onClose: () => void;
anchorElement: HTMLElement;
}
export function OptionsPopover(props: OptionsPopoverProps) {
const {
core: { uiSettings },
addBasePath,
} = useDiscoverServices();
const isLegacy = uiSettings.get(DOC_TABLE_LEGACY);
const mode = isLegacy
? i18n.translate('discover.openOptionsPopover.classicDiscoverText', {
defaultMessage: 'Classic',
})
: i18n.translate('discover.openOptionsPopover.documentExplorerText', {
defaultMessage: 'Document Explorer',
});
const { anchorElement, onClose: originalOnClose } = props;
const closePopover = useCallback(() => {
originalOnClose();
anchorElement?.focus();
}, [anchorElement, originalOnClose]);
return (
<EuiWrappingPopover ownFocus button={props.anchorElement} closePopover={closePopover} isOpen>
<div className="dscOptionsPopover">
<EuiText color="subdued" size="s">
<p>
<FormattedMessage
id="discover.topNav.optionsPopover.currentViewMode"
defaultMessage="{viewModeLabel}: {currentViewMode}"
values={{
viewModeLabel: (
<strong>
<FormattedMessage
id="discover.topNav.optionsPopover.discoverViewModeLabel"
defaultMessage="Discover view mode"
/>
</strong>
),
currentViewMode: <EuiCode data-test-subj="docTableMode">{mode}</EuiCode>,
}}
/>
</p>
</EuiText>
<EuiSpacer size="s" />
<EuiText color="subdued" size="s">
{isLegacy ? (
<FormattedMessage
id="discover.topNav.openOptionsPopover.documentExplorerDisabledHint"
defaultMessage="Did you know Discover has a new Document Explorer with better data sorting, resizable columns,
and a full screen view? You can change the view mode in Advanced Settings."
/>
) : (
<FormattedMessage
id="discover.topNav.openOptionsPopover.documentExplorerEnabledHint"
defaultMessage="You can switch back to the classic Discover view in Advanced Settings."
/>
)}
</EuiText>
{isLegacy && (
<>
<EuiSpacer />
<EuiButton
iconType="tableDensityNormal"
fullWidth
href={addBasePath(`/app/management/kibana/settings?query=${DOC_TABLE_LEGACY}`)}
>
{i18n.translate('discover.openOptionsPopover.tryDocumentExplorer', {
defaultMessage: 'Try Document Explorer',
})}
</EuiButton>
</>
)}
<EuiHorizontalRule margin="s" />
<EuiTextAlign textAlign="center">
<EuiButtonEmpty
iconType="gear"
size="s"
href={addBasePath(`/app/management/kibana/settings?query=category:(discover)`)}
>
{i18n.translate('discover.openOptionsPopover.gotToSettings', {
defaultMessage: 'View Discover settings',
})}
</EuiButtonEmpty>
</EuiTextAlign>
</div>
</EuiWrappingPopover>
);
}
function onClose() {
ReactDOM.unmountComponentAtNode(container);
document.body.removeChild(container);
isOpen = false;
}
export function openOptionsPopover({
I18nContext,
anchorElement,
theme$,
services,
}: {
I18nContext: I18nStart['Context'];
anchorElement: HTMLElement;
theme$: Observable<CoreTheme>;
services: DiscoverServices;
}) {
if (isOpen) {
onClose();
return;
}
isOpen = true;
document.body.appendChild(container);
const element = (
<I18nContext>
<KibanaContextProvider services={services}>
<KibanaThemeProvider theme$={theme$}>
<OptionsPopover onClose={onClose} anchorElement={anchorElement} />
</KibanaThemeProvider>
</KibanaContextProvider>
</I18nContext>
);
ReactDOM.render(element, container);
}

View file

@ -64,9 +64,6 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
expect(await hasFocus(menuButtonTestSubject)).to.be(true);
};
it('should return focus to the options button when dismissing the options popover', () =>
expectButtonToLoseAndRegainFocusWhenOverlayIsOpenedAndClosed('discoverOptionsButton'));
it('should return focus to the open button when dismissing the open search flyout', () =>
expectButtonToLoseAndRegainFocusWhenOverlayIsOpenedAndClosed('discoverOpenButton'));

View file

@ -2197,7 +2197,6 @@
"discover.showingDefaultDataViewWarningDescription": "Affichage de la vue de données par défaut : \"{loadedDataViewTitle}\" ({loadedDataViewId})",
"discover.showingSavedDataViewWarningDescription": "Affichage de la vue de données enregistrée : \"{ownDataViewTitle}\" ({ownDataViewId})",
"discover.singleDocRoute.errorMessage": "Aucune vue de données correspondante pour l'ID {dataViewId}",
"discover.topNav.optionsPopover.currentViewMode": "{viewModeLabel} : {currentViewMode}",
"discover.utils.formatHit.moreFields": "et {count} autre(s) {count, plural, one {champ} many {champs} other {champs}}",
"discover.valueIsNotConfiguredDataViewIDWarningTitle": "{stateVal} n'est pas un ID de vue de données configuré",
"discover.advancedSettings.context.defaultSizeText": "Le nombre d'entrées connexes à afficher dans la vue contextuelle",
@ -2411,12 +2410,10 @@
"discover.localMenu.inspectTitle": "Inspecter",
"discover.localMenu.localMenu.alertsTitle": "Alertes",
"discover.localMenu.localMenu.newSearchTitle": "Nouveauté",
"discover.localMenu.localMenu.optionsTitle": "Options",
"discover.localMenu.newSearchDescription": "Nouvelle recherche",
"discover.localMenu.openInspectorForSearchDescription": "Ouvrir l'inspecteur de recherche",
"discover.localMenu.openSavedSearchDescription": "Ouvrir une recherche enregistrée",
"discover.localMenu.openTitle": "Ouvrir",
"discover.localMenu.optionsDescription": "Options",
"discover.localMenu.saveSaveSearchObjectType": "rechercher",
"discover.localMenu.saveSearchDescription": "Enregistrer la recherche",
"discover.localMenu.saveTitle": "Enregistrer",
@ -2455,10 +2452,6 @@
"discover.notifications.invalidTimeRangeTitle": "Plage temporelle non valide",
"discover.notifications.notSavedSearchTitle": "La recherche \"{savedSearchTitle}\" n'a pas été enregistrée.",
"discover.notifications.savedSearchTitle": "La recherche \"{savedSearchTitle}\" a été enregistrée.",
"discover.openOptionsPopover.classicDiscoverText": "Classique",
"discover.openOptionsPopover.documentExplorerText": "Explorateur de documents",
"discover.openOptionsPopover.gotToSettings": "Afficher les paramètres de Discover",
"discover.openOptionsPopover.tryDocumentExplorer": "Testez l'explorateur de documents",
"discover.pageTitleWithoutSavedSearch": "Discover - Recherche non encore enregistrée",
"discover.reloadSavedSearchButton": "Réinitialiser la recherche",
"discover.removeColumnLabel": "Supprimer la colonne",
@ -2477,12 +2470,9 @@
"discover.sourceViewer.errorMessageTitle": "Une erreur s'est produite.",
"discover.sourceViewer.refresh": "Actualiser",
"discover.toggleSidebarAriaLabel": "Activer/Désactiver la barre latérale",
"discover.topNav.openOptionsPopover.documentExplorerDisabledHint": "Saviez-vous que Discover possède un nouvel Explorateur de documents avec un meilleur tri des données, des colonnes redimensionnables et une vue en plein écran ? Vous pouvez modifier le mode d'affichage dans les Paramètres avancés.",
"discover.topNav.openOptionsPopover.documentExplorerEnabledHint": "Vous pouvez revenir à l'affichage Discover classique dans les Paramètres avancés.",
"discover.topNav.openSearchPanel.manageSearchesButtonLabel": "Gérer les recherches",
"discover.topNav.openSearchPanel.noSearchesFoundDescription": "Aucune recherche correspondante trouvée.",
"discover.topNav.openSearchPanel.openSearchTitle": "Ouvrir une recherche",
"discover.topNav.optionsPopover.discoverViewModeLabel": "Mode d'affichage Discover",
"discover.topNav.saveModal.storeTimeWithSearchToggleDescription": "Mettez à jour le filtre temporel et actualisez l'intervalle pour afficher la sélection actuelle lors de l'utilisation de cette recherche.",
"discover.topNav.saveModal.storeTimeWithSearchToggleLabel": "Stocker la durée avec la recherche enregistrée",
"discover.uninitializedRefreshButtonText": "Actualiser les données",

View file

@ -2197,7 +2197,6 @@
"discover.showingDefaultDataViewWarningDescription": "デフォルトのデータビューを表示しています:\"{loadedDataViewTitle}\"{loadedDataViewId}",
"discover.showingSavedDataViewWarningDescription": "保存されたデータビューを表示しています:\"{ownDataViewTitle}\"{ownDataViewId}",
"discover.singleDocRoute.errorMessage": "ID {dataViewId}の一致するデータビューが見つかりません",
"discover.topNav.optionsPopover.currentViewMode": "{viewModeLabel}{currentViewMode}",
"discover.utils.formatHit.moreFields": "およびその他{count}個の{count, plural, other {フィールド}}",
"discover.valueIsNotConfiguredDataViewIDWarningTitle": "{stateVal}は設定されたデータビューIDではありません",
"discover.advancedSettings.context.defaultSizeText": "コンテキストビューに表示される周りのエントリーの数",
@ -2411,12 +2410,10 @@
"discover.localMenu.inspectTitle": "検査",
"discover.localMenu.localMenu.alertsTitle": "アラート",
"discover.localMenu.localMenu.newSearchTitle": "新規",
"discover.localMenu.localMenu.optionsTitle": "オプション",
"discover.localMenu.newSearchDescription": "新規検索",
"discover.localMenu.openInspectorForSearchDescription": "検索用にインスペクターを開きます",
"discover.localMenu.openSavedSearchDescription": "保存された検索を開きます",
"discover.localMenu.openTitle": "開く",
"discover.localMenu.optionsDescription": "オプション",
"discover.localMenu.saveSaveSearchObjectType": "検索",
"discover.localMenu.saveSearchDescription": "検索を保存します",
"discover.localMenu.saveTitle": "保存",
@ -2455,10 +2452,6 @@
"discover.notifications.invalidTimeRangeTitle": "無効な時間範囲",
"discover.notifications.notSavedSearchTitle": "検索「{savedSearchTitle}」は保存されませんでした。",
"discover.notifications.savedSearchTitle": "検索「{savedSearchTitle}」が保存されました。",
"discover.openOptionsPopover.classicDiscoverText": "クラシック",
"discover.openOptionsPopover.documentExplorerText": "ドキュメントエクスプローラー",
"discover.openOptionsPopover.gotToSettings": "Discover設定を表示",
"discover.openOptionsPopover.tryDocumentExplorer": "ドキュメントエクスプローラーを試す",
"discover.pageTitleWithoutSavedSearch": "Discover - 検索は保存されていません",
"discover.reloadSavedSearchButton": "検索をリセット",
"discover.removeColumnLabel": "列を削除",
@ -2477,12 +2470,9 @@
"discover.sourceViewer.errorMessageTitle": "エラーが発生しました",
"discover.sourceViewer.refresh": "更新",
"discover.toggleSidebarAriaLabel": "サイドバーを切り替える",
"discover.topNav.openOptionsPopover.documentExplorerDisabledHint": "Discoverの新しいドキュメントエクスプローラーでは、データの並べ替え、列のサイズ変更、全画面表示といった優れた機能をご利用いただけます。高度な設定で表示モードを変更できます。",
"discover.topNav.openOptionsPopover.documentExplorerEnabledHint": "高度な設定でクラシックDiscoverビューに戻すことができます。",
"discover.topNav.openSearchPanel.manageSearchesButtonLabel": "検索の管理",
"discover.topNav.openSearchPanel.noSearchesFoundDescription": "一致する検索が見つかりませんでした。",
"discover.topNav.openSearchPanel.openSearchTitle": "検索を開く",
"discover.topNav.optionsPopover.discoverViewModeLabel": "Discover表示モード",
"discover.topNav.saveModal.storeTimeWithSearchToggleDescription": "この検索を使用するときには、時間フィルターを更新し、現在の選択に合わせて間隔を更新します。",
"discover.topNav.saveModal.storeTimeWithSearchToggleLabel": "保存された検索で時間を保存",
"discover.uninitializedRefreshButtonText": "データを更新",

View file

@ -2197,7 +2197,6 @@
"discover.showingDefaultDataViewWarningDescription": "正在显示默认数据视图:“{loadedDataViewTitle}”({loadedDataViewId}",
"discover.showingSavedDataViewWarningDescription": "正在显示已保存数据视图:“{ownDataViewTitle}”({ownDataViewId}",
"discover.singleDocRoute.errorMessage": "没有与 ID {dataViewId} 相匹配的数据视图",
"discover.topNav.optionsPopover.currentViewMode": "{viewModeLabel}{currentViewMode}",
"discover.utils.formatHit.moreFields": "及另外 {count} 个{count, plural, other {字段}}",
"discover.valueIsNotConfiguredDataViewIDWarningTitle": "{stateVal} 不是配置的数据视图 ID",
"discover.advancedSettings.context.defaultSizeText": "要在上下文视图中显示的周围条目数目",
@ -2411,12 +2410,10 @@
"discover.localMenu.inspectTitle": "检查",
"discover.localMenu.localMenu.alertsTitle": "告警",
"discover.localMenu.localMenu.newSearchTitle": "新建",
"discover.localMenu.localMenu.optionsTitle": "选项",
"discover.localMenu.newSearchDescription": "新搜索",
"discover.localMenu.openInspectorForSearchDescription": "打开 Inspector 以进行搜索",
"discover.localMenu.openSavedSearchDescription": "打开已保存搜索",
"discover.localMenu.openTitle": "打开",
"discover.localMenu.optionsDescription": "选项",
"discover.localMenu.saveSaveSearchObjectType": "搜索",
"discover.localMenu.saveSearchDescription": "保存搜索",
"discover.localMenu.saveTitle": "保存",
@ -2455,10 +2452,6 @@
"discover.notifications.invalidTimeRangeTitle": "时间范围无效",
"discover.notifications.notSavedSearchTitle": "搜索“{savedSearchTitle}”未保存。",
"discover.notifications.savedSearchTitle": "搜索“{savedSearchTitle}”已保存",
"discover.openOptionsPopover.classicDiscoverText": "经典",
"discover.openOptionsPopover.documentExplorerText": "Document Explorer",
"discover.openOptionsPopover.gotToSettings": "查看 Discover 设置",
"discover.openOptionsPopover.tryDocumentExplorer": "试用 Document Explorer",
"discover.pageTitleWithoutSavedSearch": "Discover - 尚未保存搜索",
"discover.reloadSavedSearchButton": "重置搜索",
"discover.removeColumnLabel": "移除列",
@ -2477,12 +2470,9 @@
"discover.sourceViewer.errorMessageTitle": "发生错误",
"discover.sourceViewer.refresh": "刷新",
"discover.toggleSidebarAriaLabel": "切换侧边栏",
"discover.topNav.openOptionsPopover.documentExplorerDisabledHint": "您知道吗Discover 有一种新的 Document Explorer可提供更好的数据排序、可调整大小的列及全屏视图。您可以在高级设置中更改视图模式。",
"discover.topNav.openOptionsPopover.documentExplorerEnabledHint": "您可以在高级设置中切换回经典 Discover 视图。",
"discover.topNav.openSearchPanel.manageSearchesButtonLabel": "管理搜索",
"discover.topNav.openSearchPanel.noSearchesFoundDescription": "未找到匹配的搜索。",
"discover.topNav.openSearchPanel.openSearchTitle": "打开搜索",
"discover.topNav.optionsPopover.discoverViewModeLabel": "Discover 视图模式",
"discover.topNav.saveModal.storeTimeWithSearchToggleDescription": "在使用此搜索时更新时间筛选并将时间间隔刷新到当前选择。",
"discover.topNav.saveModal.storeTimeWithSearchToggleLabel": "将时间与已保存搜索一起存储",
"discover.uninitializedRefreshButtonText": "刷新数据",