From 30346a30de9604a7b5f43db85480854c7ff37ebb Mon Sep 17 00:00:00 2001
From: Maxhui <51693396+MaxHuiYYDS@users.noreply.github.com>
Date: Wed, 25 Aug 2021 19:52:59 +0800
Subject: [PATCH] fix(dashboard): undo and redo buttons weird alignment 
 (#16417)

* fix(dashboard-ui): undo and redo buttons weird alignment

* fix(Explore control pane): keyboard nav & focus

* lint: lint frontend

* fix: fix redo and undo button style

* lint: lint line

* lint: lint line

Co-authored-by: xuzhebin <maxhui2020@gmail.com>
---
 superset-frontend/src/components/Button/index.tsx           | 6 ++++--
 superset-frontend/src/dashboard/components/Header/index.jsx | 2 ++
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/superset-frontend/src/components/Button/index.tsx b/superset-frontend/src/components/Button/index.tsx
index 62e1214d3dffc..5199d26f4f8a2 100644
--- a/superset-frontend/src/components/Button/index.tsx
+++ b/superset-frontend/src/components/Button/index.tsx
@@ -63,6 +63,7 @@ export interface ButtonProps {
   htmlType?: 'button' | 'submit' | 'reset';
   cta?: boolean;
   loading?: boolean | { delay?: number | undefined } | undefined;
+  showMarginRight?: boolean;
 }
 
 export default function Button(props: ButtonProps) {
@@ -76,6 +77,7 @@ export default function Button(props: ButtonProps) {
     cta,
     children,
     href,
+    showMarginRight = true,
     ...restProps
   } = props;
 
@@ -154,8 +156,8 @@ export default function Button(props: ButtonProps) {
   } else {
     renderedChildren = Children.toArray(children);
   }
-
-  const firstChildMargin = renderedChildren.length > 1 ? theme.gridUnit * 2 : 0;
+  const firstChildMargin =
+    showMarginRight && renderedChildren.length > 1 ? theme.gridUnit * 2 : 0;
 
   const button = (
     <AntdButton
diff --git a/superset-frontend/src/dashboard/components/Header/index.jsx b/superset-frontend/src/dashboard/components/Header/index.jsx
index 9198601ae685d..27dc4e7842c71 100644
--- a/superset-frontend/src/dashboard/components/Header/index.jsx
+++ b/superset-frontend/src/dashboard/components/Header/index.jsx
@@ -526,6 +526,7 @@ class Header extends React.PureComponent {
                       buttonStyle={
                         this.state.emphasizeUndo ? 'primary' : undefined
                       }
+                      showMarginRight={false}
                     >
                       <i
                         title="Undo"
@@ -541,6 +542,7 @@ class Header extends React.PureComponent {
                       buttonStyle={
                         this.state.emphasizeRedo ? 'primary' : undefined
                       }
+                      showMarginRight={false}
                     >
                       &nbsp;
                       <i title="Redo" className="redo-action fa fa-share" />