[Fleet] Fleet Server flyout fixes (#136566)

* Go to Fleet mode when continue enrolling is selected Fixes #136080 * Fix max width in Fleet Server flyout Fixes #136079 * Use fleet mode when fleet server ready, standalone mode otherwise per PR feedback
elastic · Jul 19, 2022 · f862943 · f862943
1 parent ef3213a
commit f862943
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 6 deletions.
diff --git a/x-pack/plugins/fleet/.storybook/context/http.ts b/x-pack/plugins/fleet/.storybook/context/http.ts
@@ -93,6 +93,14 @@ export const getHttp = (basepath = BASE_PATH) => {
         };
       }
 
+      if (path.match('/api/fleet/agent_download_sources')) {
+        return {
+          items: [
+            { name: 'Default Download Source', is_default: true, host: 'https://www.example.com' },
+          ],
+        };
+      }
+
       action(path)(`UNSUPPORTED ROUTE: GET ${path}`);
       return {};
     }) as HttpHandler,

diff --git a/x-pack/plugins/fleet/public/applications/fleet/app.tsx b/x-pack/plugins/fleet/public/applications/fleet/app.tsx
@@ -27,7 +27,7 @@ import type { FleetConfigType, FleetStartServices } from '../../plugin';
 
 import { PackageInstallProvider } from '../integrations/hooks';
 
-import { useAuthz, useFlyoutContext } from './hooks';
+import { useAuthz, useFleetStatus, useFlyoutContext } from './hooks';
 
 import {
   ConfigContext,
@@ -304,6 +304,7 @@ const FleetTopNav = memo(
 export const AppRoutes = memo(
   ({ setHeaderActionMenu }: { setHeaderActionMenu: AppMountParameters['setHeaderActionMenu'] }) => {
     const flyoutContext = useFlyoutContext();
+    const fleetStatus = useFleetStatus();
 
     return (
       <>
@@ -361,7 +362,11 @@ export const AppRoutes = memo(
         {flyoutContext.isEnrollmentFlyoutOpen && (
           <EuiPortal>
             <AgentEnrollmentFlyout
-              defaultMode="standalone"
+              defaultMode={
+                fleetStatus.isReady && !fleetStatus.missingRequirements?.includes('fleet_server')
+                  ? 'managed'
+                  : 'standalone'
+              }
               isIntegrationFlow={true}
               onClose={() => flyoutContext.closeEnrollmentFlyout()}
             />

diff --git a/...leet/public/applications/fleet/components/fleet_server_instructions/steps/get_started.tsx b/...leet/public/applications/fleet/components/fleet_server_instructions/steps/get_started.tsx
@@ -22,6 +22,7 @@ import {
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n-react';
+import { css } from '@emotion/react';
 
 import { useLink } from '../../../hooks';
 
@@ -97,7 +98,11 @@ const GettingStartedStepContent: React.FunctionComponent<{
 
       <EuiForm onSubmit={quickStartCreateForm.submit}>
         <EuiFlexGroup>
-          <EuiFlexItem>
+          <EuiFlexItem
+            css={css`
+              max-width: 100%;
+            `}
+          >
             <FleetServerHostComboBox
               fleetServerHost={fleetServerHost}
               fleetServerHostSettings={fleetServerHostSettings}

diff --git a/x-pack/plugins/fleet/public/applications/integrations/app.tsx b/x-pack/plugins/fleet/public/applications/integrations/app.tsx
@@ -20,7 +20,12 @@ import { KibanaThemeProvider } from '@kbn/kibana-react-plugin/public';
 
 import type { FleetConfigType, FleetStartServices } from '../../plugin';
 
-import { ConfigContext, FleetStatusProvider, KibanaVersionContext } from '../../hooks';
+import {
+  ConfigContext,
+  FleetStatusProvider,
+  KibanaVersionContext,
+  useFleetStatus,
+} from '../../hooks';
 
 import { FleetServerFlyout } from '../fleet/components';
 
@@ -110,6 +115,7 @@ export const IntegrationsAppContext: React.FC<{
 
 export const AppRoutes = memo(() => {
   const flyoutContext = useFlyoutContext();
+  const fleetStatus = useFleetStatus();
 
   return (
     <>
@@ -142,7 +148,11 @@ export const AppRoutes = memo(() => {
       {flyoutContext.isEnrollmentFlyoutOpen && (
         <EuiPortal>
           <AgentEnrollmentFlyout
-            defaultMode="standalone"
+            defaultMode={
+              fleetStatus.isReady && fleetStatus.missingRequirements?.includes('fleet_server')
+                ? 'managed'
+                : 'standalone'
+            }
             isIntegrationFlow={true}
             onClose={() => flyoutContext.closeEnrollmentFlyout()}
           />

diff --git a/x-pack/plugins/fleet/public/hooks/use_flyout_context.tsx b/x-pack/plugins/fleet/public/hooks/use_flyout_context.tsx
@@ -27,7 +27,9 @@ export const FlyoutContextProvider: React.FunctionComponent = ({ children }) =>
     <agentFlyoutContext.Provider
       value={{
         isEnrollmentFlyoutOpen,
-        openEnrollmentFlyout: () => setIsEnrollmentFlyoutOpen(true),
+        openEnrollmentFlyout: () => {
+          setIsEnrollmentFlyoutOpen(true);
+        },
         closeEnrollmentFlyout: () => setIsEnrollmentFlyoutOpen(false),
         isFleetServerFlyoutOpen,
         openFleetServerFlyout: () => setIsFleetServerFlyoutOpen(true),