Applying Clint's comments

elastic · Apr 7, 2022 · 800117c · 800117c
1 parent 79c1f30
commit 800117c
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 9 deletions.
diff --git a/packages/kbn-shared-ux-components/src/page_template/page_template_inner.test.tsx b/packages/kbn-shared-ux-components/src/page_template/page_template_inner.test.tsx
@@ -6,11 +6,16 @@
  * Side Public License, v 1.
  */
 
-import { shallow } from 'enzyme';
-import { KibanaPageTemplateInner } from './page_template_inner';
+// imports from npm packages
 import React from 'react';
+import { shallow } from 'enzyme';
+
+// imports from elastic packages
 import { EuiEmptyPrompt, EuiPageTemplate } from '@elastic/eui';
 
+// imports from immediate files
+import { KibanaPageTemplateInner } from './page_template_inner';
+
 describe('KibanaPageTemplateInner', () => {
   const pageHeader = {
     iconType: 'test',

diff --git a/packages/kbn-shared-ux-components/src/page_template/page_template_inner.tsx b/packages/kbn-shared-ux-components/src/page_template/page_template_inner.tsx
@@ -9,6 +9,7 @@
 import React, { FunctionComponent } from 'react';
 
 import { EuiEmptyPrompt, EuiPageTemplate } from '@elastic/eui';
+
 import { withSolutionNav } from './with_solution_nav';
 import { KibanaPageTemplateProps } from './types';
 import { getClasses } from './util';
@@ -31,17 +32,20 @@ export const KibanaPageTemplateInner: FunctionComponent<Props> = ({
    */
   const emptyStateDefaultTemplate = 'centeredBody';
   let header = pageHeader;
+
   if (isEmptyState) {
     if (pageHeader && !children) {
       template = template ?? emptyStateDefaultTemplate;
       const { iconType, pageTitle, description, rightSideItems } = pageHeader;
+      const title = pageTitle ? <h1>{pageTitle}</h1> : undefined;
+      const body = description ? <p>{description}</p> : undefined;
       header = undefined;
       children = (
         <EuiEmptyPrompt
           iconType={iconType}
-          iconColor={''} // This is likely a solution or app logo, so keep it multi-color
-          title={pageTitle ? <h1>{pageTitle}</h1> : undefined}
-          body={description ? <p>{description}</p> : undefined}
+          iconColor="" // This is likely a solution or app logo, so keep it multi-color
+          title={title}
+          body={body}
           actions={rightSideItems}
         />
       );

diff --git a/packages/kbn-shared-ux-components/src/page_template/with_solution_nav.tsx b/packages/kbn-shared-ux-components/src/page_template/with_solution_nav.tsx
@@ -63,15 +63,14 @@ export const withSolutionNav = (WrappedComponent: ComponentType<KibanaPageTempla
     } as EuiPageSideBarProps; // needed because for some reason 'none' is not recognized as a valid value for paddingSize
     return (
       <WrappedComponent
-        {...propagatedProps}
-        pageSideBar={pageSideBar}
-        pageSideBarProps={pageSideBarProps}
-        template={templateToUse}
+        {...{ ...propagatedProps, pageSideBar, pageSideBarProps, template: templateToUse }}
       >
         {children}
       </WrappedComponent>
     );
   };
+
   WithSolutionNav.displayName = `WithSolutionNavBar(${getDisplayName(WrappedComponent)})`;
+
   return WithSolutionNav;
 };