Fix discover options' location (opensearch-project#7581)

* fix discover options Signed-off-by: abbyhu2000 <[email protected]> * Changeset file for PR opensearch-project#7581 created/updated * fix discover options Signed-off-by: abbyhu2000 <[email protected]> * update tooltip Signed-off-by: abbyhu2000 <[email protected]> --------- Signed-off-by: abbyhu2000 <[email protected]> Co-authored-by: opensearch-changeset-bot[bot] <154024398+opensearch-changeset-bot[bot]@users.noreply.github.com>
Qxisylolo · Aug 1, 2024 · e51b4ee · e51b4ee
1 parent b2733ae
commit e51b4ee
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 5 deletions.
diff --git a/changelogs/fragments/7581.yml b/changelogs/fragments/7581.yml
@@ -0,0 +1,2 @@
+feat:
+- Fix discover options' location ([#7581](https:/opensearch-project/OpenSearch-Dashboards/pull/7581))
diff --git a/src/plugins/discover/public/application/components/chart/chart.tsx b/src/plugins/discover/public/application/components/chart/chart.tsx
@@ -94,16 +94,16 @@ export const DiscoverChart = ({
  </div>
  );
 
- const toggleLabel = i18n.translate('queryEditor.collapse', {
- defaultMessage: 'Toggle query editor',
+ const toggleLabel = i18n.translate('histogram.collapse', {
+ defaultMessage: 'Toggle histogram',
  });
 
  const toggle = (
  <EuiToolTip content={toggleLabel}>
  <EuiButtonIcon
  aria-expanded={isCollapsed}
  aria-label={toggleLabel}
- data-test-subj="queryEditorCollapseBtn"
+ data-test-subj="histogramCollapseBtn"
  onClick={() => setIsCollapsed(!isCollapsed)}
  iconType={isCollapsed ? 'arrowRight' : 'arrowDown'}
  iconSize={'s'}
@@ -124,9 +124,11 @@ export const DiscoverChart = ({
 
  const histogramHeader = (
  <EuiFlexGroup direction="column" gutterSize="xs">
- <EuiFlexItem grow={false}>{hitsCounter}</EuiFlexItem>
+ <EuiFlexGroup direction="row" gutterSize="s">
+ <EuiFlexItem grow={true}>{hitsCounter}</EuiFlexItem>
+ <EuiFlexItem grow={false}>{discoverOptions}</EuiFlexItem>
+ </EuiFlexGroup>
  <EuiFlexItem grow={false}>{isTimeBased && timeChartHeader}</EuiFlexItem>
- <EuiFlexItem grow={false}>{discoverOptions}</EuiFlexItem>
  </EuiFlexGroup>
  );