[Discover next] Fixes dataset navigator menu styling & search error t…

…oast (opensearch-project#7566) Signed-off-by: Ashwin P Chandran <ashwinpc@amazon.com>
ananzh · Jul 30, 2024 · ea4071c · ea4071c
1 parent f637648
commit ea4071c
Show file tree

Hide file tree

Showing 6 changed files with 23 additions and 25 deletions.
diff --git 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"
     ]
   }
 }
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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}