Airflow 2.0 UI Overhaul/Refresh (#11195)

Resolves #10953.

A refreshed UI for the 2.0 release. The existing "theming" is a bit long in the tooth and this PR attempts to give it a modern look and some freshness to compliment all of the new features under the hood.

The majority of the changes to UI have been done through updates to the Bootstrap theme contained in bootstrap-theme.css. These are simply overrides to the default stylings that are packaged with Bootstrap.

airflow/config_templates/config.yml

@@ -971,7 +971,7 @@
       version_added: ~
       type: string
       example: ~
-      default: "#007A87"
+      default: "#fff"
     - name: default_dag_run_display_number
       description: |
         Default dagrun to show in UI

airflow/config_templates/default_airflow.cfg

@@ -488,7 +488,7 @@ hide_paused_dags_by_default = False
 page_size = 100
 
 # Define the color of navigation bar
-navbar_color = #007A87
+navbar_color = #fff
 
 # Default dagrun to show in UI
 default_dag_run_display_number = 25

airflow/utils/platform.py

@@ -57,6 +57,6 @@ def get_airflow_git_version():
     try:
         git_version = str(pkgutil.get_data('airflow', 'git_version'), encoding="UTF-8")
     except Exception as e:  # pylint: disable=broad-except
-        log.error(e)
+        log.debug(e)
 
     return git_version

airflow/www/extensions/init_appbuilder_links.py

@@ -21,12 +21,9 @@
 def init_appbuilder_links(app):
     """Add links to Docs menu in navbar"""
     appbuilder = app.appbuilder
-
-    appbuilder.add_link(
-        "Website", href='https://airflow.apache.org', category="Docs", category_icon="fa-globe"
-    )
-    appbuilder.add_link("Documentation", href=get_docs_url(), category="Docs", category_icon="fa-cube")
-    appbuilder.add_link("GitHub", href='https://github.com/apache/airflow', category="Docs")
+    appbuilder.add_link("Documentation", href=get_docs_url(), category="Docs")
+    appbuilder.add_link("Airflow Website", href='https://airflow.apache.org', category="Docs")
+    appbuilder.add_link("GitHub Repo", href='https://github.com/apache/airflow', category="Docs")
     appbuilder.add_link(
         "REST API Reference (Swagger UI)", href='/api/v1./api/v1_swagger_ui_index', category="Docs"
     )

airflow/www/extensions/init_jinja_globals.py

@@ -15,12 +15,15 @@
 # specific language governing permissions and limitations
 # under the License.
 
+import logging
 import socket
 
 import pendulum
 
+import airflow
 from airflow.configuration import conf
 from airflow.settings import STATE_COLORS
+from airflow.utils.platform import get_airflow_git_version
 
 
 def init_jinja_globals(app):
@@ -42,6 +45,14 @@ def init_jinja_globals(app):
     expose_hostname = conf.getboolean('webserver', 'EXPOSE_HOSTNAME', fallback=True)
     hosstname = socket.getfqdn() if expose_hostname else 'redact'
 
+    try:
+        airflow_version = airflow.__version__
+    except Exception as e:  # pylint: disable=broad-except
+        airflow_version = None
+        logging.error(e)
+
+    git_version = get_airflow_git_version()
+
     def prepare_jinja_globals():
         extra_globals = {
             'server_timezone': server_timezone,
@@ -51,7 +62,9 @@ def prepare_jinja_globals():
             'log_fetch_delay_sec': conf.getint('webserver', 'log_fetch_delay_sec', fallback=2),
             'log_auto_tailing_offset': conf.getint('webserver', 'log_auto_tailing_offset', fallback=30),
             'log_animation_speed': conf.getint('webserver', 'log_animation_speed', fallback=1000),
-            'state_color_mapping': STATE_COLORS
+            'state_color_mapping': STATE_COLORS,
+            'airflow_version': airflow_version,
+            'git_version': git_version
         }
 
         if 'analytics_tool' in conf.getsection('webserver'):

airflow/www/extensions/init_views.py

@@ -58,7 +58,6 @@ def init_appbuilder_views(app):
     appbuilder.add_view(views.PoolModelView, "Pools", category="Admin")
     appbuilder.add_view(views.VariableModelView, "Variables", category="Admin")
     appbuilder.add_view(views.XComModelView, "XComs", category="Admin")
-    appbuilder.add_view(views.VersionView, 'Version', category='About', category_icon='fa-th')
     # add_view_no_menu to change item position.
     # I added link in extensions.init_appbuilder_links.init_appbuilder_links
     appbuilder.add_view_no_menu(views.RedocView)