mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Search: display sort metadata (#31167)
* Search: display metadata * Search: update SortPicker icon * Search: display folder meta data * Search: reset sort picker on layout change * Search: align tags in Card component * Search: replace hyphen with dash * Search: preserve sort state on layout change * Search: update tests * Search: fix tests * Update pkg/services/search/hits.go Co-authored-by: Agnès Toulet <35176601+AgnesToulet@users.noreply.github.com> * Update public/app/features/search/components/SearchItem.tsx Co-authored-by: Agnès Toulet <35176601+AgnesToulet@users.noreply.github.com> * Update public/app/features/search/components/SearchItem.tsx Co-authored-by: Agnès Toulet <35176601+AgnesToulet@users.noreply.github.com> * Update public/app/features/search/types.ts Co-authored-by: Agnès Toulet <35176601+AgnesToulet@users.noreply.github.com> * Search: fix type error * Search: add General folder name and adjust icon margin Co-authored-by: Agnès Toulet <35176601+AgnesToulet@users.noreply.github.com>
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
import React, { FC } from 'react';
|
||||
import { useAsync } from 'react-use';
|
||||
import { Select, Icon } from '@grafana/ui';
|
||||
import { Select, Icon, IconName } from '@grafana/ui';
|
||||
import { SelectableValue } from '@grafana/data';
|
||||
import { DEFAULT_SORT } from 'app/features/search/constants';
|
||||
import { SearchSrv } from '../../services/search_srv';
|
||||
@@ -9,7 +9,7 @@ const searchSrv = new SearchSrv();
|
||||
|
||||
export interface Props {
|
||||
onChange: (sortValue: SelectableValue) => void;
|
||||
value?: SelectableValue | null;
|
||||
value?: string;
|
||||
placeholder?: string;
|
||||
}
|
||||
|
||||
@@ -23,14 +23,16 @@ export const SortPicker: FC<Props> = ({ onChange, value, placeholder }) => {
|
||||
// Using sync Select and manual options fetching here since we need to find the selected option by value
|
||||
const { loading, value: options } = useAsync<SelectableValue[]>(getSortOptions, []);
|
||||
|
||||
const selected = options?.filter((opt) => opt.value === value);
|
||||
return !loading ? (
|
||||
<Select
|
||||
key={value}
|
||||
width={25}
|
||||
onChange={onChange}
|
||||
value={options?.filter((opt) => opt.value === value)}
|
||||
value={selected?.length ? selected : null}
|
||||
options={options}
|
||||
placeholder={placeholder ?? `Sort (Default ${DEFAULT_SORT.label})`}
|
||||
prefix={<Icon name="sort-amount-down" />}
|
||||
prefix={<Icon name={(value?.includes('asc') ? 'sort-amount-up' : 'sort-amount-down') as IconName} />}
|
||||
/>
|
||||
) : null;
|
||||
};
|
||||
|
Reference in New Issue
Block a user