From 15c615319ebc598f51df501e1eb0d561168aa600 Mon Sep 17 00:00:00 2001 From: Davis McPhee Date: Tue, 13 Feb 2024 11:26:22 -0400 Subject: [PATCH] [Unified Search] Disable "Load query" button when `onClearSavedQuery` is undefined (#176756) ## Summary This PR disables the "Load query" button in Unified Search when the `onClearSavedQuery` callback is undefined. Previously it was possible to click the "Load query" button, but an empty popover would be shown instead of the saved query list, such as on the SLOs page. SLOs page currently: https://github.com/elastic/kibana/assets/25592674/3df21ac5-b727-4aa1-95c4-f81d7bf4a21b "Load query" disabled: disabled This isn't really a fix to the underlying problem, it's just a quick workaround to ensure the empty popover isn't shown. A full solution would probably involve marking `onClearSavedQuery` as a required prop and updating existing usages where its undefined, or updating Unified Search to not display saved query actions if certain props aren't defined. ### Checklist - [ ] Any text added follows [EUI's writing guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses sentence case text and includes [i18n support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md) - [ ] [Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html) was added for features that require explanation or tutorials - [ ] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios - [ ] [Flaky Test Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was used on any tests changed - [ ] Any UI touched in this PR is usable by keyboard only (learn more about [keyboard accessibility](https://webaim.org/techniques/keyboard/)) - [ ] Any UI touched in this PR does not create any new axe failures (run axe in browser: [FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/), [Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US)) - [ ] If a plugin configuration key changed, check if it needs to be allowlisted in the cloud and added to the [docker list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker) - [ ] This renders correctly on smaller devices using a responsive layout. (You can test this [in your browser](https://www.browserstack.com/guide/responsive-testing-on-local-server)) - [ ] This was checked for [cross-browser compatibility](https://www.elastic.co/support/matrix#matrix_browsers) ### For maintainers - [ ] This was checked for breaking API changes and was [labeled appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) --- .../public/query_string_input/query_bar_menu_panels.tsx | 2 +- src/plugins/unified_search/public/search_bar/search_bar.tsx | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/plugins/unified_search/public/query_string_input/query_bar_menu_panels.tsx b/src/plugins/unified_search/public/query_string_input/query_bar_menu_panels.tsx index 6ca40656467e5..a7d772e312bab 100644 --- a/src/plugins/unified_search/public/query_string_input/query_bar_menu_panels.tsx +++ b/src/plugins/unified_search/public/query_string_input/query_bar_menu_panels.tsx @@ -373,7 +373,7 @@ export function useQueryBarMenuPanels({ panel: QueryBarMenuPanel.loadQuery, icon: 'filter', 'data-test-subj': 'saved-query-management-load-button', - disabled: !hasSavedQueries, + disabled: !hasSavedQueries || !Boolean(manageFilterSetComponent), }, { name: savedQuery ? strings.getSaveAsNewFilterSetLabel() : strings.getSaveFilterSetLabel(), diff --git a/src/plugins/unified_search/public/search_bar/search_bar.tsx b/src/plugins/unified_search/public/search_bar/search_bar.tsx index 77755ccd6a990..6ce80367cb323 100644 --- a/src/plugins/unified_search/public/search_bar/search_bar.tsx +++ b/src/plugins/unified_search/public/search_bar/search_bar.tsx @@ -543,7 +543,7 @@ class SearchBarUI extends C timeRangeForSuggestionsOverride={timeRangeForSuggestionsOverride} filtersForSuggestions={this.props.filtersForSuggestions} manageFilterSetComponent={ - this.props.showFilterBar && this.state.query + this.props.showFilterBar && this.state.query && this.props.onClearSavedQuery ? this.renderSavedQueryManagement( this.props.onClearSavedQuery, this.props.showSaveQuery, @@ -649,11 +649,11 @@ class SearchBarUI extends C private renderSavedQueryManagement = memoizeOne( ( - onClearSavedQuery: SearchBarOwnProps['onClearSavedQuery'], + onClearSavedQuery: NonNullable, showSaveQuery: SearchBarOwnProps['showSaveQuery'], savedQuery: SearchBarOwnProps['savedQuery'] ) => { - const savedQueryManagement = onClearSavedQuery && ( + const savedQueryManagement = (