Panels/DashList: Fix order of recent dashboards (#29366)

Closes #29182
This commit is contained in:
kay delaney 2020-11-25 13:39:02 +00:00 committed by GitHub
parent 0b2a6ec7fe
commit 2af4deedd2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -27,8 +27,9 @@ async function fetchDashboards(options: DashListOptions) {
} }
let recentDashboards: Promise<Dashboard[]> = Promise.resolve([]); let recentDashboards: Promise<Dashboard[]> = Promise.resolve([]);
let dashIds: number[] = [];
if (options.showRecentlyViewed) { if (options.showRecentlyViewed) {
const dashIds = take(impressionSrv.getDashboardOpened(), options.maxItems); dashIds = take<number>(impressionSrv.getDashboardOpened(), options.maxItems);
recentDashboards = getBackendSrv().search({ dashboardIds: dashIds, limit: options.maxItems }); recentDashboards = getBackendSrv().search({ dashboardIds: dashIds, limit: options.maxItems });
} }
@ -46,24 +47,29 @@ async function fetchDashboards(options: DashListOptions) {
} }
const [starred, searched, recent] = await Promise.all([starredDashboards, searchedDashboards, recentDashboards]); const [starred, searched, recent] = await Promise.all([starredDashboards, searchedDashboards, recentDashboards]);
const dashMap = starred.reduce(
(acc, dash) => Object.assign(acc, { [dash.id]: dash }), // We deliberately deal with recent dashboards first so that the order of dash IDs is preserved
{} as Record<number, Dashboard> let dashMap = new Map<number, Dashboard>();
); for (const dashId of dashIds) {
const dash = recent.find(d => d.id === dashId);
if (dash) {
dashMap.set(dashId, { ...dash, isRecent: true });
}
}
searched.forEach(dash => { searched.forEach(dash => {
if (dashMap.hasOwnProperty(dash.id)) { if (dashMap.has(dash.id)) {
dashMap[dash.id].isSearchResult = true; dashMap.get(dash.id)!.isSearchResult = true;
} else { } else {
dashMap[dash.id] = { ...dash, isSearchResult: true }; dashMap.set(dash.id, { ...dash, isSearchResult: true });
} }
}); });
recent.forEach(dash => { starred.forEach(dash => {
if (dashMap.hasOwnProperty(dash.id)) { if (dashMap.has(dash.id)) {
dashMap[dash.id].isRecent = true; dashMap.get(dash.id)!.isStarred = true;
} else { } else {
dashMap[dash.id] = { ...dash, isRecent: true }; dashMap.set(dash.id, { ...dash, isStarred: true });
} }
}); });
@ -71,7 +77,7 @@ async function fetchDashboards(options: DashListOptions) {
} }
export function DashList(props: PanelProps<DashListOptions>) { export function DashList(props: PanelProps<DashListOptions>) {
const [dashboards, setDashboards] = useState<Record<number, Dashboard>>({}); const [dashboards, setDashboards] = useState(new Map<number, Dashboard>());
useEffect(() => { useEffect(() => {
fetchDashboards(props.options).then(dashes => { fetchDashboards(props.options).then(dashes => {
setDashboards(dashes); setDashboards(dashes);
@ -91,11 +97,13 @@ export function DashList(props: PanelProps<DashListOptions>) {
e.stopPropagation(); e.stopPropagation();
const isStarred = await getDashboardSrv().starDashboard(dash.id.toString(), dash.isStarred); const isStarred = await getDashboardSrv().starDashboard(dash.id.toString(), dash.isStarred);
setDashboards(Object.assign({}, dashboards, { [dash.id]: { ...dash, isStarred } })); const updatedDashboards = new Map(dashboards);
updatedDashboards.set(dash.id, { ...dash, isStarred });
setDashboards(updatedDashboards);
}; };
const [starredDashboards, recentDashboards, searchedDashboards] = useMemo(() => { const [starredDashboards, recentDashboards, searchedDashboards] = useMemo(() => {
const dashboardList = Object.values(dashboards); const dashboardList = [...dashboards.values()];
return [ return [
dashboardList.filter(dash => dash.isStarred), dashboardList.filter(dash => dash.isStarred),
dashboardList.filter(dash => dash.isRecent), dashboardList.filter(dash => dash.isRecent),