Migrate preview deployments from Netlify to Vercel (#9471)

This adds:

* a script for building and deploying the Ember UI and Storybook to
  Vercel
* configuration for that deployment
* a header link to the UI to link to Storybook when built with
  STORYBOOK_LINK=true

It also removes a file used to configure Netlify redirects.

The Netlify setup had two “sites”: nomad-storybook and nomad-ui. I
attempted to replicate that here but ran into some platform limitations
with Vercel: two “projects” cannot share the same root directory without
also sharing the same vercel.json that lets us specify configuration
such as the rewrite needed to handle deep linking into the Ember UI. I
tried having Storybook use /ui/storybook as the root directory (and
adding a symbolically-linked package.json to bypass Vercel’s refusal
to build without it) but that produced broken Storybook deployments.

This instead combines the two projects into one
(nomad-storybook-and-ui), defaults to forwarding / to /ui/, and
adds the header link to the UI to navigate to Storybook.

Rather than have a complex build script in the Vercel configuration UI,
this delegates to a script in the repository.

.netlify/ui-redirects

@@ -1,2 +0,0 @@
-/ /ui
-/ui/* /ui/index.html 200

ui/.vercel/build.sh

@@ -0,0 +1,6 @@
+STORYBOOK_LINK=true ember build
+mkdir -p ui-dist/ui
+mv dist/* ui-dist/ui/
+
+yarn build-storybook
+mv storybook-static ui-dist/storybook/

ui/README.md

@@ -83,7 +83,7 @@ Nomad UI releases are in lockstep with Nomad releases and are integrated into th
 
 ### Storybook UI Library
 
-The Storybook project provides a browser to see what components and patterns are present in the application and how to use them. You can run it locally with `yarn storybook` after you have `ember serve` running. The latest version from the `master` branch is at [`nomad-storybook.netlify.com`](https://nomad-storybook.netlify.com/).
+The Storybook project provides a browser to see what components and patterns are present in the application and how to use them. You can run it locally with `yarn storybook` after you have `ember serve` running. The latest version from the `master` branch is at [`nomad-storybook-and-ui.vercel.app/storybook/`](https://nomad-storybook-and-ui.vercel.app/storybook/).
 
 To generate a new story for a component, run `ember generate story component-name`. You can use the existing stories as a guide.
 

ui/app/components/global-header.js

@@ -1,8 +1,11 @@
 import Component from '@ember/component';
 import classic from 'ember-classic-decorator';
+import { inject as service } from '@ember/service';
 
 @classic
 export default class GlobalHeader extends Component {
+  @service config;
+
   'data-test-global-header' = true;
   onHamburgerClick() {}
 }

ui/app/templates/components/global-header.hbs

@@ -11,6 +11,9 @@
     <GlobalSearch::Control />
   {{/unless}}
   <div class="navbar-end">
+    {{#if this.config.APP.showStorybookLink}}
+      <a href="/storybook/" class="navbar-item">Storybook</a>
+    {{/if}}
     <a href="https://nomadproject.io/docs" class="navbar-item">Documentation</a>
     <LinkTo @route="settings.tokens" class="navbar-item">ACL Tokens</LinkTo>
   </div>

ui/config/environment.js

@@ -29,6 +29,7 @@ module.exports = function(environment) {
       mirageWithNamespaces: false,
       mirageWithTokens: true,
       mirageWithRegions: true,
+      showStorybookLink: process.env.STORYBOOK_LINK === 'true',
     },
   };
 

ui/vercel.json

@@ -0,0 +1,12 @@
+{
+  "github": {
+    "silent": true
+  },
+  "redirects": [
+    { "source": "/", "destination": "/ui/" }
+  ],
+  "rewrites": [
+    { "source": "/ui/(.*)", "destination": "/ui/index.html" }
+  ],
+  "trailingSlash": true
+}