Search: fix 'Clear filters' button (#50227)

Co-authored-by: Ryan McKinley <ryantxu@gmail.com>
This commit is contained in:
Artur Wierzbicki 2022-06-07 11:57:23 +04:00 committed by GitHub
parent a88408bfd1
commit 49112c8356
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 12 additions and 5 deletions

View File

@ -67,6 +67,9 @@ function DashboardSearchNew({ onCloseSearch }: Props) {
</div> </div>
<div className={styles.search}> <div className={styles.search}>
<SearchView <SearchView
onQueryTextChange={(newQueryText) => {
setInputValue(newQueryText);
}}
showManage={false} showManage={false}
queryText={query.query} queryText={query.query}
includePanels={includePanels!} includePanels={includePanels!}

View File

@ -64,6 +64,9 @@ export const ManageDashboardsNew = React.memo(({ folder }: Props) => {
showManage={isEditor || hasEditPermissionInFolders || canSave} showManage={isEditor || hasEditPermissionInFolders || canSave}
folderDTO={folder} folderDTO={folder}
queryText={query.query} queryText={query.query}
onQueryTextChange={(newQueryText) => {
setInputValue(newQueryText);
}}
hidePseudoFolders={true} hidePseudoFolders={true}
includePanels={includePanels!} includePanels={includePanels!}
setIncludePanels={setIncludePanels} setIncludePanels={setIncludePanels}

View File

@ -28,6 +28,7 @@ type SearchViewProps = {
showManage: boolean; showManage: boolean;
folderDTO?: FolderDTO; folderDTO?: FolderDTO;
hidePseudoFolders?: boolean; // Recent + starred hidePseudoFolders?: boolean; // Recent + starred
onQueryTextChange: (newQueryText: string) => void;
includePanels: boolean; includePanels: boolean;
setIncludePanels: (v: boolean) => void; setIncludePanels: (v: boolean) => void;
}; };
@ -36,14 +37,14 @@ export const SearchView = ({
showManage, showManage,
folderDTO, folderDTO,
queryText, queryText,
onQueryTextChange,
hidePseudoFolders, hidePseudoFolders,
includePanels, includePanels,
setIncludePanels, setIncludePanels,
}: SearchViewProps) => { }: SearchViewProps) => {
const styles = useStyles2(getStyles); const styles = useStyles2(getStyles);
const { query, onQueryChange, onTagFilterChange, onTagAdd, onDatasourceChange, onSortChange, onLayoutChange } = const { query, onTagFilterChange, onTagAdd, onDatasourceChange, onSortChange, onLayoutChange } = useSearchQuery({});
useSearchQuery({});
query.query = queryText; // Use the query value passed in from parent rather than from URL query.query = queryText; // Use the query value passed in from parent rather than from URL
const [searchSelection, setSearchSelection] = useState(newSearchSelection()); const [searchSelection, setSearchSelection] = useState(newSearchSelection());
@ -126,7 +127,7 @@ export const SearchView = ({
clearSelection(); clearSelection();
setListKey(Date.now()); setListKey(Date.now());
// trigger again the search to the backend // trigger again the search to the backend
onQueryChange(query.query); onQueryTextChange(query.query);
}; };
const renderResults = () => { const renderResults = () => {
@ -145,7 +146,7 @@ export const SearchView = ({
variant="secondary" variant="secondary"
onClick={() => { onClick={() => {
if (query.query) { if (query.query) {
onQueryChange(''); onQueryTextChange('');
} }
if (query.tag?.length) { if (query.tag?.length) {
onTagFilterChange([]); onTagFilterChange([]);
@ -238,7 +239,7 @@ export const SearchView = ({
onLayoutChange={(v) => { onLayoutChange={(v) => {
if (v === SearchLayout.Folders) { if (v === SearchLayout.Folders) {
if (query.query) { if (query.query) {
onQueryChange(''); // parent will clear the sort onQueryTextChange(''); // parent will clear the sort
} }
} }
onLayoutChange(v); onLayoutChange(v);