Update empty state for new page template

- Remove EuiPanel wrapper - KibanaPageTemplate does that automatically for us - Include SynonymModal, required for header create button to work as expected
elastic · Jun 21, 2021 · 0739e1f · 0739e1f
1 parent 4de9944
commit 0739e1f
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 5 deletions.
diff --git a/...search/public/applications/app_search/components/synonyms/components/empty_state.test.tsx b/...search/public/applications/app_search/components/synonyms/components/empty_state.test.tsx
@@ -11,7 +11,7 @@ import { shallow } from 'enzyme';
 
 import { EuiEmptyPrompt, EuiButton } from '@elastic/eui';
 
-import { EmptyState } from './';
+import { EmptyState, SynonymModal } from './';
 
 describe('EmptyState', () => {
   it('renders', () => {
@@ -24,4 +24,10 @@ describe('EmptyState', () => {
       expect.stringContaining('/synonyms-guide.html')
     );
   });
+
+  it('renders the add synonym modal', () => {
+    const wrapper = shallow(<EmptyState />);
+
+    expect(wrapper.find(SynonymModal)).toHaveLength(1);
+  });
 });
diff --git a/...rise_search/public/applications/app_search/components/synonyms/components/empty_state.tsx b/...rise_search/public/applications/app_search/components/synonyms/components/empty_state.tsx
@@ -7,16 +7,16 @@
 
 import React from 'react';
 
-import { EuiPanel, EuiEmptyPrompt, EuiButton } from '@elastic/eui';
+import { EuiEmptyPrompt, EuiButton } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 
 import { DOCS_PREFIX } from '../../../routes';
 
-import { SynonymIcon } from './';
+import { SynonymModal, SynonymIcon } from './';
 
 export const EmptyState: React.FC = () => {
   return (
-    <EuiPanel color="subdued">
+    <>
       <EuiEmptyPrompt
         iconType={SynonymIcon}
         title={
@@ -47,6 +47,7 @@ export const EmptyState: React.FC = () => {
           </EuiButton>
         }
       />
-    </EuiPanel>
+      <SynonymModal />
+    </>
   );
 };