fixing issues

cauemarcondes · Jun 15, 2021 · 7e441d2 · 7e441d2
1 parent c051953
commit 7e441d2
Show file tree

Hide file tree

Showing 8 changed files with 22 additions and 25 deletions.
diff --git a/src/plugins/home/public/application/components/tutorial/instruction.js b/src/plugins/home/public/application/components/tutorial/instruction.js
@@ -24,7 +24,14 @@ import { FormattedMessage } from '@kbn/i18n/react';
 
 import { getServices } from '../../kibana_services';
 
-export function Instruction({ commands, paramValues, textPost, textPre, replaceTemplateStrings }) {
+export function Instruction({
+  commands,
+  paramValues,
+  textPost,
+  textPre,
+  replaceTemplateStrings,
+  customComponentName,
+}) {
   const { tutorialService, http, uiSettings, getBasePath } = getServices();
 
   let pre;
@@ -41,7 +48,7 @@ export function Instruction({ commands, paramValues, textPost, textPre, replaceT
       </div>
     );
   }
-  const customComponent = tutorialService.getCustomComponent();
+  const customComponent = tutorialService.getCustomComponent(customComponentName);
   //Memoize the custom component so it wont rerender everytime
   const LazyCustomComponent = useMemo(() => {
     if (customComponent) {
@@ -112,5 +119,5 @@ Instruction.propTypes = {
   textPost: PropTypes.string,
   textPre: PropTypes.string,
   replaceTemplateStrings: PropTypes.func.isRequired,
-  customComponent: PropTypes.string,
+  customComponentName: PropTypes.string,
 };
diff --git a/src/plugins/home/public/application/components/tutorial/instruction_set.js b/src/plugins/home/public/application/components/tutorial/instruction_set.js
@@ -186,7 +186,7 @@ class InstructionSetUi extends React.Component {
           textPre={instruction.textPre}
           textPost={instruction.textPost}
           replaceTemplateStrings={this.props.replaceTemplateStrings}
-          customComponent={instruction.customComponent}
+          customComponentName={instruction.customComponentName}
         />
       );
       return {

diff --git a/src/plugins/home/public/application/components/tutorial/tutorial.js b/src/plugins/home/public/application/components/tutorial/tutorial.js
@@ -72,7 +72,6 @@ class TutorialUi extends React.Component {
     }
 
     if (tutorial) {
-      getServices().tutorialService.setTutorial(tutorial);
       // eslint-disable-next-line react/no-did-mount-set-state
       this.setState(
         {
@@ -174,7 +173,9 @@ class TutorialUi extends React.Component {
 
     //Checks if a custom status check callback  was registered in the CLIENT
     //that matches the same name registered in the SERVER (customStatusCheckName)
-    const customStatusCheckCallback = getServices().tutorialService.getCustomStatusCheck();
+    const customStatusCheckCallback = getServices().tutorialService.getCustomStatusCheck(
+      this.state.tutorial.customStatusCheckName
+    );
 
     const [esHitsStatusCheck, customStatusCheck] = await Promise.all([
       ...(esHitsCheckConfig ? [this.fetchEsHitsStatus(esHitsCheckConfig)] : []),

diff --git a/src/plugins/home/public/services/tutorials/tutorial_service.mock.ts b/src/plugins/home/public/services/tutorials/tutorial_service.mock.ts
@@ -30,8 +30,6 @@ const createMock = (): jest.Mocked<PublicMethodsOf<TutorialService>> => {
     getModuleNotices: jest.fn(() => []),
     getCustomStatusCheck: jest.fn(),
     getCustomComponent: jest.fn(),
-    setTutorial: jest.fn(),
-    getTutorial: jest.fn(),
   };
   service.setup.mockImplementation(createSetupMock);
   return service;

diff --git a/src/plugins/home/public/services/tutorials/tutorial_service.ts b/src/plugins/home/public/services/tutorials/tutorial_service.ts
@@ -34,7 +34,6 @@ export class TutorialService {
   private tutorialModuleNotices: { [key: string]: TutorialModuleNoticeComponent } = {};
   private customStatusCheck: Record<string, CustomStatusCheckCallback> = {};
   private customComponent: Record<string, CustomComponent> = {};
-  private tutorial: any;
 
   public setup() {
     return {
@@ -107,20 +106,12 @@ export class TutorialService {
     return Object.values(this.tutorialModuleNotices);
   }
 
-  public getCustomStatusCheck() {
-    return this.customStatusCheck[this.tutorial?.customComponentName];
+  public getCustomStatusCheck(customStatusCheckName: string) {
+    return this.customStatusCheck[customStatusCheckName];
   }
 
-  public getCustomComponent() {
-    return this.customComponent[this.tutorial?.customComponentName];
-  }
-
-  public setTutorial(tutorial: any) {
-    this.tutorial = tutorial;
-  }
-
-  public getTutorial() {
-    return this.tutorial;
+  public getCustomComponent(customComponentName: string) {
+    return this.customComponent[customComponentName];
   }
 }
 

diff --git a/src/plugins/home/server/services/tutorials/lib/tutorial_schema.ts b/src/plugins/home/server/services/tutorials/lib/tutorial_schema.ts
@@ -56,7 +56,7 @@ const instructionSchema = schema.object({
   textPre: schema.maybe(schema.string()),
   commands: schema.maybe(schema.arrayOf(schema.string())),
   textPost: schema.maybe(schema.string()),
-  customComponent: schema.maybe(schema.string()),
+  customComponentName: schema.maybe(schema.string()),
 });
 export type Instruction = TypeOf<typeof instructionSchema>;
 
@@ -154,7 +154,6 @@ export const tutorialSchema = schema.object({
   savedObjects: schema.maybe(schema.arrayOf(schema.any())),
   savedObjectsInstallMsg: schema.maybe(schema.string()),
   customStatusCheckName: schema.maybe(schema.string()),
-  customComponentName: schema.maybe(schema.string()),
 });
 
 export type TutorialSchema = TypeOf<typeof tutorialSchema>;
diff --git a/x-pack/plugins/apm/server/tutorial/envs/on_prem.ts b/x-pack/plugins/apm/server/tutorial/envs/on_prem.ts
@@ -71,7 +71,9 @@ export function onPremInstructions({
         instructionVariants: [
           {
             id: INSTRUCTION_VARIANT.FLEET,
-            instructions: [{ customComponent: 'apm_fleet' }],
+            instructions: [
+              { customComponentName: 'TutorialFleetInstructions' },
+            ],
           },
           {
             id: INSTRUCTION_VARIANT.OSX,

diff --git a/x-pack/plugins/apm/server/tutorial/index.ts b/x-pack/plugins/apm/server/tutorial/index.ts
@@ -104,7 +104,6 @@ It allows you to monitor the performance of thousands of applications in real ti
     euiIconType: 'apmApp',
     artifacts,
     customStatusCheckName: 'apm_fleet_server_status_check',
-    customComponentName: 'TutorialFleetInstructions',
     onPrem: onPremInstructions(indices),
     elasticCloud: createElasticCloudInstructions(cloud),
     previewImagePath: '/plugins/apm/assets/apm.png',