fixes mobile view

Signed-off-by: Ashwin P Chandran <ashwinpc@amazon.com>
opensearch-project · Oct 2, 2023 · 6b0a6ad · 6b0a6ad
1 parent 7453dc8
commit 6b0a6ad
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 27 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -56,6 +56,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 - [BUG] Fix buildPointSeriesData unit test fails due to local timezone ([#4992](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4992))
 - [BUG][Data Explorer][Discover] Fix total hits issue for no time based data ([#5087](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/5087))
 - [BUG][Discover] Fix misc navigation issues ([#5168](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/5168))
+- [BUG][Discover] Fixes mobile view ([#5168](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/5168))
 
 ### 🚞 Infrastructure
 

diff --git a/src/plugins/discover/public/application/components/sidebar/discover_field.scss b/src/plugins/discover/public/application/components/sidebar/discover_field.scss
@@ -11,4 +11,8 @@
   &:focus {
     opacity: 1;
   }
+
+  @include ouiBreakpoint("xs", "s", "m") {
+    opacity: 1;
+  }
 }
diff --git a/src/plugins/discover/public/application/view_components/canvas/index.tsx b/src/plugins/discover/public/application/view_components/canvas/index.tsx
@@ -4,7 +4,7 @@
  */
 
 import React, { useEffect, useState, useRef } from 'react';
-import { EuiFlexGroup, EuiFlexItem, EuiPanel } from '@elastic/eui';
+import { EuiFlexGroup, EuiFlexItem, EuiPage, EuiPanel } from '@elastic/eui';
 import { TopNav } from './top_nav';
 import { ViewProps } from '../../../../../data_explorer/public';
 import { DiscoverTable } from './discover_table';
@@ -69,37 +69,35 @@ export default function DiscoverCanvas({ setHeaderActionMenu, history }: ViewPro
   const timeField = indexPattern?.timeFieldName ? indexPattern.timeFieldName : undefined;
 
   return (
-    <EuiFlexGroup direction="column" gutterSize="none" className="dscCanvas">
-      <EuiFlexItem grow={false}>
-        <TopNav
-          opts={{
-            setHeaderActionMenu,
-          }}
-        />
-      </EuiFlexItem>
+    <EuiPanel
+      hasBorder={false}
+      hasShadow={false}
+      color="transparent"
+      paddingSize="none"
+      className="dscCanvas"
+    >
+      <TopNav
+        opts={{
+          setHeaderActionMenu,
+        }}
+      />
       {status === ResultStatus.NO_RESULTS && (
-        <EuiFlexItem>
-          <DiscoverNoResults timeFieldName={timeField} queryLanguage={''} />
-        </EuiFlexItem>
+        <DiscoverNoResults timeFieldName={timeField} queryLanguage={''} />
       )}
       {status === ResultStatus.UNINITIALIZED && (
         <DiscoverUninitialized onRefresh={() => refetch$.next()} />
       )}
       {status === ResultStatus.LOADING && <LoadingSpinner />}
       {status === ResultStatus.READY && (
         <>
-          <EuiFlexItem grow={false}>
-            <EuiPanel hasBorder={false} hasShadow={false} color="transparent" paddingSize="s">
-              <EuiPanel>
-                <DiscoverChartContainer {...fetchState} />
-              </EuiPanel>
+          <EuiPanel hasBorder={false} hasShadow={false} color="transparent" paddingSize="s">
+            <EuiPanel>
+              <DiscoverChartContainer {...fetchState} />
             </EuiPanel>
-          </EuiFlexItem>
-          <EuiFlexItem>
-            <DiscoverTable history={history} />
-          </EuiFlexItem>
+          </EuiPanel>
+          <DiscoverTable history={history} />
         </>
       )}
-    </EuiFlexGroup>
+    </EuiPanel>
   );
 }
diff --git a/src/plugins/discover/public/application/view_components/canvas/top_nav.tsx b/src/plugins/discover/public/application/view_components/canvas/top_nav.tsx
@@ -60,12 +60,9 @@ export const TopNav = ({ opts }: TopNavProps) => {
     chrome.docTitle.change(`Discover${pageTitleSuffix}`);
 
     if (savedSearch?.id) {
-      chrome.setBreadcrumbs([
-        ...getRootBreadcrumbs(getUrlForApp(PLUGIN_ID)),
-        { text: savedSearch.title },
-      ]);
+      chrome.setBreadcrumbs([...getRootBreadcrumbs(), { text: savedSearch.title }]);
     } else {
-      chrome.setBreadcrumbs([...getRootBreadcrumbs(getUrlForApp(PLUGIN_ID))]);
+      chrome.setBreadcrumbs([...getRootBreadcrumbs()]);
     }
   }, [chrome, getUrlForApp, savedSearch?.id, savedSearch?.title]);