From dd31207ecf8daf755c80a642804a765e3667a86c Mon Sep 17 00:00:00 2001
From: Alex Khomenko <Clarity-89@users.noreply.github.com>
Date: Tue, 28 Apr 2020 15:31:11 +0300
Subject: [PATCH] Search: minor fixes (#23984)

* Search: Use folder id as key when present

* Search: Do not render modals if not open
---
 public/app/features/search/components/ConfirmDeleteModal.tsx | 4 ++--
 public/app/features/search/components/MoveToFolderModal.tsx  | 4 ++--
 public/app/features/search/components/SearchResults.tsx      | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/public/app/features/search/components/ConfirmDeleteModal.tsx b/public/app/features/search/components/ConfirmDeleteModal.tsx
index 9ecf33fa105..a55d5978afc 100644
--- a/public/app/features/search/components/ConfirmDeleteModal.tsx
+++ b/public/app/features/search/components/ConfirmDeleteModal.tsx
@@ -46,7 +46,7 @@ export const ConfirmDeleteModal: FC<Props> = ({ results, onDeleteItems, isOpen,
     });
   };
 
-  return (
+  return isOpen ? (
     <ConfirmModal
       isOpen={isOpen}
       title="Delete"
@@ -59,7 +59,7 @@ export const ConfirmDeleteModal: FC<Props> = ({ results, onDeleteItems, isOpen,
       onConfirm={deleteItems}
       onDismiss={onDismiss}
     />
-  );
+  ) : null;
 };
 
 const getStyles = stylesFactory((theme: GrafanaTheme) => {
diff --git a/public/app/features/search/components/MoveToFolderModal.tsx b/public/app/features/search/components/MoveToFolderModal.tsx
index 64d6d353df3..9c605e3a84e 100644
--- a/public/app/features/search/components/MoveToFolderModal.tsx
+++ b/public/app/features/search/components/MoveToFolderModal.tsx
@@ -44,7 +44,7 @@ export const MoveToFolderModal: FC<Props> = ({ results, onMoveItems, isOpen, onD
     }
   };
 
-  return (
+  return isOpen ? (
     <Modal
       className={styles.modal}
       title="Choose Dashboard Folder"
@@ -71,7 +71,7 @@ export const MoveToFolderModal: FC<Props> = ({ results, onMoveItems, isOpen, onD
         </HorizontalGroup>
       </>
     </Modal>
-  );
+  ) : null;
 };
 
 const getStyles = stylesFactory((theme: GrafanaTheme) => {
diff --git a/public/app/features/search/components/SearchResults.tsx b/public/app/features/search/components/SearchResults.tsx
index aea5f6b2f5a..f83465c61d9 100644
--- a/public/app/features/search/components/SearchResults.tsx
+++ b/public/app/features/search/components/SearchResults.tsx
@@ -36,7 +36,7 @@ export const SearchResults: FC<Props> = ({
       <div className={styles.wrapper}>
         {results.map(section => {
           return (
-            <div aria-label="Search section" className={styles.section} key={section.title}>
+            <div aria-label="Search section" className={styles.section} key={section.id || section.title}>
               <SectionHeader onSectionClick={onToggleSection} {...{ onToggleChecked, editable, section }} />
               <div aria-label="Search items" className={styles.sectionItems}>
                 {section.expanded && section.items.map(item => <SearchItem key={item.id} {...itemProps} item={item} />)}