diff --git a/public/app/core/components/editors/DashboardPickerByID.tsx b/public/app/core/components/editors/DashboardPickerByID.tsx index a54279e4aba..d4b2f709795 100644 --- a/public/app/core/components/editors/DashboardPickerByID.tsx +++ b/public/app/core/components/editors/DashboardPickerByID.tsx @@ -11,7 +11,7 @@ import { backendSrv } from 'app/core/services/backend_srv'; export interface DashboardPickerItem { id: number; uid: string; - label: string; + [key: string]: string | number; } interface Props { @@ -22,6 +22,7 @@ interface Props { invalid?: boolean; disabled?: boolean; id?: string; + optionLabel?: string; } /** @@ -35,9 +36,10 @@ export const DashboardPickerByID: FC = ({ invalid, disabled, id, + optionLabel = 'label', }) => { - const debouncedSearch = debounce(getDashboards, 300); - const option = value ? { value, label: value.label } : undefined; + const debouncedSearch = debounce((query: string) => getDashboards(query || '', optionLabel), 300); + const option = value ? { value, [optionLabel]: value[optionLabel] } : undefined; const onChange = (item: SelectableValue) => { propsOnChange(item?.value); }; @@ -55,19 +57,20 @@ export const DashboardPickerByID: FC = ({ value={option} invalid={invalid} disabled={disabled} + getOptionLabel={(option) => option[optionLabel]} /> ); }; -async function getDashboards(query = ''): Promise>> { +async function getDashboards(query: string, label: string): Promise>> { const result = await backendSrv.search({ type: 'dash-db', query, limit: 100 }); return result.map(({ id, uid = '', title, folderTitle }) => { const value: DashboardPickerItem = { id, uid, - label: `${folderTitle ?? 'General'}/${title}`, + [label]: `${folderTitle ?? 'General'}/${title}`, }; - return { value, label: value.label }; + return { value, [label]: value[label] }; }); } diff --git a/public/app/features/playlist/usePlaylistItems.tsx b/public/app/features/playlist/usePlaylistItems.tsx index 83e58132705..7f86df6ea89 100644 --- a/public/app/features/playlist/usePlaylistItems.tsx +++ b/public/app/features/playlist/usePlaylistItems.tsx @@ -15,7 +15,7 @@ export function usePlaylistItems(playlistItems?: PlaylistItem[]) { const newItem: PlaylistItem = { id: dashboard.id, - title: dashboard.label, + title: dashboard.label as string, type: 'dashboard_by_id', value: dashboard.id.toString(10), order: items.length + 1,