diff --git a/x-pack/plugins/fleet/public/applications/fleet/app.tsx b/x-pack/plugins/fleet/public/applications/fleet/app.tsx index c4cc4d92f5d95c..8be6232733defc 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/app.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/app.tsx @@ -5,12 +5,13 @@ * 2.0. */ +import type { FunctionComponent } from 'react'; import React, { memo, useEffect, useState } from 'react'; import type { AppMountParameters } from 'kibana/public'; import { EuiCode, EuiEmptyPrompt, EuiErrorBoundary, EuiPanel, EuiPortal } from '@elastic/eui'; import type { History } from 'history'; import { createHashHistory } from 'history'; -import { Router, Redirect, Route, Switch } from 'react-router-dom'; +import { Router, Redirect, Route, Switch, useRouteMatch } from 'react-router-dom'; import { FormattedMessage } from '@kbn/i18n/react'; import { i18n } from '@kbn/i18n'; import styled from 'styled-components'; @@ -39,7 +40,7 @@ import { Error, Loading, SettingFlyout, FleetSetupLoading } from './components'; import type { UIExtensionsStorage } from './types'; import { FLEET_ROUTING_PATHS } from './constants'; -import { DefaultLayout, WithoutHeaderLayout } from './layouts'; +import { DefaultLayout, DefaultPageTitle, WithoutHeaderLayout, WithHeaderLayout } from './layouts'; import { AgentPolicyApp } from './sections/agent_policy'; import { DataStreamApp } from './sections/data_stream'; import { AgentsApp } from './sections/agents'; @@ -48,11 +49,18 @@ import { EnrollmentTokenListPage } from './sections/agents/enrollment_token_list const FEEDBACK_URL = 'https://ela.st/fleet-feedback'; -const ErrorLayout = ({ children }: { children: JSX.Element }) => ( +const ErrorLayout: FunctionComponent<{ isAddIntegrationsPath: boolean }> = ({ + isAddIntegrationsPath, + children, +}) => ( - - {children} - + {isAddIntegrationsPath ? ( + }>{children} + ) : ( + + {children} + + )} ); @@ -71,6 +79,8 @@ export const WithPermissionsAndSetup: React.FC = memo(({ children }) => { const [isInitialized, setIsInitialized] = useState(false); const [initializationError, setInitializationError] = useState(null); + const isAddIntegrationsPath = !!useRouteMatch(FLEET_ROUTING_PATHS.add_integration_to_policy); + useEffect(() => { (async () => { setIsPermissionsLoading(false); @@ -109,7 +119,7 @@ export const WithPermissionsAndSetup: React.FC = memo(({ children }) => { if (isPermissionsLoading || permissionsError) { return ( - + {isPermissionsLoading ? ( ) : permissionsError === 'REQUEST_ERROR' ? ( @@ -168,7 +178,7 @@ export const WithPermissionsAndSetup: React.FC = memo(({ children }) => { if (!isInitialized || initializationError) { return ( - + {initializationError ? ( - - - + diff --git a/x-pack/plugins/fleet/public/applications/fleet/layouts/default.tsx b/x-pack/plugins/fleet/public/applications/fleet/layouts/default/default.tsx similarity index 65% rename from x-pack/plugins/fleet/public/applications/fleet/layouts/default.tsx rename to x-pack/plugins/fleet/public/applications/fleet/layouts/default/default.tsx index f312ff374d792c..c6ef212b3995eb 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/layouts/default.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/layouts/default/default.tsx @@ -6,12 +6,13 @@ */ import React from 'react'; -import { EuiText, EuiFlexGroup, EuiFlexItem, EuiTitle } from '@elastic/eui'; import { FormattedMessage } from '@kbn/i18n/react'; -import type { Section } from '../sections'; -import { useLink, useConfig } from '../hooks'; -import { WithHeaderLayout } from '../../../layouts'; +import type { Section } from '../../sections'; +import { useLink, useConfig } from '../../hooks'; +import { WithHeaderLayout } from '../../../../layouts'; + +import { DefaultPageTitle } from './default_page_title'; interface Props { section?: Section; @@ -24,31 +25,7 @@ export const DefaultLayout: React.FunctionComponent = ({ section, childre return ( - - - - -

- -

-
-
-
-
- - -

- -

-
-
- - } + leftColumn={} tabs={[ { name: ( diff --git a/x-pack/plugins/fleet/public/applications/fleet/layouts/default/default_page_title.tsx b/x-pack/plugins/fleet/public/applications/fleet/layouts/default/default_page_title.tsx new file mode 100644 index 00000000000000..e525a059b78372 --- /dev/null +++ b/x-pack/plugins/fleet/public/applications/fleet/layouts/default/default_page_title.tsx @@ -0,0 +1,40 @@ +/* + * 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 type { FunctionComponent } from 'react'; +import React from 'react'; + +import { FormattedMessage } from '@kbn/i18n/react'; +import { EuiFlexGroup, EuiFlexItem, EuiTitle, EuiText } from '@elastic/eui'; + +export const DefaultPageTitle: FunctionComponent = () => { + return ( + + + + + +

+ +

+
+
+
+
+ + +

+ +

+
+
+
+ ); +}; diff --git a/x-pack/plugins/fleet/public/applications/fleet/layouts/default/index.ts b/x-pack/plugins/fleet/public/applications/fleet/layouts/default/index.ts new file mode 100644 index 00000000000000..9b0d3ee06138f1 --- /dev/null +++ b/x-pack/plugins/fleet/public/applications/fleet/layouts/default/index.ts @@ -0,0 +1,9 @@ +/* + * 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. + */ + +export { DefaultLayout } from './default'; +export { DefaultPageTitle } from './default_page_title'; diff --git a/x-pack/plugins/fleet/public/applications/fleet/layouts/index.tsx b/x-pack/plugins/fleet/public/applications/fleet/layouts/index.tsx index 71cb8d3aeeb369..0c07f1ffecb792 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/layouts/index.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/layouts/index.tsx @@ -7,4 +7,4 @@ export * from '../../../layouts'; -export { DefaultLayout } from './default'; +export { DefaultLayout, DefaultPageTitle } from './default';