From 369b5056aa275ae87e4d9dbefdccf7d48d8ee0e0 Mon Sep 17 00:00:00 2001
From: Shahzad <shahzad31comp@gmail.com>
Date: Tue, 22 Sep 2020 14:32:36 +0200
Subject: [PATCH] type fix

---
 .../URLFilter/URLSearch/SelectableUrlList.tsx             | 8 ++++----
 .../public/components/app/RumDashboard/translations.ts    | 6 ++++++
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/SelectableUrlList.tsx b/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/SelectableUrlList.tsx
index b0b8b53d470ce..298ec15b8480b 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/SelectableUrlList.tsx
+++ b/x-pack/plugins/apm/public/components/app/RumDashboard/URLFilter/URLSearch/SelectableUrlList.tsx
@@ -48,7 +48,7 @@ export function SelectableUrlList({
   const [popoverRef, setPopoverRef] = useState<HTMLElement | null>(null);
   const [searchRef, setSearchRef] = useState<HTMLInputElement | null>(null);
 
-  const titleRef = useRef();
+  const titleRef = useRef<HTMLDivElement>(null);
 
   const searchOnFocus = (e: React.FocusEvent<HTMLInputElement>) => {
     setPopoverIsOpen(true);
@@ -62,7 +62,7 @@ export function SelectableUrlList({
   const searchOnBlur = (e: React.FocusEvent<HTMLInputElement>) => {
     if (
       !popoverRef?.contains(e.relatedTarget as HTMLElement) &&
-      !popoverRef?.contains(titleRef.current as HTMLElement)
+      !popoverRef?.contains(titleRef.current as HTMLDivElement)
     ) {
       setPopoverIsOpen(false);
     }
@@ -82,13 +82,13 @@ export function SelectableUrlList({
     <EuiSelectableMessage style={{ minHeight: 300 }}>
       <EuiLoadingSpinner size="l" />
       <br />
-      <p>Loading results</p>
+      <p>{I18LABELS.loadingResults}</p>
     </EuiSelectableMessage>
   );
 
   const emptyMessage = (
     <EuiSelectableMessage style={{ minHeight: 300 }}>
-      <p>No results available</p>
+      <p>{I18LABELS.noResults}</p>
     </EuiSelectableMessage>
   );
 
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/translations.ts b/x-pack/plugins/apm/public/components/app/RumDashboard/translations.ts
index 442db9d3f89dc..714788ef468c6 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/translations.ts
+++ b/x-pack/plugins/apm/public/components/app/RumDashboard/translations.ts
@@ -99,6 +99,12 @@ export const I18LABELS = {
   matchThisQuery: i18n.translate('xpack.apm.rum.filters.url.matchThisQuery', {
     defaultMessage: 'Match this query',
   }),
+  loadingResults: i18n.translate('xpack.apm.rum.filters.url.loadingResults', {
+    defaultMessage: 'Loading results',
+  }),
+  noResults: i18n.translate('xpack.apm.rum.filters.url.noResults', {
+    defaultMessage: 'No results available',
+  }),
 };
 
 export const VisitorBreakdownLabel = i18n.translate(