changes based on review

elastic · Jun 2, 2021 · b532118 · b532118
1 parent 79a5440
commit b532118
Show file tree

Hide file tree

Showing 6 changed files with 20 additions and 22 deletions.
diff --git a/src/plugins/home/public/application/components/tutorial_directory.js b/src/plugins/home/public/application/components/tutorial_directory.js
@@ -199,7 +199,7 @@ class TutorialDirectoryUi extends React.Component {
 
   renderTabContent = () => {
     const tab = this.tabs.find(({ id }) => id === this.state.selectedTabId);
-    if (tab?.content !== undefined) {
+    if (tab?.content) {
       return tab.content;
     }
 

diff --git a/src/plugins/home/public/services/add_data/add_data_service.ts b/src/plugins/home/public/services/add_data/add_data_service.ts
@@ -16,9 +16,7 @@ export interface AddDataTab {
 }
 
 export class AddDataService {
-  private addDataTabs: {
-    [key: string]: AddDataTab;
-  } = {};
+  private addDataTabs: Record<string, AddDataTab> = {};
 
   public setup() {
     return {

diff --git a/x-pack/plugins/file_data_visualizer/kibana.json b/x-pack/plugins/file_data_visualizer/kibana.json
@@ -10,12 +10,12 @@
     "embeddable",
     "share",
     "discover",
-    "fileUpload",
-    "home"
+    "fileUpload"
   ],
   "optionalPlugins": [
     "security",
-    "maps"
+    "maps",
+    "home"
   ],
   "requiredBundles": [
     "kibanaReact",

diff --git a/x-pack/plugins/file_data_visualizer/public/application/file_datavisualizer.tsx b/x-pack/plugins/file_data_visualizer/public/application/file_datavisualizer.tsx
@@ -28,3 +28,7 @@ export const FileDataVisualizer: FC = () => {
     </KibanaContextProvider>
   );
 };
+
+// exporting as default so it can be used with React.lazy
+// eslint-disable-next-line import/no-default-export
+export default FileDataVisualizer;
diff --git a/x-pack/plugins/file_data_visualizer/public/lazy_load_bundle/component_wrapper.tsx b/x-pack/plugins/file_data_visualizer/public/lazy_load_bundle/component_wrapper.tsx
@@ -5,20 +5,14 @@
  * 2.0.
  */
 
-import React, { FC, useState, useEffect } from 'react';
+import React, { FC } from 'react';
+
+const FileDataVisualizerComponent = React.lazy(() => import('../application/file_datavisualizer'));
 
 export const FileDataVisualizerWrapper: FC = () => {
-  const [FileDataVisualizerComponent, setFileDataVisualizerComponent] = useState<FC<{}> | null>(
-    null
+  return (
+    <React.Suspense fallback={<div />}>
+      <FileDataVisualizerComponent />
+    </React.Suspense>
   );
-
-  useEffect(() => {
-    if (FileDataVisualizerComponent === null) {
-      import('../application/file_datavisualizer').then(({ FileDataVisualizer }) => {
-        setFileDataVisualizerComponent(FileDataVisualizer);
-      });
-    }
-  }, [FileDataVisualizerComponent]);
-
-  return <>{FileDataVisualizerComponent}</>;
 };
diff --git a/x-pack/plugins/file_data_visualizer/public/plugin.ts b/x-pack/plugins/file_data_visualizer/public/plugin.ts
@@ -21,7 +21,7 @@ import { getMaxBytesFormatted } from './application/util/get_max_bytes';
 import { registerHomeAddData } from './register_home';
 
 export interface FileDataVisualizerSetupDependencies {
-  home: HomePublicPluginSetup;
+  home?: HomePublicPluginSetup;
 }
 export interface FileDataVisualizerStartDependencies {
   data: DataPublicPluginStart;
@@ -44,7 +44,9 @@ export class FileDataVisualizerPlugin
       FileDataVisualizerStartDependencies
     > {
   public setup(core: CoreSetup, plugins: FileDataVisualizerSetupDependencies) {
-    registerHomeAddData(plugins.home);
+    if (plugins.home) {
+      registerHomeAddData(plugins.home);
+    }
   }
 
   public start(core: CoreStart, plugins: FileDataVisualizerStartDependencies) {