Minor alert bug fixes (#4274)

getredash · Oct 22, 2019 · 5d58503 · 5d58503
1 parent 3dfad87
commit 5d58503
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 18 deletions.
diff --git a/client/app/pages/alert/AlertEdit.jsx b/client/app/pages/alert/AlertEdit.jsx
@@ -15,14 +15,11 @@ import Query from './components/Query';
 
 import HorizontalFormItem from './components/HorizontalFormItem';
 
-const spinnerIcon = <i className="fa fa-spinner fa-pulse m-r-5" />;
-
 export default class AlertEdit extends React.Component {
   _isMounted = false;
 
   state = {
     saving: false,
-    canceling: false,
   }
 
   componentDidMount() {
@@ -43,25 +40,24 @@ export default class AlertEdit extends React.Component {
   }
 
   cancel = () => {
-    this.setState({ canceling: true });
     this.props.cancel();
   };
 
   render() {
     const { alert, queryResult, pendingRearm, onNotificationTemplateChange, menuButton } = this.props;
     const { onQuerySelected, onNameChange, onRearmChange, onCriteriaChange } = this.props;
     const { query, name, options } = alert;
-    const { saving, canceling } = this.state;
+    const { saving } = this.state;
 
     return (
       <>
         <Title name={name} alert={alert} onChange={onNameChange} editMode>
           <Button className="m-r-5" onClick={() => this.cancel()}>
-            {canceling ? spinnerIcon : <i className="fa fa-times m-r-5" />}
+            <i className="fa fa-times m-r-5" />
             Cancel
           </Button>
           <Button type="primary" onClick={() => this.save()}>
-            {saving ? spinnerIcon : <i className="fa fa-check m-r-5" />}
+            {saving ? <i className="fa fa-spinner fa-pulse m-r-5" /> : <i className="fa fa-check m-r-5" />}
             Save Changes
           </Button>
           {menuButton}
@@ -101,9 +97,11 @@ export default class AlertEdit extends React.Component {
                 </>
               )}
             </Form>
-            <HelpTrigger className="f-13" type="ALERT_SETUP">
-              Setup Instructions <i className="fa fa-question-circle" />
-            </HelpTrigger>
+            <div>
+              <HelpTrigger className="f-13" type="ALERT_SETUP">
+                Setup Instructions <i className="fa fa-question-circle" />
+              </HelpTrigger>
+            </div>
           </div>
         </div>
       </>

diff --git a/client/app/pages/alert/AlertView.jsx b/client/app/pages/alert/AlertView.jsx
@@ -7,7 +7,6 @@ import { Alert as AlertType } from '@/components/proptypes';
 
 import Form from 'antd/lib/form';
 import Button from 'antd/lib/button';
-import Icon from 'antd/lib/icon';
 import Tooltip from 'antd/lib/tooltip';
 
 import Title from './components/Title';
@@ -46,6 +45,7 @@ AlertState.defaultProps = {
   lastTriggered: null,
 };
 
+// eslint-disable-next-line react/prefer-stateless-function
 export default class AlertView extends React.Component {
   render() {
     const { alert, queryResult, canEdit, onEdit, menuButton } = this.props;
@@ -66,13 +66,8 @@ export default class AlertView extends React.Component {
                 <AlertState state={alert.state} lastTriggered={alert.last_triggered_at} />
               </HorizontalFormItem>
               <HorizontalFormItem label="Query">
-                <Query query={query} queryResult={queryResult} onChange={this.onQuerySelected} />
+                <Query query={query} queryResult={queryResult} />
               </HorizontalFormItem>
-              {query && !queryResult && (
-                <HorizontalFormItem className="m-t-30">
-                  <Icon type="loading" className="m-r-5" /> Loading query data
-                </HorizontalFormItem>
-              )}
               {queryResult && options && (
                 <>
                   <HorizontalFormItem label="Trigger when" className="alert-criteria">

diff --git a/client/cypress/integration/alert/edit_alert_spec.js b/client/cypress/integration/alert/edit_alert_spec.js
@@ -28,7 +28,7 @@ describe('Edit Alert', () => {
   it('previews rendered template correctly', () => {
     const options = {
       value: '123',
-      op: '=',
+      op: '==',
       custom_subject: '{{ ALERT_CONDITION }}',
       custom_body: '{{ ALERT_THRESHOLD }}',
     };