diff --git a/public/components/query_compare/search_result/result_components/result_components.tsx b/public/components/query_compare/search_result/result_components/result_components.tsx index 0cba158..8844caf 100644 --- a/public/components/query_compare/search_result/result_components/result_components.tsx +++ b/public/components/query_compare/search_result/result_components/result_components.tsx @@ -4,7 +4,7 @@ */ import React, { useEffect, useState } from 'react'; -import { EuiSplitPanel, EuiTitle, EuiFlexGroup, EuiPanel } from '@elastic/eui'; +import { EuiSplitPanel, EuiEmptyPrompt, EuiPanel } from '@elastic/eui'; import { QueryError, SearchResults } from '../../../../types/index'; import { ResultPanel } from './result_panel'; @@ -26,11 +26,13 @@ const InitialState = () => { grow={true} style={{ display: 'flex', justifyContent: 'center', alignItems: 'center' }} > - - -

Add queries to compare search results.

-
-
+ No results} + body={ +

Add at least one query to display search results.

+ } + /> ); }; diff --git a/public/components/query_compare/search_result/result_components/result_panel.tsx b/public/components/query_compare/search_result/result_components/result_panel.tsx index 2731274..f942f41 100644 --- a/public/components/query_compare/search_result/result_components/result_panel.tsx +++ b/public/components/query_compare/search_result/result_components/result_panel.tsx @@ -11,6 +11,7 @@ import { EuiFlexGroup, EuiFlexItem, EuiHorizontalRule, + EuiEmptyPrompt, } from '@elastic/eui'; import { ResultGridComponent } from './result_grid'; @@ -70,7 +71,15 @@ export const ResultPanel = ({ resultNumber, queryResult, queryError }: ResultPan ) : ( <> - No results. + No results} + body={ + <> +

Add a second query to display search comparison results.

+ + } + /> )}