web: rewrite interface in react

This change rewrites the web interface using React:
http://lists.zuul-ci.org/pipermail/zuul-discuss/2018-August/000528.html

Depends-On: https://review.openstack.org/591964
Change-Id: Ic6c33102ac3da69ebd0b8e9c6c8b431d51f3cfd4
Co-Authored-By: Monty Taylor <mordred@inaugust.com>
Co-Authored-By: James E. Blair <jeblair@redhat.com>

playbooks/dashboard/multi.yaml

@@ -1,21 +0,0 @@
-- hosts: all
-  tasks:
-
-    - name: Make tenant subdir
-      file:
-        state: directory
-        dest: '{{ zuul.project.src_dir }}/{{ javascript_content_dir }}/t'
-
-    - name: Copy the html/javascript content into subdirs
-      shell: |
-          CONTENT_DIR="{{ zuul.project.src_dir }}/{{ javascript_content_dir }}"
-          mkdir $CONTENT_DIR/t/{{ item }}
-          for f in $(find $CONTENT_DIR -type f -mindepth 1 -maxdepth 1) ; do
-              cp $f $CONTENT_DIR/t/{{ item }}
-          done
-      with_items:
-        - local
-        - ansible
-        - ansible-dev
-        - openstack.org
-        - rdoproject.org

playbooks/dashboard/run.yaml

@@ -1,18 +1,19 @@
 - hosts: all
+  pre_tasks:
+    - name: Update homepage for sub directory deployment
+      replace:
+        path: '{{ zuul.project.src_dir }}/web/package.json'
+        regexp: '"homepage": "/"'
+        replace: '"homepage": "./"'
+        # NOTE: using "./" is not enough to support html5 links, even with
+        # rewrite rules for unknown files, accessing 'job/devstack' will make
+        # the dashboard load static files from 'job/static/...'
+        # This works for the preview dashboard that can only be loaded from the
+        # npm/html directory anyway.
   roles:
     - revoke-sudo
     - set-zuul-log-path-fact
-    # Both sets of quotes are required.
-    # The "" quotes are for the shell to protect the '' quotes.
-    # We need the '' quotes because defines here are essentially
-    # direct string substitutions. Therefore:
-    #   --define "ZUUL_API_URL='https://zuul.openstack.org'"
-    # with the javascript code:
-    #   return ZUUL_API_URL
-    # results in
-    #   return 'https://zuul.openstack.org'
-    # in the compiled javascript.
     - role: npm
-      npm_command: >-
-        build:dist --
-          --define "ZUUL_API_URL='{{ zuul_api_url }}'"
+      npm_command: build
+  environment:
+    REACT_APP_ZUUL_API: "{{ zuul_api_url }}/api/"