Merge branch 'main' into sm-shard-allocations

elastic · Nov 16, 2022 · 45d374d · 45d374d
2 parents 01ed1db + 74e068c
commit 45d374d
Show file tree

Hide file tree

Showing 127 changed files with 5,867 additions and 611 deletions.
diff --git a/src/plugins/guided_onboarding/public/components/guide_button.tsx b/src/plugins/guided_onboarding/public/components/guide_button.tsx
@@ -46,8 +46,8 @@ export const GuideButton = ({
   isGuidePanelOpen,
   navigateToLandingPage,
 }: GuideButtonProps) => {
-  // TODO handle loading, error state
-  // https://github.com/elastic/kibana/issues/139799, https://github.com/elastic/kibana/issues/139798
+  // TODO handle loading state
+  // https://github.com/elastic/kibana/issues/139799
 
   // if there is no active guide
   if (!pluginState || !pluginState.activeGuide || !pluginState.activeGuide.isActive) {

diff --git a/src/plugins/guided_onboarding/public/components/guide_panel.test.tsx b/src/plugins/guided_onboarding/public/components/guide_panel.test.tsx
@@ -10,6 +10,7 @@ import { act } from 'react-dom/test-utils';
 import React from 'react';
 
 import { applicationServiceMock } from '@kbn/core-application-browser-mocks';
+import { notificationServiceMock } from '@kbn/core-notifications-browser-mocks';
 import { httpServiceMock } from '@kbn/core/public/mocks';
 import type { HttpSetup } from '@kbn/core/public';
 import { registerTestBed, TestBed } from '@kbn/test-jest-helpers';
@@ -30,6 +31,7 @@ import {
 import { GuidePanel } from './guide_panel';
 
 const applicationMock = applicationServiceMock.createStartContract();
+const notificationsMock = notificationServiceMock.createStartContract();
 
 const setupComponentWithPluginStateMock = async (
   httpClient: jest.Mocked<HttpSetup>,
@@ -44,7 +46,9 @@ const setupComponentWithPluginStateMock = async (
 
 const setupGuidePanelComponent = async (api: GuidedOnboardingApi) => {
   let testBed: TestBed;
-  const GuidePanelComponent = () => <GuidePanel application={applicationMock} api={api} />;
+  const GuidePanelComponent = () => (
+    <GuidePanel application={applicationMock} api={api} notifications={notificationsMock} />
+  );
   await act(async () => {
     testBed = registerTestBed(GuidePanelComponent)();
   });
@@ -425,6 +429,12 @@ describe('Guided setup', () => {
 
     describe('Quit guide modal', () => {
       beforeEach(async () => {
+        httpClient.put.mockResolvedValueOnce({
+          pluginState: {
+            status: 'quit',
+            isActivePeriod: true,
+          },
+        });
         testBed = await setupComponentWithPluginStateMock(httpClient, {
           status: 'in_progress',
           isActivePeriod: true,
@@ -457,12 +467,6 @@ describe('Guided setup', () => {
       });
 
       test('cancels out of the quit guide confirmation modal', async () => {
-        httpClient.put.mockResolvedValueOnce({
-          pluginState: {
-            status: 'quit',
-            isActivePeriod: true,
-          },
-        });
         const { component, find, exists } = testBed;
 
         await act(async () => {

diff --git a/src/plugins/guided_onboarding/public/components/guide_panel.tsx b/src/plugins/guided_onboarding/public/components/guide_panel.tsx
@@ -28,7 +28,7 @@ import {
 
 import { i18n } from '@kbn/i18n';
 
-import { ApplicationStart } from '@kbn/core/public';
+import { ApplicationStart, NotificationsStart } from '@kbn/core/public';
 import type { GuideState, GuideStep as GuideStepStatus } from '@kbn/guided-onboarding';
 
 import { GuideId } from '@kbn/guided-onboarding';
@@ -45,6 +45,7 @@ import { GuideButton } from './guide_button';
 interface GuidePanelProps {
   api: GuidedOnboardingApi;
   application: ApplicationStart;
+  notifications: NotificationsStart;
 }
 
 const getProgress = (state?: GuideState): number => {
@@ -73,7 +74,7 @@ const getTelemetryGuideId = (guideId?: GuideId) => {
   }
 };
 
-export const GuidePanel = ({ api, application }: GuidePanelProps) => {
+export const GuidePanel = ({ api, application, notifications }: GuidePanelProps) => {
   const { euiTheme } = useEuiTheme();
   const [isGuideOpen, setIsGuideOpen] = useState(false);
   const [isQuitGuideModalOpen, setIsQuitGuideModalOpen] = useState(false);
@@ -90,22 +91,31 @@ export const GuidePanel = ({ api, application }: GuidePanelProps) => {
       const { id, status } = step;
       const guideId: GuideId = pluginState!.activeGuide!.guideId!;
 
-      if (status === 'ready_to_complete') {
-        return await api.completeGuideStep(guideId, id);
-      }
+      try {
+        if (status === 'ready_to_complete') {
+          return await api.completeGuideStep(guideId, id);
+        }
 
-      if (status === 'active' || status === 'in_progress') {
-        await api.startGuideStep(guideId, id);
+        if (status === 'active' || status === 'in_progress') {
+          await api.startGuideStep(guideId, id);
 
-        if (stepConfig.location) {
-          await application.navigateToApp(stepConfig.location.appID, {
-            path: stepConfig.location.path,
-          });
+          if (stepConfig.location) {
+            await application.navigateToApp(stepConfig.location.appID, {
+              path: stepConfig.location.path,
+            });
 
-          if (stepConfig.manualCompletion?.readyToCompleteOnNavigation) {
-            await api.completeGuideStep(guideId, id);
+            if (stepConfig.manualCompletion?.readyToCompleteOnNavigation) {
+              await api.completeGuideStep(guideId, id);
+            }
           }
         }
+      } catch (error) {
+        notifications.toasts.addDanger({
+          title: i18n.translate('guidedOnboarding.dropdownPanel.stepHandlerError', {
+            defaultMessage: 'Unable to update the guide. Please try again later.',
+          }),
+          text: error.message,
+        });
       }
     }
   };
@@ -118,11 +128,20 @@ export const GuidePanel = ({ api, application }: GuidePanelProps) => {
   const completeGuide = async (
     completedGuideRedirectLocation: GuideConfig['completedGuideRedirectLocation']
   ) => {
-    await api.completeGuide(pluginState!.activeGuide!.guideId!);
+    try {
+      await api.completeGuide(pluginState!.activeGuide!.guideId!);
 
-    if (completedGuideRedirectLocation) {
-      const { appID, path } = completedGuideRedirectLocation;
-      application.navigateToApp(appID, { path });
+      if (completedGuideRedirectLocation) {
+        const { appID, path } = completedGuideRedirectLocation;
+        application.navigateToApp(appID, { path });
+      }
+    } catch (error) {
+      notifications.toasts.addDanger({
+        title: i18n.translate('guidedOnboarding.dropdownPanel.completeGuideError', {
+          defaultMessage: 'Unable to update the guide. Please try again later.',
+        }),
+        text: error.message,
+      });
     }
   };
 
@@ -153,8 +172,8 @@ export const GuidePanel = ({ api, application }: GuidePanelProps) => {
 
   const guideConfig = getGuideConfig(pluginState?.activeGuide?.guideId)!;
 
-  // TODO handle loading, error state
-  // https://github.com/elastic/kibana/issues/139799, https://github.com/elastic/kibana/issues/139798
+  // TODO handle loading state
+  // https://github.com/elastic/kibana/issues/139799
 
   const stepsCompleted = getProgress(pluginState?.activeGuide);
   const isGuideReadyToComplete = pluginState?.activeGuide?.status === 'ready_to_complete';
@@ -374,6 +393,7 @@ export const GuidePanel = ({ api, application }: GuidePanelProps) => {
           closeModal={closeQuitGuideModal}
           currentGuide={pluginState!.activeGuide!}
           telemetryGuideId={telemetryGuideId!}
+          notifications={notifications}
         />
       )}
     </>

diff --git a/src/plugins/guided_onboarding/public/components/quit_guide_modal.tsx b/src/plugins/guided_onboarding/public/components/quit_guide_modal.tsx
@@ -19,25 +19,38 @@ import {
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import type { GuideState } from '@kbn/guided-onboarding';
+import { NotificationsStart } from '@kbn/core/public';
 import { apiService } from '../services/api';
 
 interface QuitGuideModalProps {
   closeModal: () => void;
   currentGuide: GuideState;
   telemetryGuideId: string;
+  notifications: NotificationsStart;
 }
 
 export const QuitGuideModal = ({
   closeModal,
   currentGuide,
   telemetryGuideId,
+  notifications,
 }: QuitGuideModalProps) => {
-  const [isDeleting, setIsDeleting] = useState<boolean>(false);
+  const [isLoading, setIsLoading] = useState<boolean>(false);
 
-  const deleteGuide = async () => {
-    setIsDeleting(true);
-    await apiService.deactivateGuide(currentGuide);
-    closeModal();
+  const deactivateGuide = async () => {
+    try {
+      setIsLoading(true);
+      await apiService.deactivateGuide(currentGuide);
+      closeModal();
+    } catch (error) {
+      setIsLoading(false);
+      notifications.toasts.addDanger({
+        title: i18n.translate('guidedOnboarding.quitGuideModal.deactivateGuideError', {
+          defaultMessage: 'Unable to update the guide. Please try again later.',
+        }),
+        text: error.message,
+      });
+    }
   };
 
   return (
@@ -77,8 +90,8 @@ export const QuitGuideModal = ({
         <EuiButton
           // Used for FS tracking and tests
           data-test-subj={`onboarding--quitGuideButton--${telemetryGuideId}`}
-          onClick={deleteGuide}
-          isLoading={isDeleting}
+          onClick={deactivateGuide}
+          isLoading={isLoading}
           fill
           color="warning"
         >

diff --git a/src/plugins/guided_onboarding/public/plugin.tsx b/src/plugins/guided_onboarding/public/plugin.tsx
@@ -10,7 +10,14 @@ import ReactDOM from 'react-dom';
 import React from 'react';
 import * as Rx from 'rxjs';
 import { I18nProvider } from '@kbn/i18n-react';
-import { CoreSetup, CoreStart, Plugin, CoreTheme, ApplicationStart } from '@kbn/core/public';
+import {
+  CoreSetup,
+  CoreStart,
+  Plugin,
+  CoreTheme,
+  ApplicationStart,
+  NotificationsStart,
+} from '@kbn/core/public';
 
 import { KibanaThemeProvider } from '@kbn/kibana-react-plugin/public';
 import type {
@@ -33,7 +40,7 @@ export class GuidedOnboardingPlugin
     core: CoreStart,
     { cloud }: AppPluginStartDependencies
   ): GuidedOnboardingPluginStart {
-    const { chrome, http, theme, application } = core;
+    const { chrome, http, theme, application, notifications } = core;
 
     // Initialize services
     apiService.setup(http, !!cloud?.isCloudEnabled);
@@ -48,6 +55,7 @@ export class GuidedOnboardingPlugin
             theme$: theme.theme$,
             api: apiService,
             application,
+            notifications,
           }),
       });
     }
@@ -65,16 +73,18 @@ export class GuidedOnboardingPlugin
     theme$,
     api,
     application,
+    notifications,
   }: {
     targetDomElement: HTMLElement;
     theme$: Rx.Observable<CoreTheme>;
     api: ApiService;
     application: ApplicationStart;
+    notifications: NotificationsStart;
   }) {
     ReactDOM.render(
       <KibanaThemeProvider theme$={theme$}>
         <I18nProvider>
-          <GuidePanel api={api} application={application} />
+          <GuidePanel api={api} application={application} notifications={notifications} />
         </I18nProvider>
       </KibanaThemeProvider>,
       targetDomElement