From ea4071c07c3362202f7d281999aabe43881be4f2 Mon Sep 17 00:00:00 2001
From: Ashwin P Chandran <ashwinpc@amazon.com>
Date: Tue, 30 Jul 2024 07:36:38 -0700
Subject: [PATCH] [Discover next] Fixes dataset navigator menu styling & search
 error toast (#7566)

Signed-off-by: Ashwin P Chandran <ashwinpc@amazon.com>
---
 .../config/global_selectors.json              |  3 +-
 .../notifications/toasts/toasts_api.tsx       |  4 +++
 .../data/public/search/search_interceptor.ts  |  9 ++++++
 .../dataset_navigator/_dataset_navigator.scss | 28 ++++---------------
 .../dataset_navigator/dataset_navigator.tsx   |  2 +-
 .../editors/default_editor/index.tsx          |  2 +-
 6 files changed, 23 insertions(+), 25 deletions(-)

diff --git a/packages/osd-stylelint-config/config/global_selectors.json b/packages/osd-stylelint-config/config/global_selectors.json
index ca442760f731..1da8137e9a7a 100644
--- a/packages/osd-stylelint-config/config/global_selectors.json
+++ b/packages/osd-stylelint-config/config/global_selectors.json
@@ -27,7 +27,8 @@
       "src/plugins/discover/public/application/view_components/canvas/discover_canvas.scss",
       "src/plugins/discover/public/application/components/sidebar/discover_sidebar.scss",
       "src/plugins/data/public/ui/query_string_input/_query_bar.scss",
-      "src/plugins/data/public/ui/query_editor/_query_editor.scss"
+      "src/plugins/data/public/ui/query_editor/_query_editor.scss",
+      "src/plugins/data/public/ui/dataset_navigator/_dataset_navigator.scss"
     ]
   }
 }
\ No newline at end of file
diff --git a/src/core/public/notifications/toasts/toasts_api.tsx b/src/core/public/notifications/toasts/toasts_api.tsx
index 76d0bf9cf9b2..3166e814ed77 100644
--- a/src/core/public/notifications/toasts/toasts_api.tsx
+++ b/src/core/public/notifications/toasts/toasts_api.tsx
@@ -87,6 +87,10 @@ export interface ErrorToastOptions extends ToastOptions {
    * message will still be shown in the detailed error modal.
    */
   toastMessage?: string;
+  /**
+   * The id of the error.
+   */
+  id?: string;
 }
 
 const normalizeToast = (toastOrTitle: ToastInput): ToastInputFields => {
diff --git a/src/plugins/data/public/search/search_interceptor.ts b/src/plugins/data/public/search/search_interceptor.ts
index 153ac80a249c..afc8a30c71ea 100644
--- a/src/plugins/data/public/search/search_interceptor.ts
+++ b/src/plugins/data/public/search/search_interceptor.ts
@@ -276,8 +276,17 @@ export class SearchInterceptor {
 
     this.deps.toasts.addError(e, {
       title: 'Search Error',
+      id: simpleHash(e.message),
     });
   }
 }
 
+// To be used as a unique identifier for each error
+const simpleHash = (str: string) =>
+  str
+    .split('')
+    // eslint-disable-next-line no-bitwise
+    .reduce((hash: number, char) => (hash << 5) + hash + char.charCodeAt(0), 5381)
+    .toString();
+
 export type ISearchInterceptor = PublicMethodsOf<SearchInterceptor>;
diff --git a/src/plugins/data/public/ui/dataset_navigator/_dataset_navigator.scss b/src/plugins/data/public/ui/dataset_navigator/_dataset_navigator.scss
index 144a2ae3edad..875a2d62635f 100644
--- a/src/plugins/data/public/ui/dataset_navigator/_dataset_navigator.scss
+++ b/src/plugins/data/public/ui/dataset_navigator/_dataset_navigator.scss
@@ -6,10 +6,6 @@
 .dataSetNavigator {
   padding: $euiSizeXS;
   color: $euiColorPrimaryText;
-  max-height: 60vh;
-  overflow-y: auto;
-  scrollbar-width: thin;
-  scrollbar-color: $euiColorMediumShade $euiColorLightestShade;
 
   &__icon {
     margin-right: 4px;
@@ -19,26 +15,14 @@
     padding: $euiSizeS;
   }
 
-  &:not(:hover)::-webkit-scrollbar {
-    width: 0;
-    background: transparent;
-  }
-
-  &::-webkit-scrollbar {
-    width: 4px;
-  }
-
-  &::-webkit-scrollbar-track {
-    background: $euiColorLightestShade;
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background-color: $euiColorMediumShade;
-    border-radius: 4px;
-  }
-
   &__menu {
     width: 365px;
+
+    .euiContextMenu__panel > div {
+      @include euiYScrollWithShadows;
+
+      max-height: 60vh;
+    }
   }
 }
 
diff --git a/src/plugins/data/public/ui/dataset_navigator/dataset_navigator.tsx b/src/plugins/data/public/ui/dataset_navigator/dataset_navigator.tsx
index cc0269c741ee..eeb3f7085515 100644
--- a/src/plugins/data/public/ui/dataset_navigator/dataset_navigator.tsx
+++ b/src/plugins/data/public/ui/dataset_navigator/dataset_navigator.tsx
@@ -670,7 +670,7 @@ export const DataSetNavigator: React.FC<DataSetNavigatorProps> = ({
     >
       <EuiContextMenu
         initialPanelId={0}
-        className="dataSetNavigator dataSetNavigator__menu"
+        className="dataSetNavigator__menu"
         size="s"
         panels={panels}
       />
diff --git a/src/plugins/data/public/ui/query_editor/editors/default_editor/index.tsx b/src/plugins/data/public/ui/query_editor/editors/default_editor/index.tsx
index 20093d806956..b3d145bc267b 100644
--- a/src/plugins/data/public/ui/query_editor/editors/default_editor/index.tsx
+++ b/src/plugins/data/public/ui/query_editor/editors/default_editor/index.tsx
@@ -40,7 +40,7 @@ const DefaultInput: React.FC<DefaultInputProps> = ({
     <div className="defaultEditor">
       <div ref={headerRef} className="defaultEditor__header" />
       <CodeEditor
-        height={200}
+        height={100}
         languageId={languageId}
         value={value}
         onChange={onChange}