From 0dc4bdb2cf38c7cc43b5f08cb0bd8b37b360d5d4 Mon Sep 17 00:00:00 2001
From: tinopetros <24800495+tinopetros@users.noreply.github.com>
Date: Sat, 19 Nov 2022 15:33:54 -0500
Subject: [PATCH] Detangle closeButton and closeButtonInFooter

---
 .../src/components/dialog/multistepDialog.tsx  | 18 ++++++------------
 1 file changed, 6 insertions(+), 12 deletions(-)

diff --git a/packages/core/src/components/dialog/multistepDialog.tsx b/packages/core/src/components/dialog/multistepDialog.tsx
index b6652d26eb..176652d03d 100644
--- a/packages/core/src/components/dialog/multistepDialog.tsx
+++ b/packages/core/src/components/dialog/multistepDialog.tsx
@@ -40,7 +40,7 @@ export interface IMultistepDialogProps extends DialogProps {
     children?: React.ReactNode;
 
     /**
-     * Props for the close button that appears in the footer when there is no title.
+     * Props for the close button that appears in the footer.
      */
     closeButtonProps?: DialogStepButtonProps;
 
@@ -79,9 +79,8 @@ export interface IMultistepDialogProps extends DialogProps {
     resetOnClose?: boolean;
 
     /**
-     * Whether the footer close button is shown. The button will only appear if
-     * `isCloseButtonShown` is `true`. The close button in the dialog title will
-     * not be shown when this is `true`.
+     * Whether the footer close button is shown. When this value is true, the button will appear
+     * regardless of the value of `isCloseButtonShown`.
      *
      * @default false
      */
@@ -121,13 +120,9 @@ export class MultistepDialog extends AbstractPureComponent2<MultistepDialogProps
         const { className, navigationPosition, showCloseButtonInFooter, isCloseButtonShown, ...otherProps } =
             this.props;
 
-        // Only one close button should be displayed. If the footer close button
-        // is shown, we need to ensure the dialog close button is not displayed.
-        const isCloseButtonVisible = !showCloseButtonInFooter && isCloseButtonShown;
-
         return (
             <Dialog
-                isCloseButtonShown={isCloseButtonVisible}
+                isCloseButtonShown={isCloseButtonShown}
                 {...otherProps}
                 className={classNames(
                     {
@@ -211,9 +206,8 @@ export class MultistepDialog extends AbstractPureComponent2<MultistepDialogProps
     }
 
     private renderFooter() {
-        const { closeButtonProps, isCloseButtonShown, showCloseButtonInFooter, onClose } = this.props;
-        const isFooterCloseButtonVisible = showCloseButtonInFooter && isCloseButtonShown;
-        const maybeCloseButton = !isFooterCloseButtonVisible ? undefined : (
+        const { closeButtonProps, showCloseButtonInFooter, onClose } = this.props;
+        const maybeCloseButton = !showCloseButtonInFooter ? undefined : (
             <DialogStepButton text="Close" onClick={onClose} {...closeButtonProps} />
         );
         return (