diff --git a/src/plugins/index_pattern_management/public/components/index_pattern_table/empty_state/__snapshots__/empty_state.test.tsx.snap b/src/plugins/index_pattern_management/public/components/index_pattern_table/empty_state/__snapshots__/empty_state.test.tsx.snap index 957c94c80680d..75b8177d9dac3 100644 --- a/src/plugins/index_pattern_management/public/components/index_pattern_table/empty_state/__snapshots__/empty_state.test.tsx.snap +++ b/src/plugins/index_pattern_management/public/components/index_pattern_table/empty_state/__snapshots__/empty_state.test.tsx.snap @@ -120,11 +120,10 @@ exports[`EmptyState should render normally 1`] = `
- + - +
diff --git a/src/plugins/index_pattern_management/public/components/index_pattern_table/empty_state/empty_state.tsx b/src/plugins/index_pattern_management/public/components/index_pattern_table/empty_state/empty_state.tsx index c05f6a1f193b7..af49e8c36fe3b 100644 --- a/src/plugins/index_pattern_management/public/components/index_pattern_table/empty_state/empty_state.tsx +++ b/src/plugins/index_pattern_management/public/components/index_pattern_table/empty_state/empty_state.tsx @@ -24,6 +24,7 @@ import { EuiCard, EuiLink, EuiText, + EuiFlexGroup, } from '@elastic/eui'; import { useHistory } from 'react-router-dom'; import { reactRouterNavigate } from '../../../../../../plugins/kibana_react/public'; @@ -143,8 +144,8 @@ export const EmptyState = ({
- - + + - + - +
diff --git a/src/plugins/kibana_react/public/page_template/__snapshots__/page_template.test.tsx.snap b/src/plugins/kibana_react/public/page_template/__snapshots__/page_template.test.tsx.snap index 71d034d32bd1b..9ad2bd73674bd 100644 --- a/src/plugins/kibana_react/public/page_template/__snapshots__/page_template.test.tsx.snap +++ b/src/plugins/kibana_react/public/page_template/__snapshots__/page_template.test.tsx.snap @@ -2,7 +2,6 @@ exports[`KibanaPageTemplate render basic template 1`] = ` = ({ ); } + const emptyStateDefaultTemplate = pageSideBar ? 'centeredContent' : 'centeredBody'; + /** * An easy way to create the right content for empty pages */ if (isEmptyState && pageHeader && !children) { - template = template ?? 'centeredBody'; + template = template ?? emptyStateDefaultTemplate; const { iconType, pageTitle, description, rightSideItems } = pageHeader; pageHeader = undefined; children = ( @@ -104,14 +106,13 @@ export const KibanaPageTemplate: FunctionComponent = ({ } else if (isEmptyState && pageHeader && children) { template = template ?? 'centeredContent'; } else if (isEmptyState && !pageHeader) { - template = template ?? 'centeredBody'; + template = template ?? emptyStateDefaultTemplate; } return ( void; setBreadcrumbs: () => void; } -export const ManagementLandingPage = ({ version, setBreadcrumbs }: ManagementLandingPageProps) => { +export const ManagementLandingPage = ({ + version, + setBreadcrumbs, + onAppMounted, +}: ManagementLandingPageProps) => { setBreadcrumbs(); + useEffect(() => { + onAppMounted(''); + }, [onAppMounted]); + return ( )} /> diff --git a/src/plugins/presentation_util/public/components/solution_toolbar/items/button.scss b/src/plugins/presentation_util/public/components/solution_toolbar/items/button.scss index 4fc3651ee9f73..a1e5b4e141765 100644 --- a/src/plugins/presentation_util/public/components/solution_toolbar/items/button.scss +++ b/src/plugins/presentation_util/public/components/solution_toolbar/items/button.scss @@ -6,7 +6,9 @@ border-color: $euiBorderColor !important; // sass-lint:disable-line no-important @include kbnThemeStyle('v8') { - border-width: $euiBorderWidthThin; - border-style: solid; + &[class*='--text'] { + border-width: $euiBorderWidthThin; + border-style: solid; + } } } diff --git a/test/functional/services/common/test_subjects.ts b/test/functional/services/common/test_subjects.ts index ae04fe5d2b939..3f47c6155f175 100644 --- a/test/functional/services/common/test_subjects.ts +++ b/test/functional/services/common/test_subjects.ts @@ -312,9 +312,12 @@ export class TestSubjects extends FtrService { return testSubjSelector(selector); } - public async scrollIntoView(selector: string) { + public async scrollIntoView( + selector: string, + offset?: number | { topOffset?: number; bottomOffset?: number } + ) { const element = await this.find(selector); - await element.scrollIntoViewIfNecessary(); + await element.scrollIntoViewIfNecessary(offset); } // isChecked always returns false when run on an euiSwitch, because they use the aria-checked attribute diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/error_connecting/error_connecting.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/error_connecting/error_connecting.tsx index a53e8a099177c..84dcb07a07474 100644 --- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/error_connecting/error_connecting.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/error_connecting/error_connecting.tsx @@ -7,7 +7,7 @@ import React from 'react'; -import { EuiPage, EuiPageContent } from '@elastic/eui'; +import { KibanaPageTemplate } from '../../../../../../../../src/plugins/kibana_react/public'; import { ErrorStatePrompt } from '../../../shared/error_state'; import { SetAppSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome'; @@ -19,11 +19,9 @@ export const ErrorConnecting: React.FC = () => { - - - - - + + + ); }; diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/error_connecting/error_connecting.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/error_connecting/error_connecting.tsx index afee20df106e8..979847b4cf1c6 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/error_connecting/error_connecting.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search/components/error_connecting/error_connecting.tsx @@ -7,16 +7,15 @@ import React from 'react'; -import { EuiPage, EuiPageContent } from '@elastic/eui'; +import { KibanaPageTemplate } from '../../../../../../../../src/plugins/kibana_react/public'; import { ErrorStatePrompt } from '../../../shared/error_state'; import { SendEnterpriseSearchTelemetry as SendTelemetry } from '../../../shared/telemetry'; export const ErrorConnecting: React.FC = () => ( - + - - - - + + + ); diff --git a/x-pack/plugins/enterprise_search/public/applications/workplace_search/views/error_state/error_state.tsx b/x-pack/plugins/enterprise_search/public/applications/workplace_search/views/error_state/error_state.tsx index 8116d55542820..f4914413a80fa 100644 --- a/x-pack/plugins/enterprise_search/public/applications/workplace_search/views/error_state/error_state.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/workplace_search/views/error_state/error_state.tsx @@ -9,7 +9,7 @@ import React from 'react'; -import { EuiPage, EuiPageBody, EuiPageContent } from '@elastic/eui'; +import { KibanaPageTemplate } from '../../../../../../../../src/plugins/kibana_react/public'; import { WORKPLACE_SEARCH_PLUGIN } from '../../../../../common/constants'; import { ErrorStatePrompt } from '../../../shared/error_state'; @@ -19,16 +19,14 @@ import { ViewContentHeader } from '../../components/shared/view_content_header'; export const ErrorState: React.FC = () => { return ( - + <> - + - - - - - + + + ); }; diff --git a/x-pack/plugins/infra/public/pages/logs/log_entry_categories/page_content.tsx b/x-pack/plugins/infra/public/pages/logs/log_entry_categories/page_content.tsx index 462b8b2f9dc3e..bfdbe03526164 100644 --- a/x-pack/plugins/infra/public/pages/logs/log_entry_categories/page_content.tsx +++ b/x-pack/plugins/infra/public/pages/logs/log_entry_categories/page_content.tsx @@ -116,9 +116,13 @@ const CategoriesPageTemplate: React.FC = ({ return ( {children} diff --git a/x-pack/plugins/infra/public/pages/logs/log_entry_rate/page_content.tsx b/x-pack/plugins/infra/public/pages/logs/log_entry_rate/page_content.tsx index ea60d073c2311..04909b059d8c3 100644 --- a/x-pack/plugins/infra/public/pages/logs/log_entry_rate/page_content.tsx +++ b/x-pack/plugins/infra/public/pages/logs/log_entry_rate/page_content.tsx @@ -158,9 +158,13 @@ const AnomaliesPageTemplate: React.FC = ({ return ( {children} diff --git a/x-pack/plugins/license_management/__jest__/__snapshots__/upload_license.test.tsx.snap b/x-pack/plugins/license_management/__jest__/__snapshots__/upload_license.test.tsx.snap index 45e7055f4db2b..ea973df9aad76 100644 --- a/x-pack/plugins/license_management/__jest__/__snapshots__/upload_license.test.tsx.snap +++ b/x-pack/plugins/license_management/__jest__/__snapshots__/upload_license.test.tsx.snap @@ -703,106 +703,85 @@ exports[`UploadLicense should display a modal when license requires acknowledgem
- + } + onChange={[Function]} > -
-
- + + + +
+
- - } - onChange={[Function]} + - -
-
- - - -
- -
- - Select or drag your license file - -
-
-
-
-
-
+ Select or drag your license file +
- +
-
-
-
+
+ + @@ -1445,106 +1424,85 @@ exports[`UploadLicense should display an error when ES says license is expired 1 - + } + onChange={[Function]} > -
-
- + + + +
+
- - } - onChange={[Function]} + - -
-
- - - -
- -
- - Select or drag your license file - -
-
-
-
-
-
+ Select or drag your license file +
- +
-
-
-
+ + + @@ -2187,106 +2145,85 @@ exports[`UploadLicense should display an error when ES says license is invalid 1 - + } + onChange={[Function]} > -
-
- + + + +
+
- - } - onChange={[Function]} + - -
-
- - - -
- -
- - Select or drag your license file - -
-
-
-
-
-
+ Select or drag your license file +
- +
-
-
-
+ + + @@ -2929,106 +2866,85 @@ exports[`UploadLicense should display an error when submitting invalid JSON 1`] - + } + onChange={[Function]} > -
-
- + + + +
+
- - } - onChange={[Function]} + - -
-
- - - -
- -
- - Select or drag your license file - -
-
-
-
-
-
+ Select or drag your license file +
- +
-
-
-
+ + + @@ -3671,106 +3587,85 @@ exports[`UploadLicense should display error when ES returns error 1`] = ` - + } + onChange={[Function]} > -
-
- + + + +
+
- - } - onChange={[Function]} + - -
-
- - - -
- -
- - Select or drag your license file - -
-
-
-
-
-
+ Select or drag your license file +
- +
-
-
-
+ + + diff --git a/x-pack/plugins/license_management/public/application/sections/upload_license/upload_license.js b/x-pack/plugins/license_management/public/application/sections/upload_license/upload_license.js index 8ae20a2e60757..22933c6207a72 100644 --- a/x-pack/plugins/license_management/public/application/sections/upload_license/upload_license.js +++ b/x-pack/plugins/license_management/public/application/sections/upload_license/upload_license.js @@ -160,22 +160,18 @@ export class UploadLicense extends React.PureComponent { - - - - - } - onChange={this.handleFile} - /> - - - + + } + onChange={this.handleFile} + /> + {shouldShowTelemetryOptIn(telemetry) && ( - + + - -

- Create Pipeline -

-
- - } - isInvalid={true} + labelType="label" > - - } - labelType="label" - > - + + - - + - } - labelType="label" - > - + + - - - } - labelType="label" + } + labelType="label" + > +
-
- -
- - +
+
+ - } - labelType="label" + /> + } + labelType="label" + > + + + + + - - - - - - - - - - - - + + + + - - - + + - - - - - - + + + + + - - - -
- - + + + +
+ + + - - - - - - + + + + - - - - - -
- + + + + + `; exports[`PipelineEditor component invalidates form for invalid pipeline id input 1`] = ` -
- + + - -

- Create Pipeline -

-
- - } - isInvalid={true} + labelType="label" > - - } - labelType="label" - > - + + - - + - } - labelType="label" - > - + + - - - } - labelType="label" + } + labelType="label" + > +
-
- -
- - +
+
+ - } - labelType="label" + /> + } + labelType="label" + > + + + + + - - - - - - - - - - - - + + + + - - - + + - - - - - - + + + + + - - - -
- - + + + +
+ + + - - - - - - + + + + - - - - - -
-
+ + + + + `; exports[`PipelineEditor component invalidates form for pipeline id with spaces 1`] = ` -
- + + - -

- Create Pipeline -

-
- - } - isInvalid={true} + labelType="label" > - - } - labelType="label" - > - + + - - + - } - labelType="label" - > - + + - - - } - labelType="label" + } + labelType="label" + > +
-
- -
- - +
+
+ - } - labelType="label" + /> + } + labelType="label" + > + + + + + - - - - - - - - - - - - + + + + - - - + + - - - - - - + + + + + - - - -
- - + + + +
+ + + - - - - - - + + + + - - - - - -
-
+ + + + + `; exports[`PipelineEditor component matches snapshot for clone pipeline 1`] = ` -
- + + + - -

- Clone Pipeline "pipelineToClone" -

-
- - + } + labelType="label" > - - } - labelType="label" - > - + + - - - } - labelType="label" + } + labelType="label" + > +
-
- -
- - +
+
+ - } - labelType="label" + /> + } + labelType="label" + > + + + + + - - - - - - - - - - - - + + + + - - - + + - - - - - - + + + + + - - - -
- - + + + +
+ + + - - - - - - + + + + - - - - - + + + + - - - - - -
-
+ + + + + `; exports[`PipelineEditor component matches snapshot for create pipeline 1`] = ` -
- + + + - -

- Create Pipeline -

-
- - + } + labelType="label" > - - } - labelType="label" - > - + + - - + - } - labelType="label" - > - + + - - - } - labelType="label" + } + labelType="label" + > +
-
- -
- - +
+
+ - } - labelType="label" + /> + } + labelType="label" + > + + + + + - - - - - - - - - - - - + + + + - - - + + - - - - - - + + + + + - - - -
- - + + + +
+ + + - - - - - - + + + + - - - - - -
-
+ + + + + `; exports[`PipelineEditor component matches snapshot for edit pipeline 1`] = ` -
- + + + - -

- Edit Pipeline "pipelineId" -

-
- - + } + labelType="label" > - - } - labelType="label" - > - + + - - - } - labelType="label" + } + labelType="label" + > +
-
- -
- - +
+
+ - } - labelType="label" + /> + } + labelType="label" + > + + + + + - - - - - - - - - - - - + + + + - - - + + - - - - - - + + + + + - - - -
- - + + + +
+ + + - - - - - - + + + + - - - - - + + + + - - - - - -
-
+ + + + + `; diff --git a/x-pack/plugins/logstash/public/application/components/pipeline_editor/pipeline_editor.js b/x-pack/plugins/logstash/public/application/components/pipeline_editor/pipeline_editor.js index 2ec7caa976cc8..334c7d0322a84 100644 --- a/x-pack/plugins/logstash/public/application/components/pipeline_editor/pipeline_editor.js +++ b/x-pack/plugins/logstash/public/application/components/pipeline_editor/pipeline_editor.js @@ -25,10 +25,10 @@ import { EuiFieldText, EuiForm, EuiFormRow, - EuiPageContent, + EuiPageContentBody, EuiSelect, EuiSpacer, - EuiTitle, + EuiPageHeader, } from '@elastic/eui'; import { ConfirmDeletePipelineModal } from './confirm_delete_pipeline_modal'; import { FlexItemSetting } from './flex_item_setting'; @@ -269,219 +269,211 @@ class PipelineEditorUi extends React.Component { const { intl } = this.props; return ( -
- - -

{this.getPipelineHeadingText()}

-
- - - {this.props.isNewPipeline && ( - - } - > - - - )} + + + + + {this.props.isNewPipeline && ( } > - + } + > + - } + name="pipelineDescription" + onChange={this.onPipelineDescriptionChange} + value={this.state.pipeline.description || ''} + /> + + + } + > +
+ +
+
+ + } + > + this.handleNumberChange('pipeline.workers', e.target.value)} + value={this.state.pipeline.settings['pipeline.workers']} + /> + + + + -
- -
- - - } + this.handleNumberChange('pipeline.batch.size', e.target.value)} + value={this.state.pipeline.settings['pipeline.batch.size']} + /> +
+ this.handleNumberChange('pipeline.workers', e.target.value)} - value={this.state.pipeline.settings['pipeline.workers']} + data-test-subj="inputBatchDelay" + onChange={(e) => this.handleNumberChange('pipeline.batch.delay', e.target.value)} + value={this.state.pipeline.settings['pipeline.batch.delay']} /> - - - - - this.handleNumberChange('pipeline.batch.size', e.target.value)} - value={this.state.pipeline.settings['pipeline.batch.size']} - /> - - - this.handleNumberChange('pipeline.batch.delay', e.target.value)} - value={this.state.pipeline.settings['pipeline.batch.delay']} - /> - - - - - this.handleSettingChange('queue.type', e.target.value)} - options={PIPELINE_EDITOR.QUEUE_TYPES} - value={this.state.pipeline.settings['queue.type']} - /> - - - this.handleMaxByteNumberChange(e.target.value)} - value={this.state.maxBytesNumber} - /> - - - this.handleMaxByteUnitChange(e.target.value)} - options={PIPELINE_EDITOR.UNITS} - value={this.state.maxBytesUnit} - /> - - - - this.handleNumberChange('queue.checkpoint.writes', e.target.value) - } - value={this.state.pipeline.settings['queue.checkpoint.writes']} - /> - - -
- - + + + + + this.handleSettingChange('queue.type', e.target.value)} + options={PIPELINE_EDITOR.QUEUE_TYPES} + value={this.state.pipeline.settings['queue.type']} + /> + + + this.handleMaxByteNumberChange(e.target.value)} + value={this.state.maxBytesNumber} + /> + + + this.handleMaxByteUnitChange(e.target.value)} + options={PIPELINE_EDITOR.UNITS} + value={this.state.maxBytesUnit} + /> + + + this.handleNumberChange('queue.checkpoint.writes', e.target.value)} + value={this.state.pipeline.settings['queue.checkpoint.writes']} + /> + + +
+ + + + + + + + + + + + + {!this.props.isNewPipeline && ( - - - - - - - + - {!this.props.isNewPipeline && ( - - - - - - )} - -
+ )} + {this.state.showConfirmDeleteModal && ( )} -
+ ); } } diff --git a/x-pack/plugins/logstash/public/application/components/pipeline_list/pipeline_list.js b/x-pack/plugins/logstash/public/application/components/pipeline_list/pipeline_list.js index a8b03d91f996d..4772669daec62 100644 --- a/x-pack/plugins/logstash/public/application/components/pipeline_list/pipeline_list.js +++ b/x-pack/plugins/logstash/public/application/components/pipeline_list/pipeline_list.js @@ -12,9 +12,8 @@ import { EuiCallOut, EuiEmptyPrompt, EuiLoadingSpinner, - EuiPageContent, - EuiTitle, - EuiText, + EuiPageContentBody, + EuiPageHeader, EuiSpacer, } from '@elastic/eui'; @@ -292,36 +291,34 @@ class PipelineListUi extends React.Component { const { clonePipeline, createPipeline, isReadOnly, openPipeline } = this.props; const { isSelectable, message, pipelines, selection, showConfirmDeleteModal } = this.state; return ( -
- - -

- -

-
- -

- -

-
- - {this.renderNoPermissionCallOut()} - -
+ + + } + description={ + + } + bottomBorder + /> + + {this.renderNoPermissionCallOut()} + + -
+ ); } } diff --git a/x-pack/plugins/ml/public/application/_index.scss b/x-pack/plugins/ml/public/application/_index.scss index fb61a2a16c19d..8fec50ed0e019 100644 --- a/x-pack/plugins/ml/public/application/_index.scss +++ b/x-pack/plugins/ml/public/application/_index.scss @@ -25,7 +25,6 @@ @import 'components/items_grid/index'; @import 'components/job_selector/index'; @import 'components/loading_indicator/index'; // SASSTODO: This component should be replaced with EuiLoadingSpinner - @import 'components/navigation_menu/index'; @import 'components/rule_editor/index'; // SASSTODO: This file overwrites EUI directly @import 'components/stats_bar/index'; @import 'components/ml_embedded_map/index'; diff --git a/x-pack/plugins/ml/public/application/components/navigation_menu/_index.scss b/x-pack/plugins/ml/public/application/components/navigation_menu/_index.scss deleted file mode 100644 index 5135bba535dd9..0000000000000 --- a/x-pack/plugins/ml/public/application/components/navigation_menu/_index.scss +++ /dev/null @@ -1 +0,0 @@ -@import 'navigation_menu' diff --git a/x-pack/plugins/ml/public/application/components/navigation_menu/_navigation_menu.scss b/x-pack/plugins/ml/public/application/components/navigation_menu/_navigation_menu.scss deleted file mode 100644 index 0d14bb46e8deb..0000000000000 --- a/x-pack/plugins/ml/public/application/components/navigation_menu/_navigation_menu.scss +++ /dev/null @@ -1,5 +0,0 @@ -.mlNavigationMenu { - padding: 0 $euiSizeM; - border-bottom: $euiBorderThin; - background-color: $euiColorEmptyShade; -} diff --git a/x-pack/plugins/ml/public/application/components/navigation_menu/main_tabs.scss b/x-pack/plugins/ml/public/application/components/navigation_menu/main_tabs.scss new file mode 100644 index 0000000000000..05b85e4d20633 --- /dev/null +++ b/x-pack/plugins/ml/public/application/components/navigation_menu/main_tabs.scss @@ -0,0 +1,4 @@ +.mlMainTabs { + // Hack to address https://github.com/elastic/kibana/pull/103197#discussion_r659645946 + padding-bottom: 0 !important; +} diff --git a/x-pack/plugins/ml/public/application/components/navigation_menu/main_tabs.tsx b/x-pack/plugins/ml/public/application/components/navigation_menu/main_tabs.tsx index 0f381fb7acee9..5073896eba9f8 100644 --- a/x-pack/plugins/ml/public/application/components/navigation_menu/main_tabs.tsx +++ b/x-pack/plugins/ml/public/application/components/navigation_menu/main_tabs.tsx @@ -7,13 +7,14 @@ import React, { FC, useState, useEffect } from 'react'; -import { EuiTabs, EuiTab } from '@elastic/eui'; +import { EuiPageHeader } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { TabId } from './navigation_menu'; import { useMlKibana, useMlUrlGenerator, useNavigateToPath } from '../../contexts/kibana'; import { MlUrlGeneratorState } from '../../../../common/types/ml_url_generator'; import { useUrlState } from '../../util/url_state'; import { ML_APP_NAME } from '../../../../common/constants/app'; +import './main_tabs.scss'; export interface Tab { id: TabId; @@ -154,40 +155,26 @@ export const MainTabs: FC = ({ tabId, disableLinks }) => { }, [selectedTabId]); return ( - - {tabs.map((tab: Tab) => { + { const { id, disabled } = tab; const testSubject = TAB_DATA[id].testSubject; const defaultPathId = (TAB_DATA[id].pathId || id) as MlUrlGeneratorState['page']; - return disabled ? ( -
- - {tab.name} - -
- ) : ( -
- { - onSelectedTabChanged(id); - redirectToTab(defaultPathId); - }} - isSelected={id === selectedTabId} - key={`tab-${id}-key`} - > - {tab.name} - -
- ); + return { + label: tab.name, + disabled, + onClick: () => { + onSelectedTabChanged(id); + redirectToTab(defaultPathId); + }, + 'data-test-subj': testSubject + (id === selectedTabId ? ' selected' : ''), + isSelected: id === selectedTabId, + }; })} -
+ /> ); }; diff --git a/x-pack/plugins/ml/public/application/components/navigation_menu/navigation_menu.tsx b/x-pack/plugins/ml/public/application/components/navigation_menu/navigation_menu.tsx index e836dc3ddced7..986a88d789b36 100644 --- a/x-pack/plugins/ml/public/application/components/navigation_menu/navigation_menu.tsx +++ b/x-pack/plugins/ml/public/application/components/navigation_menu/navigation_menu.tsx @@ -5,8 +5,7 @@ * 2.0. */ -import React, { Fragment, FC } from 'react'; -import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; +import React, { FC } from 'react'; import { isFullLicense } from '../../license'; @@ -27,13 +26,5 @@ interface Props { export const NavigationMenu: FC = ({ tabId }) => { const disableLinks = isFullLicense() === false; - return ( - - - - - - - - ); + return ; }; diff --git a/x-pack/plugins/reporting/public/management/report_listing.tsx b/x-pack/plugins/reporting/public/management/report_listing.tsx index fffa952be6cb4..0b6ece4d8bd02 100644 --- a/x-pack/plugins/reporting/public/management/report_listing.tsx +++ b/x-pack/plugins/reporting/public/management/report_listing.tsx @@ -135,6 +135,7 @@ class ReportListingUi extends Component { return ( <> } diff --git a/x-pack/plugins/saved_objects_tagging/public/management/tag_management_page.tsx b/x-pack/plugins/saved_objects_tagging/public/management/tag_management_page.tsx index e671bc587cf1f..e36d1a8afc08f 100644 --- a/x-pack/plugins/saved_objects_tagging/public/management/tag_management_page.tsx +++ b/x-pack/plugins/saved_objects_tagging/public/management/tag_management_page.tsx @@ -11,6 +11,7 @@ import useMount from 'react-use/lib/useMount'; import { Query } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { ChromeBreadcrumb, CoreStart } from 'src/core/public'; +import { EuiSpacer } from '@elastic/eui'; import { TagWithRelations, TagsCapabilities } from '../../common'; import { getCreateModalOpener } from '../components/edition_modal'; import { ITagInternalClient, ITagAssignmentService, ITagsCache } from '../services'; @@ -194,6 +195,7 @@ export const TagManagementPage: FC = ({ return ( <>
+ - - - - -

- -

-
- - - - - -
-
- - -

+ <> + -

-
- - - {tabs.map((tab) => ( - onSectionChange(tab.id)} - isSelected={tab.id === section} - key={tab.id} - data-test-subj={`${tab.id}Tab`} - > - {tab.name} - - ))} - - - - - - - - {canShowActions && ( - - )} + + } + rightSideItems={[ + + + , + ]} + description={ + + } + tabs={tabs.map((tab) => ({ + label: tab.name, + onClick: () => onSectionChange(tab.id), + isSelected: tab.id === section, + key: tab.id, + 'data-test-subj': `${tab.id}Tab`, + }))} + /> + + + + + + + {canShowActions && ( - - - -
- + )} + + + + + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_details/components/alert_details.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_details/components/alert_details.tsx index 3e411913520ad..02aa5f9b0b828 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_details/components/alert_details.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_details/components/alert_details.tsx @@ -10,8 +10,6 @@ import React, { useState, useEffect, useReducer } from 'react'; import { keyBy } from 'lodash'; import { useHistory } from 'react-router-dom'; import { - EuiPageBody, - EuiPageContent, EuiPageHeader, EuiText, EuiFlexGroup, @@ -149,213 +147,211 @@ export const AlertDetails: React.FunctionComponent = ({ : []; return ( - - - + + } + rightSideItems={[ + , + - } - rightSideItems={[ - , - - - , - ...rightPageHeaderButtons, - ]} - /> - - - - - -

- -

-
- - {alertType.name} -
- - {uniqueActions && uniqueActions.length ? ( - <> - -

- -

-
- - - {uniqueActions.map((action, index) => ( - - - {actionTypesByTypeId[action].name ?? action} - - - ))} - - - ) : null} -
- - - - - { - if (isEnabled) { - setIsEnabled(false); - await disableAlert(alert); - // Reset dismiss if previously clicked - setDissmissAlertErrors(false); - } else { - setIsEnabled(true); - await enableAlert(alert); - } - requestRefresh(); - }} - label={ - +
, + ...rightPageHeaderButtons, + ]} + /> + + + + + +

+ +

+
+ + {alertType.name} +
+ + {uniqueActions && uniqueActions.length ? ( + <> + +

+ +

+
+ + + {uniqueActions.map((action, index) => ( + + + {actionTypesByTypeId[action].name ?? action} + + + ))} + + + ) : null} +
+ + + + + { + if (isEnabled) { + setIsEnabled(false); + await disableAlert(alert); + // Reset dismiss if previously clicked + setDissmissAlertErrors(false); + } else { + setIsEnabled(true); + await enableAlert(alert); } - /> - - - { - if (isMuted) { - setIsMuted(false); - await unmuteAlert(alert); - } else { - setIsMuted(true); - await muteAlert(alert); - } - requestRefresh(); - }} - label={ + requestRefresh(); + }} + label={ + + } + /> + + + { + if (isMuted) { + setIsMuted(false); + await unmuteAlert(alert); + } else { + setIsMuted(true); + await muteAlert(alert); + } + requestRefresh(); + }} + label={ + + } + /> + + + +
+ {alert.enabled && !dissmissAlertErrors && alert.executionStatus.status === 'error' ? ( + + + + + {alert.executionStatus.error?.message} + + + + + setDissmissAlertErrors(true)} + > - } - /> - - - - - {alert.enabled && !dissmissAlertErrors && alert.executionStatus.status === 'error' ? ( - - - - - {alert.executionStatus.error?.message} - - - + + + {alert.executionStatus.error?.reason === + AlertExecutionStatusErrorReasons.License && ( - setDissmissAlertErrors(true)} + target="_blank" > - + - {alert.executionStatus.error?.reason === - AlertExecutionStatusErrorReasons.License && ( - - - - - - )} - - - - - ) : null} - - - {alert.enabled ? ( - - ) : ( - <> - - -

- -

-
- - )} + )} +
+ -
-
-
+ ) : null} + + + {alert.enabled ? ( + + ) : ( + <> + + +

+ +

+
+ + )} +
+
+ + ); }; diff --git a/x-pack/test/functional/services/ml/data_visualizer_file_based.ts b/x-pack/test/functional/services/ml/data_visualizer_file_based.ts index 5eece4057ac0c..291e5a8964553 100644 --- a/x-pack/test/functional/services/ml/data_visualizer_file_based.ts +++ b/x-pack/test/functional/services/ml/data_visualizer_file_based.ts @@ -10,6 +10,8 @@ import expect from '@kbn/expect'; import { FtrProviderContext } from '../../ftr_provider_context'; import { MlCommonUI } from './common_ui'; +const fixedFooterHeight = 72; // Size of EuiBottomBar more or less + export function MachineLearningDataVisualizerFileBasedProvider( { getService, getPageObjects }: FtrProviderContext, mlCommonUI: MlCommonUI @@ -131,7 +133,9 @@ export function MachineLearningDataVisualizerFileBasedProvider( }, async selectCreateFilebeatConfig() { - await testSubjects.scrollIntoView('fileDataVisFilebeatConfigLink'); + await testSubjects.scrollIntoView('fileDataVisFilebeatConfigLink', { + bottomOffset: fixedFooterHeight, + }); await testSubjects.click('fileDataVisFilebeatConfigLink'); await testSubjects.existOrFail('fileDataVisFilebeatConfigPanel'); },