[GitHub] [incubator-airflow] XD-DENG opened pull request #3903: [AIRFLOW-3067] categorize www_rbac Flask flash msg properly

[GitHub]

Make sure you have checked _all_ steps below.

### Jira

- [x] My PR addresses the following [Airflow 
Jira](https://issues.apache.org/jira/browse/AIRFLOW/) issues and references 
them in the PR title. For example, "\[AIRFLOW-XXX\] My Airflow PR"
  - https://issues.apache.org/jira/browse/AIRFLOW-3067
  - In case you are fixing a typo in the documentation you can prepend your 
commit with \[AIRFLOW-XXX\], code changes always need a Jira issue.

### Description

- [x] Here are some details about my PR, including screenshots of any UI 
changes:

**Background**

For **`www_rbac`**, the Flask flash messages are not categorized properly (ref: 
http://flask.pocoo.org/docs/1.0/patterns/flashing/#flashing-with-categories), 
then the default category would be '`message`'. Flask Appbuilder would assign 
CSS class `alert-[category]` to that message when displaying it (ref: 
https://github.com/dpgaspar/Flask-AppBuilder/blob/master/flask_appbuilder/templates/appbuilder/flash.html).

**Issue**

But CSS class '`alert-message`' is not specified in _bootstrap-theme.css_. This 
makes the the flash messages in the `www_rbac` UI come with no background color 
(please check the screenshots attached. We don't see this issue in `www` UI as 
all flash messages without categories are classed into 'info', and CSS class 
'`alert-info`' in available in _bootstrap-theme.css_).

For flash messages which are categorized as `'error'`, it would not work either 
since CSS class `alert-error` is not avaialbe in _bootstrap-theme.css_ as well. 
We can use category `danger` or `warning` instead.

We have this issue in 1.10.0 as well as master branch.

**Solution**
- Add proper category when we invoke **flash()**.
- Available categories: 'success', 'info', 'warning', 'danger'.

**Screenshots - Before**
<img width="1280" alt="1" 
src="https://user-images.githubusercontent.com/11539188/45587396-73af2c80-b937-11e8-864e-a19603ebfa02.png";>

<img width="1280" alt="2" 
src="https://user-images.githubusercontent.com/11539188/45587398-76aa1d00-b937-11e8-84aa-ef9a249fd4de.png";>

**Screenshots - After**
<img width="1280" alt="3" 
src="https://user-images.githubusercontent.com/11539188/45587400-7ad63a80-b937-11e8-98ae-637d09304afc.png";>
<img width="1280" alt="4" 
src="https://user-images.githubusercontent.com/11539188/45587401-7d389480-b937-11e8-9a7e-b12f4598c333.png";>


### Tests

- [ ] My PR adds the following unit tests __OR__ does not need testing for this 
extremely good reason:

### Commits

- [x] My commits all reference Jira issues in their subject lines, and I have 
squashed multiple commits if they address the same issue. In addition, my 
commits follow the guidelines from "[How to write a good git commit 
message](http://chris.beams.io/posts/git-commit/)":
  1. Subject is separated from body by a blank line
  1. Subject is limited to 50 characters (not including Jira issue reference)
  1. Subject does not end with a period
  1. Subject uses the imperative mood ("add", not "adding")
  1. Body wraps at 72 characters
  1. Body explains "what" and "why", not "how"

### Documentation

- [ ] In case of new functionality, my PR adds documentation that describes how 
to use it.
  - When adding new operators/hooks/sensors, the autoclass documentation 
generation needs to be added.

### Code Quality

- [x] Passes `git diff upstream/master -u -- "*.py" | flake8 --diff`


[ Full content available at: 
https://github.com/apache/incubator-airflow/pull/3903 ]
This message was relayed via gitbox.apache.org for devnull@infra.apache.org