IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Explore: query history: fix error when removing last item (#42179) (#42222)

Browse Source 
* explore: rich-history: fix data inconsistency

* also handle starred-queries tab

(cherry picked from commit 06e474dfd5)

Co-authored-by: Gábor Farkas <gabor.farkas@gmail.com>
This commit is contained in:
Grot (@grafanabot) 2021-11-24 08:15:29 -05:00 committed by GitHub
parent 2e2e6c4920
commit c1afc4deac
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
public/app/features/explore/RichHistory/RichHistoryQueriesTab.tsx
View File

@ -137,16 +137,13 @@ export function RichHistoryQueriesTab(props: Props) {
} = props;
const [timeFilter, setTimeFilter] = useState<[number, number]>([0, retentionPeriod]);
const [filteredQueries, setFilteredQueries] = useState<RichHistoryQuery[]>([]);
const [data, setData] = useState<[RichHistoryQuery[], ReturnType<typeof createDatasourcesList>]>([[], []]);
const [searchInput, setSearchInput] = useState('');
const [debouncedSearchInput, setDebouncedSearchInput] = useState('');
const theme = useTheme();
const styles = getStyles(theme, height);
const datasourcesRetrievedFromQueryHistory = uniqBy(queries, 'datasourceName').map((d) => d.datasourceName);
const listOfDatasources = createDatasourcesList(datasourcesRetrievedFromQueryHistory);
useDebounce(
() => {
setDebouncedSearchInput(searchInput);
@ -156,17 +153,23 @@ export function RichHistoryQueriesTab(props: Props) {
);
useEffect(() => {
setFilteredQueries(
const datasourcesRetrievedFromQueryHistory = uniqBy(queries, 'datasourceName').map((d) => d.datasourceName);
const listOfDatasources = createDatasourcesList(datasourcesRetrievedFromQueryHistory);
setData([
filterAndSortQueries(
queries,
sortOrder,
datasourceFilters.map((d) => d.value),
debouncedSearchInput,
timeFilter
)
);
),
listOfDatasources,
]);
}, [timeFilter, queries, sortOrder, datasourceFilters, debouncedSearchInput]);
const [filteredQueries, listOfDatasources] = data;
/* mappedQueriesToHeadings is an object where query headings (stringified dates/data sources)
* are keys and arrays with queries that belong to that headings are values.
*/

16
public/app/features/explore/RichHistory/RichHistoryStarredTab.tsx
View File

@ -80,16 +80,13 @@ export function RichHistoryStarredTab(props: Props) {
exploreId,
} = props;
const [filteredQueries, setFilteredQueries] = useState<RichHistoryQuery[]>([]);
const [data, setData] = useState<[RichHistoryQuery[], ReturnType<typeof createDatasourcesList>]>([[], []]);
const [searchInput, setSearchInput] = useState('');
const [debouncedSearchInput, setDebouncedSearchInput] = useState('');
const theme = useTheme();
const styles = getStyles(theme);
const datasourcesRetrievedFromQueryHistory = uniqBy(queries, 'datasourceName').map((d) => d.datasourceName);
const listOfDatasources = createDatasourcesList(datasourcesRetrievedFromQueryHistory);
useDebounce(
() => {
setDebouncedSearchInput(searchInput);
@ -99,17 +96,22 @@ export function RichHistoryStarredTab(props: Props) {
);
useEffect(() => {
const datasourcesRetrievedFromQueryHistory = uniqBy(queries, 'datasourceName').map((d) => d.datasourceName);
const listOfDatasources = createDatasourcesList(datasourcesRetrievedFromQueryHistory);
const starredQueries = queries.filter((q) => q.starred === true);
setFilteredQueries(
setData([
filterAndSortQueries(
starredQueries,
sortOrder,
datasourceFilters.map((d) => d.value),
debouncedSearchInput
)
);
),
listOfDatasources,
]);
}, [queries, sortOrder, datasourceFilters, debouncedSearchInput]);
const [filteredQueries, listOfDatasources] = data;
return (
<div className={styles.container}>
<div className={styles.containerContent}>