From 6173c04c20538a8dc4c97e6053f7e0baf3b0e311 Mon Sep 17 00:00:00 2001 From: Alison Goryachev Date: Tue, 15 Jun 2021 11:39:32 -0400 Subject: [PATCH 1/4] [Snapshot + Restore] Migrate to new page layout structure (#101811) --- .../components/authorization_provider.tsx | 4 +- .../authorization/components/index.ts | 4 +- .../authorization/components/page_error.tsx | 72 ++++++++ .../components/section_error.tsx | 7 +- .../authorization/index.ts | 4 +- .../authorization/types.ts | 6 + .../public/authorization/index.ts | 1 + src/plugins/es_ui_shared/public/index.ts | 1 + .../public/application/app.tsx | 16 +- .../public/application/components/index.ts | 2 +- .../public/application/components/loading.tsx | 66 +++++++ .../policy_form/steps/step_logistics.tsx | 6 +- .../components/section_loading.tsx | 48 ----- .../public/application/sections/home/home.tsx | 139 ++++++--------- .../policy_details/policy_details.tsx | 5 +- .../sections/policy_add/policy_add.tsx | 92 +++++----- .../sections/policy_edit/policy_edit.tsx | 164 +++++++++--------- .../repository_add/repository_add.tsx | 36 ++-- .../repository_edit/repository_edit.tsx | 120 +++++++------ .../restore_snapshot/restore_snapshot.tsx | 64 ++++--- .../snapshot_restore/public/shared_imports.ts | 1 + 21 files changed, 464 insertions(+), 394 deletions(-) create mode 100644 src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/page_error.tsx create mode 100644 x-pack/plugins/snapshot_restore/public/application/components/loading.tsx delete mode 100644 x-pack/plugins/snapshot_restore/public/application/components/section_loading.tsx diff --git a/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/authorization_provider.tsx b/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/authorization_provider.tsx index 14086e6ee81370b..1352081eaa30bc0 100644 --- a/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/authorization_provider.tsx +++ b/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/authorization_provider.tsx @@ -11,9 +11,7 @@ import React, { createContext, useContext } from 'react'; import { useRequest } from '../../../public'; -import { Error as CustomError } from './section_error'; - -import { Privileges } from '../types'; +import { Privileges, Error as CustomError } from '../types'; interface Authorization { isLoading: boolean; diff --git a/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/index.ts b/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/index.ts index b13060287372437..f8eb7e3c7c0c83c 100644 --- a/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/index.ts +++ b/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/index.ts @@ -16,4 +16,6 @@ export { WithPrivileges } from './with_privileges'; export { NotAuthorizedSection } from './not_authorized_section'; -export { Error, SectionError } from './section_error'; +export { SectionError } from './section_error'; + +export { PageError } from './page_error'; diff --git a/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/page_error.tsx b/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/page_error.tsx new file mode 100644 index 000000000000000..0a27b4098681b6c --- /dev/null +++ b/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/page_error.tsx @@ -0,0 +1,72 @@ +/* + * 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 { EuiSpacer, EuiEmptyPrompt, EuiPageContent } from '@elastic/eui'; +import React from 'react'; +import { APP_WRAPPER_CLASS } from '../../../../../../src/core/public'; +import { Error } from '../types'; + +interface Props { + title: React.ReactNode; + error: Error; + actions?: JSX.Element; + isCentered?: boolean; +} + +/* + * A reusable component to handle full page errors. + * This is based on Kibana design guidelines related + * to the new management navigation structure. + * In some scenarios, it replaces the usage of . + */ + +export const PageError: React.FunctionComponent = ({ + title, + error, + actions, + isCentered, + ...rest +}) => { + const { + error: errorString, + cause, // wrapEsError() on the server adds a "cause" array + message, + } = error; + + const errorContent = ( + + {title}} + body={ + <> + {cause ? message || errorString :

{message || errorString}

} + {cause && ( + <> + +
    + {cause.map((causeMsg, i) => ( +
  • {causeMsg}
    • + ))} +
+ + )} + + } + iconType="alert" + actions={actions} + {...rest} + /> + + ); + + if (isCentered) { + return
{errorContent}
; + } + + return errorContent; +}; diff --git a/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/section_error.tsx b/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/section_error.tsx index c0b3533c8594b4c..a1652b4e153f585 100644 --- a/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/section_error.tsx +++ b/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/components/section_error.tsx @@ -8,12 +8,7 @@ import { EuiCallOut, EuiSpacer } from '@elastic/eui'; import React, { Fragment } from 'react'; - -export interface Error { - error: string; - cause?: string[]; - message?: string; -} +import { Error } from '../types'; interface Props { title: React.ReactNode; diff --git a/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/index.ts b/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/index.ts index 089dc890c3e6cfe..e63d98512a2cd89 100644 --- a/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/index.ts +++ b/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/index.ts @@ -12,8 +12,8 @@ export { AuthorizationProvider, AuthorizationContext, SectionError, - Error, + PageError, useAuthorizationContext, } from './components'; -export { Privileges, MissingPrivileges } from './types'; +export { Privileges, MissingPrivileges, Error } from './types'; diff --git a/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/types.ts b/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/types.ts index b10318aa415b34d..70b54b0b6e425e2 100644 --- a/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/types.ts +++ b/src/plugins/es_ui_shared/__packages_do_not_import__/authorization/types.ts @@ -14,3 +14,9 @@ export interface Privileges { hasAllPrivileges: boolean; missingPrivileges: MissingPrivileges; } + +export interface Error { + error: string; + cause?: string[]; + message?: string; +} diff --git a/src/plugins/es_ui_shared/public/authorization/index.ts b/src/plugins/es_ui_shared/public/authorization/index.ts index 483fffd9c485952..f68ad3da2a4b546 100644 --- a/src/plugins/es_ui_shared/public/authorization/index.ts +++ b/src/plugins/es_ui_shared/public/authorization/index.ts @@ -14,6 +14,7 @@ export { NotAuthorizedSection, Privileges, SectionError, + PageError, useAuthorizationContext, WithPrivileges, } from '../../__packages_do_not_import__/authorization'; diff --git a/src/plugins/es_ui_shared/public/index.ts b/src/plugins/es_ui_shared/public/index.ts index b46a23994fe9358..7b9013c043a0e1b 100644 --- a/src/plugins/es_ui_shared/public/index.ts +++ b/src/plugins/es_ui_shared/public/index.ts @@ -40,6 +40,7 @@ export { Privileges, MissingPrivileges, SectionError, + PageError, Error, useAuthorizationContext, } from './authorization'; diff --git a/x-pack/plugins/snapshot_restore/public/application/app.tsx b/x-pack/plugins/snapshot_restore/public/application/app.tsx index 0c064d448105fc6..a7993300079ab2b 100644 --- a/x-pack/plugins/snapshot_restore/public/application/app.tsx +++ b/x-pack/plugins/snapshot_restore/public/application/app.tsx @@ -10,14 +10,16 @@ import { Redirect, Route, Switch } from 'react-router-dom'; import { EuiPageContent } from '@elastic/eui'; import { FormattedMessage } from '@kbn/i18n/react'; +import { APP_WRAPPER_CLASS } from '../../../../../src/core/public'; + import { APP_REQUIRED_CLUSTER_PRIVILEGES } from '../../common'; import { useAuthorizationContext, - SectionError, + PageError, WithPrivileges, NotAuthorizedSection, } from '../shared_imports'; -import { SectionLoading } from './components'; +import { PageLoading } from './components'; import { DEFAULT_SECTION, Section } from './constants'; import { RepositoryAdd, @@ -42,7 +44,7 @@ export const App: React.FunctionComponent = () => { const sectionsRegex = sections.join('|'); return apiError ? ( - { `cluster.${name}`)}> {({ isLoading, hasPrivileges, privilegesMissing }) => isLoading ? ( - + - + ) : hasPrivileges ? ( -
+
@@ -84,7 +86,7 @@ export const App: React.FunctionComponent = () => {
) : ( - + = ({ children, ...rest }) => { + return ( + + + + + + + {children} + + + + ); +}; + +export const SectionLoading: React.FunctionComponent = ({ children }) => { + return ( + } + body={{children}} + data-test-subj="sectionLoading" + /> + ); +}; + +/* + * Loading component used for full page loads. + * For tabbed sections, or within the context of a wizard, + * the component may be more appropriate + */ +export const PageLoading: React.FunctionComponent = ({ children }) => { + return ( + + } + body={{children}} + data-test-subj="sectionLoading" + /> + + ); +}; diff --git a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_logistics.tsx b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_logistics.tsx index 6443d774c9ac7be..06c65a171369273 100644 --- a/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_logistics.tsx +++ b/x-pack/plugins/snapshot_restore/public/application/components/policy_form/steps/step_logistics.tsx @@ -30,7 +30,7 @@ import { useCore, useServices } from '../../../app_context'; import { DEFAULT_POLICY_SCHEDULE, DEFAULT_POLICY_FREQUENCY } from '../../../constants'; import { useLoadRepositories } from '../../../services/http'; import { linkToAddRepository } from '../../../services/navigation'; -import { SectionLoading } from '../../'; +import { InlineLoading } from '../../'; import { StepProps } from './'; import { reactRouterNavigate } from '../../../../../../../../src/plugins/kibana_react/public'; @@ -174,12 +174,12 @@ export const PolicyStepLogistics: React.FunctionComponent = ({ const renderRepositorySelect = () => { if (isLoadingRepositories) { return ( - + - + ); } diff --git a/x-pack/plugins/snapshot_restore/public/application/components/section_loading.tsx b/x-pack/plugins/snapshot_restore/public/application/components/section_loading.tsx deleted file mode 100644 index c1548ad960bb084..000000000000000 --- a/x-pack/plugins/snapshot_restore/public/application/components/section_loading.tsx +++ /dev/null @@ -1,48 +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; you may not use this file except in compliance with the Elastic License - * 2.0. - */ - -import React from 'react'; - -import { - EuiEmptyPrompt, - EuiLoadingSpinner, - EuiText, - EuiFlexGroup, - EuiFlexItem, - EuiTextColor, -} from '@elastic/eui'; - -interface Props { - inline?: boolean; - children: React.ReactNode; - [key: string]: any; -} - -export const SectionLoading: React.FunctionComponent = ({ inline, children, ...rest }) => { - if (inline) { - return ( - - - - - - - {children} - - - - ); - } - - return ( - } - body={{children}} - data-test-subj="sectionLoading" - /> - ); -}; diff --git a/x-pack/plugins/snapshot_restore/public/application/sections/home/home.tsx b/x-pack/plugins/snapshot_restore/public/application/sections/home/home.tsx index e4a23bac636d8f0..211d30181c25c6e 100644 --- a/x-pack/plugins/snapshot_restore/public/application/sections/home/home.tsx +++ b/x-pack/plugins/snapshot_restore/public/application/sections/home/home.tsx @@ -9,18 +9,7 @@ import React, { useEffect } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { Route, RouteComponentProps, Switch } from 'react-router-dom'; -import { - EuiButtonEmpty, - EuiFlexGroup, - EuiFlexItem, - EuiPageBody, - EuiPageContent, - EuiSpacer, - EuiTab, - EuiTabs, - EuiTitle, - EuiText, -} from '@elastic/eui'; +import { EuiButtonEmpty, EuiPageHeader, EuiSpacer } from '@elastic/eui'; import { BASE_PATH, Section } from '../../constants'; import { useConfig, useCore } from '../../app_context'; @@ -100,79 +89,65 @@ export const SnapshotRestoreHome: React.FunctionComponent - - - - -

- -

- - - - - - - - - - - + <> + - - - - - - - {tabs.map((tab) => ( - onSectionChange(tab.id)} - isSelected={tab.id === section} - key={tab.id} - data-test-subj={tab.id.toLowerCase() + '_tab'} - > - {tab.name} - - ))} - + + } + rightSideItems={[ + + + , + ]} + description={ + + } + tabs={tabs.map((tab) => ({ + onClick: () => onSectionChange(tab.id), + isSelected: tab.id === section, + key: tab.id, + 'data-test-subj': tab.id.toLowerCase() + '_tab', + label: tab.name, + }))} + /> - + - - - {/* We have two separate SnapshotList routes because repository names could have slashes in - * them. This would break a route with a path like snapshots/:repositoryName?/:snapshotId* - */} - - - - - - - + + + {/* We have two separate SnapshotList routes because repository names could have slashes in + * them. This would break a route with a path like snapshots/:repositoryName?/:snapshotId* + */} + + + + + + ); }; diff --git a/x-pack/plugins/snapshot_restore/public/application/sections/home/policy_list/policy_details/policy_details.tsx b/x-pack/plugins/snapshot_restore/public/application/sections/home/policy_list/policy_details/policy_details.tsx index 2bad30b95081d28..0a283d406e5aad4 100644 --- a/x-pack/plugins/snapshot_restore/public/application/sections/home/policy_list/policy_details/policy_details.tsx +++ b/x-pack/plugins/snapshot_restore/public/application/sections/home/policy_list/policy_details/policy_details.tsx @@ -40,6 +40,7 @@ import { linkToEditPolicy, linkToSnapshot } from '../../../../services/navigatio import { SectionLoading, + InlineLoading, PolicyExecuteProvider, PolicyDeleteProvider, } from '../../../../components'; @@ -318,7 +319,7 @@ export const PolicyDetails: React.FunctionComponent = ({ {policyDetails && policyDetails.policy && policyDetails.policy.inProgress ? ( <> - + = ({ values={{ snapshotName: policyDetails.policy.inProgress.snapshotName }} /> - + ) : null} {renderTabs()} diff --git a/x-pack/plugins/snapshot_restore/public/application/sections/policy_add/policy_add.tsx b/x-pack/plugins/snapshot_restore/public/application/sections/policy_add/policy_add.tsx index 7b1c10ec59e8ab7..3927b73abf0936c 100644 --- a/x-pack/plugins/snapshot_restore/public/application/sections/policy_add/policy_add.tsx +++ b/x-pack/plugins/snapshot_restore/public/application/sections/policy_add/policy_add.tsx @@ -9,13 +9,13 @@ import React, { useEffect, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { RouteComponentProps } from 'react-router-dom'; -import { EuiPageBody, EuiPageContent, EuiSpacer, EuiTitle } from '@elastic/eui'; +import { EuiPageContentBody, EuiSpacer, EuiPageHeader } from '@elastic/eui'; import { SlmPolicyPayload } from '../../../../common/types'; import { TIME_UNITS } from '../../../../common'; -import { SectionError, Error } from '../../../shared_imports'; +import { SectionError, PageError } from '../../../shared_imports'; -import { PolicyForm, SectionLoading } from '../../components'; +import { PolicyForm, PageLoading } from '../../components'; import { BASE_PATH, DEFAULT_POLICY_SCHEDULE } from '../../constants'; import { breadcrumbService, docTitleService } from '../../services/navigation'; import { addPolicy, useLoadIndices } from '../../services/http'; @@ -87,49 +87,57 @@ export const PolicyAdd: React.FunctionComponent = ({ setSaveError(null); }; + if (isLoadingIndices) { + return ( + + + + ); + } + + if (errorLoadingIndices) { + return ( + + } + error={errorLoadingIndices} + /> + ); + } + return ( - - - -

+ + -

- - - {isLoadingIndices ? ( - - - - ) : errorLoadingIndices ? ( - - } - error={errorLoadingIndices as Error} - /> - ) : ( - - )} - - + + } + /> + + + + + ); }; diff --git a/x-pack/plugins/snapshot_restore/public/application/sections/policy_edit/policy_edit.tsx b/x-pack/plugins/snapshot_restore/public/application/sections/policy_edit/policy_edit.tsx index 0ad190284577066..4ab0f15cc55230f 100644 --- a/x-pack/plugins/snapshot_restore/public/application/sections/policy_edit/policy_edit.tsx +++ b/x-pack/plugins/snapshot_restore/public/application/sections/policy_edit/policy_edit.tsx @@ -9,12 +9,12 @@ import React, { useEffect, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { RouteComponentProps } from 'react-router-dom'; -import { EuiPageBody, EuiPageContent, EuiSpacer, EuiTitle, EuiCallOut } from '@elastic/eui'; +import { EuiPageContentBody, EuiPageHeader, EuiSpacer, EuiCallOut } from '@elastic/eui'; import { SlmPolicyPayload } from '../../../../common/types'; -import { SectionError, Error } from '../../../shared_imports'; +import { SectionError, Error, PageError } from '../../../shared_imports'; import { useDecodedParams } from '../../lib'; import { TIME_UNITS } from '../../../../common/constants'; -import { SectionLoading, PolicyForm } from '../../components'; +import { PageLoading, PolicyForm } from '../../components'; import { BASE_PATH } from '../../constants'; import { useServices } from '../../app_context'; import { breadcrumbService, docTitleService } from '../../services/navigation'; @@ -106,21 +106,39 @@ export const PolicyEdit: React.FunctionComponent { + return saveError ? ( + + } + error={saveError} + /> + ) : null; + }; + + const clearSaveError = () => { + setSaveError(null); + }; + const renderLoading = () => { - return errorLoadingPolicy ? ( - + return isLoadingPolicy ? ( + - + ) : ( - + - + ); }; @@ -139,8 +157,9 @@ export const PolicyEdit: React.FunctionComponent - } - error={errorLoadingIndices as Error} - /> - ); - } - }; - - const renderSaveError = () => { - return saveError ? ( - } - error={saveError} + error={errorLoadingIndices as Error} /> - ) : null; - }; - - const clearSaveError = () => { - setSaveError(null); + ); }; - const renderContent = () => { - if (isLoadingPolicy || isLoadingIndices) { - return renderLoading(); - } - if (errorLoadingPolicy || errorLoadingIndices) { - return renderError(); - } + if (isLoadingPolicy || isLoadingIndices) { + return renderLoading(); + } - return ( - <> - {policy.isManagedPolicy ? ( - <> - - } - /> - - - ) : null} - - - ); - }; + if (errorLoadingPolicy || errorLoadingIndices) { + return renderError(); + } return ( - - - -

+ + -

- - - {renderContent()} - - + + } + /> + + + {policy.isManagedPolicy ? ( + <> + + } + /> + + + ) : null} + + + ); }; diff --git a/x-pack/plugins/snapshot_restore/public/application/sections/repository_add/repository_add.tsx b/x-pack/plugins/snapshot_restore/public/application/sections/repository_add/repository_add.tsx index 343c0b60a2253d5..100d345a49c4d2f 100644 --- a/x-pack/plugins/snapshot_restore/public/application/sections/repository_add/repository_add.tsx +++ b/x-pack/plugins/snapshot_restore/public/application/sections/repository_add/repository_add.tsx @@ -10,7 +10,7 @@ import React, { useEffect, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { RouteComponentProps } from 'react-router-dom'; -import { EuiPageBody, EuiPageContent, EuiSpacer, EuiTitle } from '@elastic/eui'; +import { EuiPageContentBody, EuiSpacer, EuiPageHeader } from '@elastic/eui'; import { Repository, EmptyRepository } from '../../../../common/types'; import { SectionError } from '../../../shared_imports'; @@ -79,25 +79,27 @@ export const RepositoryAdd: React.FunctionComponent = ({ }; return ( - - - -

+ + -

- - - - - + + } + /> + + + + + ); }; diff --git a/x-pack/plugins/snapshot_restore/public/application/sections/repository_edit/repository_edit.tsx b/x-pack/plugins/snapshot_restore/public/application/sections/repository_edit/repository_edit.tsx index e27dd255f3bdf29..9ecd1d0e3fafe99 100644 --- a/x-pack/plugins/snapshot_restore/public/application/sections/repository_edit/repository_edit.tsx +++ b/x-pack/plugins/snapshot_restore/public/application/sections/repository_edit/repository_edit.tsx @@ -5,15 +5,15 @@ * 2.0. */ -import React, { useEffect, useState, Fragment } from 'react'; +import React, { useEffect, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { RouteComponentProps } from 'react-router-dom'; -import { EuiCallOut, EuiPageBody, EuiPageContent, EuiSpacer, EuiTitle } from '@elastic/eui'; +import { EuiCallOut, EuiPageContentBody, EuiPageHeader, EuiSpacer } from '@elastic/eui'; import { Repository, EmptyRepository } from '../../../../common/types'; -import { SectionError, Error } from '../../../shared_imports'; -import { RepositoryForm, SectionLoading } from '../../components'; +import { PageError, SectionError, Error } from '../../../shared_imports'; +import { RepositoryForm, PageLoading } from '../../components'; import { BASE_PATH, Section } from '../../constants'; import { useServices } from '../../app_context'; import { breadcrumbService, docTitleService } from '../../services/navigation'; @@ -79,12 +79,12 @@ export const RepositoryEdit: React.FunctionComponent { return ( - + - + ); }; @@ -106,7 +106,7 @@ export const RepositoryEdit: React.FunctionComponent { + setSaveError(null); + }; + const renderSaveError = () => { return saveError ? ( { - setSaveError(null); - }; - - const renderContent = () => { - if (loadingRepository) { - return renderLoading(); - } - if (repositoryError) { - return renderError(); - } - - const { isManagedRepository } = repositoryData; - - return ( - - {isManagedRepository ? ( - - - } - /> - - - ) : null} - - - ); - }; - return ( - - - -

+ + -

- - - {renderContent()} - - + + } + /> + + + + {isManagedRepository ? ( + <> + + } + /> + + + ) : null} + + + ); }; diff --git a/x-pack/plugins/snapshot_restore/public/application/sections/restore_snapshot/restore_snapshot.tsx b/x-pack/plugins/snapshot_restore/public/application/sections/restore_snapshot/restore_snapshot.tsx index 685f3c9346f49c8..0f950ef3234ba2a 100644 --- a/x-pack/plugins/snapshot_restore/public/application/sections/restore_snapshot/restore_snapshot.tsx +++ b/x-pack/plugins/snapshot_restore/public/application/sections/restore_snapshot/restore_snapshot.tsx @@ -8,12 +8,12 @@ import React, { useEffect, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { RouteComponentProps } from 'react-router-dom'; -import { EuiPageBody, EuiPageContent, EuiSpacer, EuiTitle } from '@elastic/eui'; +import { EuiPageContentBody, EuiPageHeader, EuiSpacer } from '@elastic/eui'; import { SnapshotDetails, RestoreSettings } from '../../../../common/types'; -import { SectionError, Error } from '../../../shared_imports'; +import { SectionError, Error, PageError } from '../../../shared_imports'; import { BASE_PATH } from '../../constants'; -import { SectionLoading, RestoreSnapshotForm } from '../../components'; +import { PageLoading, RestoreSnapshotForm } from '../../components'; import { useServices } from '../../app_context'; import { breadcrumbService, docTitleService } from '../../services/navigation'; import { useLoadSnapshot, executeRestore } from '../../services/http'; @@ -76,12 +76,12 @@ export const RestoreSnapshot: React.FunctionComponent { return ( - + - + ); }; @@ -103,8 +103,9 @@ export const RestoreSnapshot: React.FunctionComponent { - if (loadingSnapshot) { - return renderLoading(); - } - if (snapshotError) { - return renderError(); - } + if (loadingSnapshot) { + return renderLoading(); + } - return ( - - ); - }; + if (snapshotError) { + return renderError(); + } return ( - - - -

+ + -

- - - {renderContent()} - - + + } + /> + + + + + ); }; diff --git a/x-pack/plugins/snapshot_restore/public/shared_imports.ts b/x-pack/plugins/snapshot_restore/public/shared_imports.ts index c38f0daedf99649..759453edaba5db7 100644 --- a/x-pack/plugins/snapshot_restore/public/shared_imports.ts +++ b/x-pack/plugins/snapshot_restore/public/shared_imports.ts @@ -12,6 +12,7 @@ export { Frequency, NotAuthorizedSection, SectionError, + PageError, sendRequest, SendRequestConfig, SendRequestResponse, From 809279d13adadf77abe6848166f76f1dde4cb635 Mon Sep 17 00:00:00 2001 From: Dzmitry Lemechko Date: Tue, 15 Jun 2021 17:53:53 +0200 Subject: [PATCH 2/4] [deps] update chromedriver to 91 (#102199) --- package.json | 4 ++-- yarn.lock | 9 ++++----- 2 files changed, 6 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index ff2f62f51308410..c9c6fa7f582c59c 100644 --- a/package.json +++ b/package.json @@ -670,7 +670,7 @@ "callsites": "^3.1.0", "chai": "3.5.0", "chance": "1.0.18", - "chromedriver": "^90.0.0", + "chromedriver": "^91.0.1", "clean-webpack-plugin": "^3.0.0", "cmd-shim": "^2.1.0", "compression-webpack-plugin": "^4.0.0", @@ -838,4 +838,4 @@ "yargs": "^15.4.1", "zlib": "^1.0.5" } -} +} \ No newline at end of file diff --git a/yarn.lock b/yarn.lock index a12920f72ba82ec..a9a81585000b5e7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9293,17 +9293,16 @@ chrome-trace-event@^1.0.2: dependencies: tslib "^1.9.0" -chromedriver@^90.0.0: - version "90.0.0" - resolved "https://registry.yarnpkg.com/chromedriver/-/chromedriver-90.0.0.tgz#1b18960a31a12884981bdc270b43c4356ce7a65a" - integrity sha512-k+GMmNb7cmuCCctQvUIeNxDGSq8DJauO+UKQS2qLT8aA36CPEcv8rpFepf6lRkNaIlfwdCUt/0B5bZDw3wY2yw== +chromedriver@^91.0.1: + version "91.0.1" + resolved "https://registry.yarnpkg.com/chromedriver/-/chromedriver-91.0.1.tgz#4d70a569901e356c978a41de3019c464f2a8ebd0" + integrity sha512-9LktpHiUxM4UWUsr+jI1K1YKx2GENt6BKKJ2mibPj1Wc6ODzX/3fFIlr8CZ4Ftuyga+dHTTbAyPWKwKvybEbKA== dependencies: "@testim/chrome-version" "^1.0.7" axios "^0.21.1" del "^6.0.0" extract-zip "^2.0.1" https-proxy-agent "^5.0.0" - mkdirp "^1.0.4" proxy-from-env "^1.1.0" tcp-port-used "^1.0.1" From 035f617b58bb00d978c272ad8df28bfd99d7ac27 Mon Sep 17 00:00:00 2001 From: Tyler Smalley Date: Tue, 15 Jun 2021 09:00:30 -0700 Subject: [PATCH 3/4] skip flaky suite (#102012) --- x-pack/test/functional_with_es_ssl/apps/ml/alert_flyout.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/x-pack/test/functional_with_es_ssl/apps/ml/alert_flyout.ts b/x-pack/test/functional_with_es_ssl/apps/ml/alert_flyout.ts index 63326448ec1e51e..777e6fd598f454e 100644 --- a/x-pack/test/functional_with_es_ssl/apps/ml/alert_flyout.ts +++ b/x-pack/test/functional_with_es_ssl/apps/ml/alert_flyout.ts @@ -67,7 +67,8 @@ export default ({ getPageObjects, getService }: FtrProviderContext) => { let testJobId = ''; - describe('anomaly detection alert', function () { + // Failing: See https://github.com/elastic/kibana/issues/102012 + describe.skip('anomaly detection alert', function () { this.tags('ciGroup13'); before(async () => { From ff5ecc342081f415bed7c189b9b6bd8cfd906c09 Mon Sep 17 00:00:00 2001 From: Marius Dragomir Date: Tue, 15 Jun 2021 18:17:19 +0200 Subject: [PATCH 4/4] [QA]Skip of metricbeat dashboard test (#97174) * fix flakyness of metricbeat dashboard test * skip test for now * Update _metricbeat_dashboard.js Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> --- .../apps/metricbeat/_metricbeat_dashboard.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/x-pack/test/stack_functional_integration/apps/metricbeat/_metricbeat_dashboard.js b/x-pack/test/stack_functional_integration/apps/metricbeat/_metricbeat_dashboard.js index b678e88bcf0dfff..502c950d2b11316 100644 --- a/x-pack/test/stack_functional_integration/apps/metricbeat/_metricbeat_dashboard.js +++ b/x-pack/test/stack_functional_integration/apps/metricbeat/_metricbeat_dashboard.js @@ -15,6 +15,8 @@ const ARCHIVE = resolve(INTEGRATION_TEST_ROOT, 'test/es_archives/metricbeat'); export default function ({ getService, getPageObjects, updateBaselines }) { const screenshot = getService('screenshots'); const browser = getService('browser'); + const find = getService('find'); + const log = getService('log'); const esArchiver = getService('esArchiver'); const PageObjects = getPageObjects(['common', 'dashboard', 'timePicker']); @@ -28,7 +30,7 @@ export default function ({ getService, getPageObjects, updateBaselines }) { 'dashboard', 'view/Metricbeat-system-overview-ecs?_g=(filters:!(),refreshInterval:(pause:!t,value:0),' + 'time:(from:%272020-09-29T19:02:37.902Z%27,to:%272020-09-29T19:06:43.218Z%27))&_a=' + - '(description:%27Overview%20of%20system%20metrics%27,filters:!(),fullScreenMode:!t,' + + '(description:%27Overview%20of%20system%20metrics%27,filters:!(),' + 'options:(darkTheme:!f),query:(language:kuery,query:%27%27),timeRestore:!f,' + 'title:%27%5BMetricbeat%20System%5D%20Overview%20ECS%27,viewMode:view)', { @@ -45,6 +47,7 @@ export default function ({ getService, getPageObjects, updateBaselines }) { // await PageObjects.dashboard.clickFullScreenMode(); await PageObjects.common.sleep(2000); + await find.clickByButtonText('Dismiss'); await PageObjects.dashboard.waitForRenderComplete(); await browser.setScreenshotSize(1000, 1000); }); @@ -61,7 +64,7 @@ export default function ({ getService, getPageObjects, updateBaselines }) { ); expect(percentDifference).to.be.lessThan(0.01); } finally { - await PageObjects.dashboard.clickExitFullScreenLogoButton(); + log.debug('### Screenshot taken'); } }); });