From 844b47150908a165330e1f5446a3d61038b32f47 Mon Sep 17 00:00:00 2001
From: Evan Rusackas <evan@preset.io>
Date: Tue, 18 Aug 2020 14:33:39 -0700
Subject: [PATCH] fix: removing unsupported modal sizes (#10625)

* fix: removing unsupported modal sizes

* linting!

* NOT specifying bsSize seems to have the same effect as (unsupported) "medium"

* supporting 'large' and 'small' over 'lg' and 'sm'
---
 .../src/SqlLab/components/EstimateQueryCostButton.jsx        | 1 -
 .../src/SqlLab/components/ScheduleQueryButton.jsx            | 1 -
 superset-frontend/src/components/DeleteModal.tsx             | 1 -
 superset-frontend/src/components/Modal.tsx                   | 5 ++---
 superset-frontend/src/components/ModalTrigger.jsx            | 2 +-
 superset-frontend/src/datasource/ChangeDatasourceModal.tsx   | 2 +-
 superset-frontend/src/datasource/DatasourceModal.tsx         | 2 +-
 .../src/explore/components/controls/VizTypeControl.jsx       | 2 +-
 8 files changed, 6 insertions(+), 10 deletions(-)

diff --git a/superset-frontend/src/SqlLab/components/EstimateQueryCostButton.jsx b/superset-frontend/src/SqlLab/components/EstimateQueryCostButton.jsx
index a8e794fffa..9de78089a3 100644
--- a/superset-frontend/src/SqlLab/components/EstimateQueryCostButton.jsx
+++ b/superset-frontend/src/SqlLab/components/EstimateQueryCostButton.jsx
@@ -95,7 +95,6 @@ class EstimateQueryCostButton extends React.PureComponent {
               <i className="fa fa-clock-o" /> {btnText}
             </Button>
           }
-          bsSize="medium"
         />
       </span>
     );
diff --git a/superset-frontend/src/SqlLab/components/ScheduleQueryButton.jsx b/superset-frontend/src/SqlLab/components/ScheduleQueryButton.jsx
index dd91996086..08fd388df9 100644
--- a/superset-frontend/src/SqlLab/components/ScheduleQueryButton.jsx
+++ b/superset-frontend/src/SqlLab/components/ScheduleQueryButton.jsx
@@ -201,7 +201,6 @@ class ScheduleQueryButton extends React.PureComponent {
               <i className="fa fa-calendar" /> {t('Schedule')}
             </Button>
           }
-          bsSize="medium"
         />
       </span>
     );
diff --git a/superset-frontend/src/components/DeleteModal.tsx b/superset-frontend/src/components/DeleteModal.tsx
index 8a9cd16d5e..d142ce1d94 100644
--- a/superset-frontend/src/components/DeleteModal.tsx
+++ b/superset-frontend/src/components/DeleteModal.tsx
@@ -63,7 +63,6 @@ export default function DeleteModal({
       primaryButtonType="danger"
       show={open}
       title={title}
-      bsSize="medium"
     >
       <DescriptionContainer>{description}</DescriptionContainer>
       <StyleFormGroup>
diff --git a/superset-frontend/src/components/Modal.tsx b/superset-frontend/src/components/Modal.tsx
index f9d2faed9c..fb7edb5ddd 100644
--- a/superset-frontend/src/components/Modal.tsx
+++ b/superset-frontend/src/components/Modal.tsx
@@ -31,7 +31,7 @@ interface ModalProps {
   primaryButtonType?: 'primary' | 'danger';
   show: boolean;
   title: React.ReactNode;
-  bsSize?: 'xs' | 'xsmall' | 'sm' | 'small' | 'medium' | 'lg' | 'large';
+  bsSize?: 'small' | 'large'; // react-bootstrap also supports 'sm', 'lg' but we're keeping it simple.
 }
 
 const StyledModal = styled(BaseModal)`
@@ -75,10 +75,9 @@ export default function Modal({
   primaryButtonType = 'primary',
   show,
   title,
-  bsSize = 'lg',
 }: ModalProps) {
   return (
-    <StyledModal show={show} onHide={onHide} bsSize={bsSize}>
+    <StyledModal show={show} onHide={onHide}>
       <BaseModal.Header closeButton>
         <BaseModal.Title>
           <Title>{title}</Title>
diff --git a/superset-frontend/src/components/ModalTrigger.jsx b/superset-frontend/src/components/ModalTrigger.jsx
index d5e493af48..1a7ddd101d 100644
--- a/superset-frontend/src/components/ModalTrigger.jsx
+++ b/superset-frontend/src/components/ModalTrigger.jsx
@@ -34,7 +34,7 @@ const propTypes = {
   onExit: PropTypes.func,
   isButton: PropTypes.bool,
   isMenuItem: PropTypes.bool,
-  bsSize: PropTypes.string,
+  bsSize: PropTypes.oneOf(['large', 'small']), // react-bootstrap also supports 'sm', 'lg' but we're keeping it simple.
   className: PropTypes.string,
   tooltip: PropTypes.string,
   backdrop: PropTypes.oneOf(['static', true, false]),
diff --git a/superset-frontend/src/datasource/ChangeDatasourceModal.tsx b/superset-frontend/src/datasource/ChangeDatasourceModal.tsx
index 0b56bd239d..a63efadee1 100644
--- a/superset-frontend/src/datasource/ChangeDatasourceModal.tsx
+++ b/superset-frontend/src/datasource/ChangeDatasourceModal.tsx
@@ -120,7 +120,7 @@ const ChangeDatasourceModal: FunctionComponent<ChangeDatasourceModalProps> = ({
   };
 
   return (
-    <Modal show={show} onHide={onHide} onEnter={onEnterModal} bsSize="lg">
+    <Modal show={show} onHide={onHide} onEnter={onEnterModal} bsSize="large">
       <Modal.Header closeButton>
         <Modal.Title>{t('Select a datasource')}</Modal.Title>
       </Modal.Header>
diff --git a/superset-frontend/src/datasource/DatasourceModal.tsx b/superset-frontend/src/datasource/DatasourceModal.tsx
index c42689ec6e..19ea9d8267 100644
--- a/superset-frontend/src/datasource/DatasourceModal.tsx
+++ b/superset-frontend/src/datasource/DatasourceModal.tsx
@@ -110,7 +110,7 @@ const DatasourceModal: FunctionComponent<DatasourceModalProps> = ({
   };
 
   return (
-    <Modal show={show} onHide={onHide} bsSize="lg">
+    <Modal show={show} onHide={onHide} bsSize="large">
       <Modal.Header closeButton>
         <Modal.Title>
           <div>
diff --git a/superset-frontend/src/explore/components/controls/VizTypeControl.jsx b/superset-frontend/src/explore/components/controls/VizTypeControl.jsx
index cf5ad648f3..513b6b541c 100644
--- a/superset-frontend/src/explore/components/controls/VizTypeControl.jsx
+++ b/superset-frontend/src/explore/components/controls/VizTypeControl.jsx
@@ -213,7 +213,7 @@ export default class VizTypeControl extends React.PureComponent {
           onHide={this.toggleModal}
           onEnter={this.focusSearch}
           onExit={this.setSearchRef}
-          bsSize="lg"
+          bsSize="large"
         >
           <Modal.Header closeButton>
             <Modal.Title>{t('Select a visualization type')}</Modal.Title>