From 7aa169af9ec40a96bd519e73144b036209dcbcda Mon Sep 17 00:00:00 2001
From: "Grot (@grafanabot)" <43478413+grafanabot@users.noreply.github.com>
Date: Thu, 28 Jan 2021 12:12:51 -0600
Subject: [PATCH] DashboardPicker: switch to promise-based debounce, return
 dashboard UID (#30706) (#30714)

* Use uid in dashboard picker

* Set both id and uid from picker

* Use debounce-promise

* Simplify logic

* Use exact package versions

(cherry picked from commit e36b035c057ce9158d325d8a15b5623a910aef8b)

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>
---
 package.json                                   |  2 ++
 .../core/components/Select/DashboardPicker.tsx | 18 ++++++------------
 yarn.lock                                      | 10 ++++++++++
 3 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/package.json b/package.json
index 1bcb08adfa1..b5694933810 100644
--- a/package.json
+++ b/package.json
@@ -89,6 +89,7 @@
     "@types/d3": "5.7.2",
     "@types/d3-force": "^2.1.0",
     "@types/d3-scale-chromatic": "1.3.1",
+    "@types/debounce-promise": "3.1.3",
     "@types/enzyme": "3.10.5",
     "@types/enzyme-adapter-react-16": "1.0.6",
     "@types/file-saver": "2.0.1",
@@ -234,6 +235,7 @@
     "d3-force": "^2.1.1",
     "d3-scale-chromatic": "1.5.0",
     "dangerously-set-html-content": "1.0.6",
+    "debounce-promise": "3.1.2",
     "emotion": "10.0.27",
     "eventemitter3": "4.0.0",
     "fast-text-encoding": "^1.0.0",
diff --git a/public/app/core/components/Select/DashboardPicker.tsx b/public/app/core/components/Select/DashboardPicker.tsx
index 529f7f2cb4a..f8735d78e9f 100644
--- a/public/app/core/components/Select/DashboardPicker.tsx
+++ b/public/app/core/components/Select/DashboardPicker.tsx
@@ -1,6 +1,5 @@
 import React, { FC } from 'react';
-import { debounce } from 'lodash';
-import { useAsyncFn } from 'react-use';
+import debounce from 'debounce-promise';
 import { SelectableValue } from '@grafana/data';
 import { AsyncSelect } from '@grafana/ui';
 import { backendSrv } from 'app/core/services/backend_srv';
@@ -9,7 +8,7 @@ import { DashboardDTO } from 'app/types';
 
 export interface Props {
   onSelected: (dashboard: DashboardDTO) => void;
-  currentDashboard?: SelectableValue<number>;
+  currentDashboard?: SelectableValue;
   width?: number;
   isClearable?: boolean;
   invalid?: boolean;
@@ -20,8 +19,9 @@ const getDashboards = (query = '') => {
   return backendSrv.search({ type: 'dash-db', query }).then((result: DashboardSearchHit[]) => {
     return result.map((item: DashboardSearchHit) => ({
       id: item.id,
+      uid: item.uid,
       value: item.id,
-      label: `${item.folderTitle ? item.folderTitle : 'General'}/${item.title}`,
+      label: `${item?.folderTitle ?? 'General'}/${item.title}`,
     }));
   });
 };
@@ -34,20 +34,14 @@ export const DashboardPicker: FC<Props> = ({
   invalid,
   disabled,
 }) => {
-  const debouncedSearch = debounce(getDashboards, 300, {
-    leading: true,
-    trailing: true,
-  });
-
-  const [state, searchDashboards] = useAsyncFn(debouncedSearch, []);
+  const debouncedSearch = debounce(getDashboards, 300);
 
   return (
     <AsyncSelect
       width={width}
-      isLoading={state.loading}
       isClearable={isClearable}
       defaultOptions={true}
-      loadOptions={searchDashboards}
+      loadOptions={debouncedSearch}
       onChange={onSelected}
       placeholder="Select dashboard"
       noOptionsMessage="No dashboards found"
diff --git a/yarn.lock b/yarn.lock
index 4f28b7f9f23..ffe669e21ce 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6252,6 +6252,11 @@
     "@types/d3-voronoi" "*"
     "@types/d3-zoom" "*"
 
+"@types/debounce-promise@3.1.3":
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/@types/debounce-promise/-/debounce-promise-3.1.3.tgz#dd0d6b96ee61da0dd4c413e3ea03a425ffa36b3f"
+  integrity sha512-mjcCf//DAUQ6YLQMhqYJAv/+a4BsE1GQFmy1el5K62wLJJmQwGi3TsnshhOFynPpuBF9Gh2Vvb+5ImPi47KaZw==
+
 "@types/deep-freeze@^0.1.1":
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/@types/deep-freeze/-/deep-freeze-0.1.2.tgz#68e5379291910e82c2f0d1629732163c2aa662cc"
@@ -11564,6 +11569,11 @@ dateformat@^3.0.0:
   resolved "https://registry.yarnpkg.com/dateformat/-/dateformat-3.0.3.tgz#a6e37499a4d9a9cf85ef5872044d62901c9889ae"
   integrity sha512-jyCETtSl3VMZMWeRo7iY1FL19ges1t55hMo5yaam4Jrsm5EPL89UQkoQRyiI+Yf4k8r2ZpdngkV8hr1lIdjb3Q==
 
+debounce-promise@3.1.2:
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/debounce-promise/-/debounce-promise-3.1.2.tgz#320fb8c7d15a344455cd33cee5ab63530b6dc7c5"
+  integrity sha512-rZHcgBkbYavBeD9ej6sP56XfG53d51CD4dnaw989YX/nZ/ZJfgRx/9ePKmTNiUiyQvh4mtrMoS3OAWW+yoYtpg==
+
 debug@2.6.9, debug@^2.1.1, debug@^2.2.0, debug@^2.3.3, debug@^2.6.0, debug@^2.6.9:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"