github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 17:28:26 -04:00
Code Issues Projects Releases Packages Wiki Activity

[Global search bar] Create a loading spinner for the initial empty state (#137264) (#137291)

Browse source 
* Create a loading spinner for the initial empty state (instead of "no results")

* [CI] Auto-commit changed files from 'node scripts/precommit_hook.js --ref HEAD~1..HEAD --fix'

* Use EuiFlexGroup instead of plain div

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
(cherry picked from commit 9c349a392a)

Co-authored-by: Gerard Soldevila <gerard.soldevila@elastic.co>
This commit is contained in:
Kibana Machine 2022-07-27 11:38:21 -04:00 • committed by GitHub
parent 2f28423073
commit 6a48985892
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 13 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

15
x-pack/plugins/global_search_bar/public/components/search_bar.tsx
View file

@ -18,6 +18,9 @@ import {
EuiSelectableTemplateSitewide,
EuiSelectableTemplateSitewideOption,
euiSelectableTemplateSitewideRenderOptions,
EuiLoadingSpinner,
EuiFlexGroup,
EuiFlexItem,
} from '@elastic/eui';
import { METRIC_TYPE, UiCounterMetricType } from '@kbn/analytics';
import { i18n } from '@kbn/i18n';
@ -254,7 +257,15 @@ export const SearchBar: FC<SearchBarProps> = ({
const clearField = () => setSearchValue('');
const emptyMessage = <PopoverPlaceholder darkMode={darkMode} basePath={basePathUrl} />;
const noMatchesMessage = <PopoverPlaceholder darkMode={darkMode} basePath={basePathUrl} />;
const emptyMessage = (
<EuiFlexGroup direction="column" justifyContent="center" style={{ minHeight: '300px' }}>
<EuiFlexItem grow={false}>
<EuiLoadingSpinner size="xl" />
</EuiFlexItem>
</EuiFlexGroup>
);
const placeholderText = i18n.translate('xpack.globalSearchBar.searchBar.placeholder', {
defaultMessage: 'Find apps, content, and more. Ex: Discover',
});
@ -314,7 +325,7 @@ export const SearchBar: FC<SearchBarProps> = ({
) : undefined,
}}
emptyMessage={emptyMessage}
noMatchesMessage={emptyMessage}
noMatchesMessage={noMatchesMessage}
popoverProps={{
'data-test-subj': 'nav-search-popover',
panelClassName: 'navSearch__panel',