feat(joyent-boilerplate): initial commit

packages/cloudapi-gql/src/credentials.js

@@ -1,10 +1,11 @@
+const path = require('path');
+
 const json = (() => {
   try {
     const res = require('dotenv').config({
-      path: '../.env',
+      path: path.join(__dirname, '../.env'),
       silent: true
     });
-
     if (res.error) {
       throw res.error;
     }

packages/eslint-config/index.js

@@ -2,13 +2,7 @@
 // TODO wait for eslint/eslint#3458
 
 module.exports = {
-  extends: [
+  extends: ['eslint:recommended', 'xo-space/esnext', 'react-app', 'prettier', 'prettier/react'],
-    'eslint:recommended',
-    'xo-space/esnext',
-    'react-app',
-    'prettier',
-    'prettier/react'
-  ],
   rules: {
     'capitalized-comments': 0
   }

packages/joyent-boilerplate/.babelrc

@@ -0,0 +1,9 @@
+{
+  "presets": "joyent-portal",
+  "plugins": [
+    "styled-components",
+    ["inline-react-svg", {
+      "ignorePattern": "libre-franklin"
+    }]
+  ]
+}

packages/joyent-boilerplate/.dockerignore

@@ -0,0 +1,9 @@
+src/components/base/*.css
+node_modules
+coverage
+.nyc_output
+docs/static
+!docs/static/index.html
+docs/node_modules
+dist
+package-lock.json

packages/joyent-boilerplate/.eslintignore

@@ -0,0 +1,4 @@
+.nyc_output
+coverage
+dist
+build

packages/joyent-boilerplate/.eslintrc

@@ -0,0 +1,11 @@
+{
+  "extends": "joyent-portal",
+  "rules": {
+    "no-console": 0,
+    "new-cap": 0,
+    // temp
+    "no-undef": 1,
+    "no-debugger": 1,
+    "no-negated-condition": 0
+  }
+}

packages/joyent-boilerplate/.gitignore

@@ -0,0 +1,18 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+

packages/joyent-boilerplate/.stylelintrc

@@ -0,0 +1,8 @@
+{
+  "processors": ["stylelint-processor-styled-components"],
+  "extends": [
+    "stylelint-config-standard",
+    "stylelint-config-styled-components"
+  ],
+  "syntax": "scss"
+}

packages/joyent-boilerplate/.tern-project

@@ -0,0 +1,15 @@
+{
+  "libs": [
+    "ecmascript",
+    "browser"
+  ],
+  "plugins": {
+    "doc_comment": true,
+    "local-scope": true,
+    "jsx": true,
+    "node": true,
+    "webpack": {
+      "configPath": "./node_modules/react-scripts/config/webpack.config.dev.js"
+    }
+  }
+}

packages/joyent-boilerplate/CHANGELOG.md

@@ -0,0 +1,4 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.

packages/joyent-boilerplate/Dockerfile

@@ -0,0 +1,19 @@
+FROM quay.io/yldio/alpine-node-containerpilot:latest
+
+RUN apk add --update nginx
+
+ENV CONTAINERPILOT /etc/containerpilot.json5
+
+RUN npm install -g npm@^4
+RUN npm config set loglevel info \
+	&& yarn add lerna@^2.0.0
+
+RUN ./node_modules/.bin/lerna clean --yes --scope joyent-boilerplate --include-filtered-dependencies \
+	&& ./node_modules/.bin/lerna bootstrap --scope joyent-boilerplate --include-filtered-dependencies
+
+COPY packages/boilerplate/etc/containerpilot.json5 ${CONTAINERPILOT}
+COPY packages/boilerplate/etc/nginx.conf.tmpl /etc/nginx/nginx.conf.tmpl
+
+WORKDIR /opt/app/packages/boilerplate
+
+CMD ["/bin/containerpilot"]

packages/joyent-boilerplate/README.md

@@ -0,0 +1,21 @@
+# joyent-boilerplate
+
+[![Docker Repository on Quay](https://quay.io/repository/yldio/joyent-boilerplate/status)](https://quay.io/repository/yldio/joyent-boilerplate)
+[![License: MPL 2.0](https://img.shields.io/badge/License-MPL%202.0-brightgreen.svg)](https://opensource.org/licenses/MPL-2.0)
+[![standard-readme compliant](https://img.shields.io/badge/standard--readme-OK-green.svg)](https://github.com/RichardLitt/standard-readme)
+
+## Table of Contents
+
+- [Usage](#usage)
+- [License](#license)
+
+## Usage
+
+```
+npm run start
+open http://0.0.0.0:3069
+```
+
+## License
+
+MPL-2.0

packages/joyent-boilerplate/package.json

@@ -0,0 +1,95 @@
+{
+  "name": "joyent-boilerplate",
+  "version": "1.0.0",
+  "license": "MPL-2.0",
+  "repository": "github:yldio/joyent-portal",
+  "main": "build/",
+  "scripts": {
+    "dev": "REACT_APP_GQL_PORT=3000 PORT=3069 REACT_APP_GQL_PROTOCOL=http react-scripts start",
+    "start": "PORT=3069 react-scripts start",
+    "build": "NODE_ENV=production react-scripts build",
+    "lint:css": "stylelint './src/**/*.js'",
+    "lint:js": "eslint . --fix",
+    "lint": "redrun -s lint:*",
+    "lint-ci:css": "stylelint './src/**/*.js'",
+    "lint-ci:js": "eslint . --format junit --output-file $CIRCLE_TEST_REPORTS/lint/cp-frontend.xml",
+    "lint-ci": "redrun -p lint-ci:*",
+    "test": "NODE_ENV=test ./test/run --env=jsdom",
+    "test-ci": "echo 0 `# NODE_ENV=test JEST_JUNIT_OUTPUT=$CIRCLE_TEST_REPORTS/test/cp-frontend.xml ./test/run --env=jsdom --coverage --coverageDirectory=$CIRCLE_ARTIFACTS/cp-frontend --testResultsProcessor=$(node -e \"console.log(require.resolve('jest-junit'))\")`",
+    "prepublish": "node scripts/postinstall"
+  },
+  "dependencies": {
+    "apollo": "^0.2.2",
+    "apr-intercept": "^1.0.4",
+    "chart.js": "^2.6.0",
+    "constant-case": "^2.0.0",
+    "force-array": "^3.1.0",
+    "graphql-tag": "^2.4.2",
+    "jest-cli": "^20.0.4",
+    "joyent-manifest-editor": "^1.1.0",
+    "joyent-ui-toolkit": "^1.2.0",
+    "js-yaml": "^3.9.1",
+    "lodash.find": "^4.6.0",
+    "lodash.flatten": "^4.4.0",
+    "lodash.get": "^4.4.2",
+    "lodash.isstring": "^4.0.1",
+    "lodash.remove": "^4.7.0",
+    "lodash.uniq": "^4.5.0",
+    "lodash.uniqby": "^4.7.0",
+    "normalized-styled-components": "^1.0.9",
+    "param-case": "^2.1.1",
+    "prop-types": "^15.5.10",
+    "react": "^15.6.1",
+    "react-apollo": "^1.4.15",
+    "react-bundle": "^1.0.4",
+    "react-codemirror": "^1.0.0",
+    "react-dom": "^15.6.1",
+    "react-redux": "^5.0.6",
+    "react-router": "^4.1.1",
+    "react-router-dom": "^4.1.2",
+    "react-simple-table": "^1.0.1",
+    "react-styled-flexboxgrid": "^2.0.3",
+    "redux": "^3.7.2",
+    "redux-actions": "^2.2.1",
+    "redux-batched-actions": "^0.2.0",
+    "redux-form": "^7.0.3",
+    "remcalc": "^1.0.8",
+    "reselect": "^3.0.1",
+    "simple-statistics": "^4.1.1",
+    "styled-components": "^2.1.2",
+    "styled-is": "^1.0.11",
+    "styled-text-spinners": "^1.0.1",
+    "title-case": "^2.1.1",
+    "unitcalc": "^1.0.8",
+    "uuid": "^3.1.0"
+  },
+  "devDependencies": {
+    "apr-for-each": "^1.0.6",
+    "apr-main": "^1.0.7",
+    "babel-plugin-inline-react-svg": "^0.4.0",
+    "babel-plugin-styled-components": "^1.2.0",
+    "babel-preset-joyent-portal": "^2.0.0",
+    "cross-env": "^5.0.5",
+    "eslint": "^4.5.0",
+    "eslint-config-joyent-portal": "3.0.0",
+    "jest": "^21.0.1",
+    "jest-alias-preprocessor": "^1.1.1",
+    "jest-cli": "^20.0.4",
+    "jest-diff": "^20.0.3",
+    "jest-junit": "^3.0.0",
+    "jest-matcher-utils": "^20.0.3",
+    "jest-snapshot": "^20.0.3",
+    "jest-styled-components": "^4.4.1",
+    "jest-transform-graphql": "^2.1.0",
+    "lodash.sortby": "^4.7.0",
+    "mz": "^2.6.0",
+    "react-scripts": "^1.0.12",
+    "react-test-renderer": "^15.6.1",
+    "redrun": "^5.9.17",
+    "stylelint": "^8.1.1",
+    "stylelint-config-primer": "^2.0.1",
+    "stylelint-config-standard": "^17.0.0",
+    "stylelint-config-styled-components": "^0.1.1",
+    "stylelint-processor-styled-components": "^0.4.0"
+  }
+}

packages/joyent-boilerplate/public/index.html

@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
+    <title>Joyent Boilerplate</title>
+    <style>
+      html, body, #root {
+        height: 100%;
+      }
+
+      #root {
+        display: flex;
+        flex-flow: column;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="root"></div>
+  </body>
+</html>

packages/joyent-boilerplate/scripts/patch-webpack-config.js

@@ -0,0 +1,120 @@
+const webpack = require('webpack');
+const isString = require('lodash.isstring');
+const fs = require('fs');
+const path = require('path');
+
+const FRONTEND_ROOT = process.cwd();
+const FRONTEND = path.join(FRONTEND_ROOT, 'src');
+
+const BabelLoader = loader => ({
+  test: loader.test,
+  include: loader.include,
+  loader: loader.loader,
+  options: {
+    babelrc: true,
+    cacheDirectory: true
+  }
+});
+
+const FileLoader = loader => ({
+  exclude: loader.exclude.concat([/\.(graphql|gql)$/]),
+  loader: loader.loader,
+  options: loader.options
+});
+
+module.exports = config => {
+  config.resolve.plugins = [];
+
+  config.plugins = config.plugins.filter(
+    plugin => !(plugin instanceof webpack.optimize.UglifyJsPlugin)
+  );
+
+  config.module.rules = config.module.rules
+    .reduce((loaders, loader, index) => {
+      if (Array.isArray(loader.use)) {
+        return loaders.concat([
+          Object.assign(loader, {
+            use: loader.use.map(l => {
+              if (isString(l) || !isString(l.loader)) {
+                return l;
+              }
+
+              if (!l.loader.match(/eslint-loader/)) {
+                return l;
+              }
+
+              return Object.assign(l, {
+                options: Object.assign(l.options, {
+                  baseConfig: null,
+                  useEslintrc: true
+                })
+              });
+            })
+          })
+        ]);
+      }
+
+      if (Array.isArray(loader.oneOf)) {
+        return loaders.concat([
+          Object.assign(loader, {
+            oneOf: loader.oneOf.map(loader => {
+              if (!isString(loader.loader)) {
+                return loader;
+              }
+
+              if (loader.loader.match(/babel-loader/)) {
+                return BabelLoader(loader);
+              }
+
+              if (loader.loader.match(/file-loader/)) {
+                return FileLoader(loader);
+              }
+
+              return loader;
+            })
+          })
+        ]);
+      }
+
+      if (!isString(loader.loader)) {
+        return loaders.concat([loader]);
+      }
+
+      if (loader.loader.match(/babel-loader/)) {
+        return loaders.concat(BabelLoader(loader));
+      }
+
+      if (loader.loader.match(/file-loader/)) {
+        return loaders.concat([FileLoader(loader)]);
+      }
+
+      return loaders.concat([loader]);
+    }, [])
+    .concat([
+      {
+        test: /\.(graphql|gql)$/,
+        exclude: /node_modules/,
+        loader: require.resolve('graphql-tag/loader')
+      }
+    ]);
+
+  config.resolve.alias = Object.assign(
+    {},
+    config.resolve.alias,
+    fs
+      .readdirSync(FRONTEND)
+      .map(name => path.join(FRONTEND, name))
+      .filter(fullpath => fs.statSync(fullpath).isDirectory())
+      .reduce(
+        (aliases, fullpath) =>
+          Object.assign(aliases, {
+            [`@${path.basename(fullpath)}`]: fullpath
+          }),
+        {
+          '@root': FRONTEND
+        }
+      )
+  );
+
+  return config;
+};

packages/joyent-boilerplate/scripts/postinstall.js

@@ -0,0 +1,41 @@
+const { readFile, writeFile, exists } = require('mz/fs');
+const main = require('apr-main');
+const forEach = require('apr-for-each');
+const path = require('path');
+
+const ROOT = path.join(__dirname, '../../../node_modules/react-scripts/config');
+const configs = ['webpack.config.dev', 'webpack.config.prod'];
+
+const toCopy = [
+  'patch-webpack-config',
+  'webpack.config.dev',
+  'webpack.config.prod'
+];
+
+const backup = async file => {
+  const backupPath = path.join(ROOT, `${file}.original.js`);
+  const backupExists = await exists(backupPath);
+
+  if (backupExists) {
+    return;
+  }
+
+  const originalPath = path.join(ROOT, `${file}.js`);
+  const orignalConfig = await readFile(originalPath, 'utf-8');
+  return writeFile(backupPath, orignalConfig);
+};
+
+const copy = async file => {
+  const srcPath = path.join(__dirname, `${file}.js`);
+  const destPath = path.join(ROOT, `${file}.js`);
+
+  const src = await readFile(srcPath, 'utf-8');
+  return writeFile(destPath, src);
+};
+
+main(
+  (async () => {
+    await forEach(configs, backup);
+    await forEach(toCopy, copy);
+  })()
+);

packages/joyent-boilerplate/scripts/webpack.config.dev.js

@@ -0,0 +1,4 @@
+const originalConfig = require('./webpack.config.dev.original');
+const patch = require('./patch-webpack-config');
+
+module.exports = patch(originalConfig);

packages/joyent-boilerplate/scripts/webpack.config.prod.js

@@ -0,0 +1,4 @@
+const originalConfig = require('./webpack.config.prod.original');
+const patch = require('./patch-webpack-config');
+
+module.exports = patch(originalConfig);

packages/joyent-boilerplate/src/app.js

@@ -0,0 +1,26 @@
+import React, { Component } from 'react';
+import { ThemeProvider, injectGlobal } from 'styled-components';
+import { theme, global } from 'joyent-ui-toolkit';
+import { ApolloProvider } from 'react-apollo';
+
+import { client, store } from '@state/store';
+import Router from '@root/router';
+
+class App extends Component {
+  componentWillMount() {
+    // eslint-disable-next-line no-unused-expressions
+    injectGlobal`
+      ${global}
+    `;
+  }
+
+  render() {
+    return (
+      <ApolloProvider client={client} store={store}>
+        <ThemeProvider theme={theme}>{Router}</ThemeProvider>
+      </ApolloProvider>
+    );
+  }
+}
+
+export default App;

packages/joyent-boilerplate/src/components/layout/__tests__/__snapshots__/container.spec.js.snap

@@ -0,0 +1,38 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders <Container /> without throwing 1`] = `
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  padding-top: 1.1875rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  display: block;
+  -webkit-flex-flow: column;
+  -ms-flex-flow: column;
+  flex-flow: column;
+}
+
+@media only screen and (min-width:48em) {
+  .c0 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c0 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c0 {
+    width: 76rem;
+  }
+}
+
+<div
+  className="c0"
+/>
+`;

packages/joyent-boilerplate/src/components/layout/__tests__/container.spec.js

@@ -0,0 +1,14 @@
+/**
+ * @jest-environment jsdom
+ */
+
+import React from 'react';
+import renderer from 'react-test-renderer';
+import 'jest-styled-components';
+
+import Container from '../container';
+
+it('renders <Container /> without throwing', () => {
+  const tree = renderer.create(<Container />).toJSON();
+  expect(tree).toMatchSnapshot();
+});

packages/joyent-boilerplate/src/components/layout/container.js

@@ -0,0 +1,20 @@
+import { Grid } from 'react-styled-flexboxgrid';
+import remcalc from 'remcalc';
+import is, { isNot } from 'styled-is';
+
+export default Grid.extend`
+  padding-top: ${remcalc(19)};
+  ${isNot('plain')`
+    flex: 1 1 auto;
+    display: block;
+    flex-flow: column;
+  `};
+  ${is('center')`
+    display: flex;
+    flex-direction: column;
+    flex-wrap: nowrap;
+    justify-content: center;
+    align-content: center;
+    align-items: center;
+  `};
+`;

packages/joyent-boilerplate/src/components/layout/index.js

@@ -0,0 +1 @@
+export { default as LayoutContainer } from './container';

packages/joyent-boilerplate/src/components/navigation/__tests__/__snapshots__/header.spec.js.snap

@@ -0,0 +1,140 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders <Header /> without throwing 1`] = `
+.c2 {
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 500;
+  font-size: 1.5rem;
+  text-transform: uppercase;
+  color: ;
+  font-size: 1.8125rem;
+  margin: 0;
+}
+
+.c1 {
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-align-self: stretch;
+  -ms-flex-item-align: stretch;
+  align-self: stretch;
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  padding: 0.9375rem 0;
+}
+
+.c0 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: space-between;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: space-between;
+  justify-content: space-between;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  -webkit-align-items: stretch;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+  background-color: ;
+  max-height: 3.3125rem;
+  min-height: 3.3125rem;
+  padding: 0 1.125rem;
+  line-height: 1.5625rem;
+}
+
+.c3 {
+  border-style: none;
+  width: 5.4375rem;
+  height: 1.5625rem;
+}
+
+<div
+  className="c0"
+>
+  .c1 {
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 500;
+  font-size: 1.5rem;
+  text-transform: uppercase;
+  color: ;
+  font-size: 1.8125rem;
+  margin: 0;
+}
+
+.c0 {
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-align-self: stretch;
+  -ms-flex-item-align: stretch;
+  align-self: stretch;
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  padding: 0.9375rem 0;
+}
+
+.c2 {
+  border-style: none;
+  width: 5.4375rem;
+  height: 1.5625rem;
+}
+
+<div
+    className="c0"
+  >
+    .c0 {
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 500;
+  font-size: 1.5rem;
+  text-transform: uppercase;
+  color: ;
+  font-size: 1.8125rem;
+  margin: 0;
+}
+
+.c1 {
+  border-style: none;
+  width: 5.4375rem;
+  height: 1.5625rem;
+}
+
+<h2
+      className="c0"
+    >
+      .c0 {
+  border-style: none;
+  width: 5.4375rem;
+  height: 1.5625rem;
+}
+
+<a
+        href="/"
+        onClick={[Function]}
+      >
+        .c0 {
+  border-style: none;
+  width: 5.4375rem;
+  height: 1.5625rem;
+}
+
+<img
+          className="c0"
+          src="test-file-mock"
+        />
+      </a>
+    </h2>
+  </div>
+</div>
+`;

packages/joyent-boilerplate/src/components/navigation/__tests__/__snapshots__/not-found.spec.js.snap

@@ -0,0 +1,345 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders <NotFound /> without throwing 1`] = `
+.c6 {
+  display: inline-block;
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  margin: 0;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 400;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: ;
+  background-image: none;
+  background-color: ;
+  border-radius: 0.25rem;
+  border: solid 0.0625rem;
+}
+
+.c6:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: ;
+  border-color: ;
+}
+
+.c6:hover {
+  background-color: ;
+  border: solid 0.0625rem;
+}
+
+.c6:active,
+.c6:active:hover,
+.c6:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: ;
+  border-color: ;
+}
+
+.c6[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c3 {
+  font-size: 2rem;
+  margin: 0.625rem 0;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 500;
+  font-size: 2.25rem;
+  font-style: normal;
+  font-stretch: normal;
+  margin: 0;
+}
+
+.c5 {
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 400;
+  line-height: 1.5rem;
+  font-size: 0.9375rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  padding-top: 1.1875rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  display: block;
+  -webkit-flex-flow: column;
+  -ms-flex-flow: column;
+  flex-flow: column;
+}
+
+.c1 {
+  margin-top: 3.75rem;
+}
+
+.c2 {
+  font-weight: normal;
+  font-size: 2rem;
+}
+
+.c4 {
+  margin-bottom: 1.875rem;
+  max-width: 30.625rem;
+}
+
+@media only screen and (min-width:48em) {
+  .c0 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c0 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c0 {
+    width: 76rem;
+  }
+}
+
+<div
+  className="c0"
+>
+  .c5 {
+  display: inline-block;
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  margin: 0;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 400;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: ;
+  background-image: none;
+  background-color: ;
+  border-radius: 0.25rem;
+  border: solid 0.0625rem;
+}
+
+.c5:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: ;
+  border-color: ;
+}
+
+.c5:hover {
+  background-color: ;
+  border: solid 0.0625rem;
+}
+
+.c5:active,
+.c5:active:hover,
+.c5:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: ;
+  border-color: ;
+}
+
+.c5[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c2 {
+  font-size: 2rem;
+  margin: 0.625rem 0;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 500;
+  font-size: 2.25rem;
+  font-style: normal;
+  font-stretch: normal;
+  margin: 0;
+}
+
+.c4 {
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 400;
+  line-height: 1.5rem;
+  font-size: 0.9375rem;
+}
+
+.c0 {
+  margin-top: 3.75rem;
+}
+
+.c1 {
+  font-weight: normal;
+  font-size: 2rem;
+}
+
+.c3 {
+  margin-bottom: 1.875rem;
+  max-width: 30.625rem;
+}
+
+<div
+    className="c0"
+  >
+    .c1 {
+  font-size: 2rem;
+  margin: 0.625rem 0;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 500;
+  font-size: 2.25rem;
+  font-style: normal;
+  font-stretch: normal;
+  margin: 0;
+}
+
+.c0 {
+  font-weight: normal;
+  font-size: 2rem;
+}
+
+<h1
+      className="c0 c1"
+    >
+      I have no memory of this place
+    </h1>
+    .c1 {
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 400;
+  line-height: 1.5rem;
+  font-size: 0.9375rem;
+}
+
+.c0 {
+  margin-bottom: 1.875rem;
+  max-width: 30.625rem;
+}
+
+<p
+      className="c0 c1"
+    >
+      HTTP 404: We can’t find what you are looking for. Next time, always follow your nose.
+    </p>
+    .c0 {
+  display: inline-block;
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  margin: 0;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 400;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: ;
+  background-image: none;
+  background-color: ;
+  border-radius: 0.25rem;
+  border: solid 0.0625rem;
+}
+
+.c0:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: ;
+  border-color: ;
+}
+
+.c0:hover {
+  background-color: ;
+  border: solid 0.0625rem;
+}
+
+.c0:active,
+.c0:active:hover,
+.c0:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: ;
+  border-color: ;
+}
+
+.c0[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+<a
+      className="c0"
+      href="/"
+      onClick={[Function]}
+      primary={true}
+    >
+      Back home
+    </a>
+  </div>
+</div>
+`;

packages/joyent-boilerplate/src/components/navigation/__tests__/header.spec.js

@@ -0,0 +1,21 @@
+/**
+ * @jest-environment jsdom
+ */
+
+import React from 'react';
+import renderer from 'react-test-renderer';
+import 'jest-styled-components';
+
+import { Router } from '@mocks/';
+import { Header } from '../';
+
+it('renders <Header /> without throwing', () => {
+  const tree = renderer
+    .create(
+      <Router>
+        <Header />
+      </Router>
+    )
+    .toJSON();
+  expect(tree).toMatchSnapshot();
+});

packages/joyent-boilerplate/src/components/navigation/__tests__/not-found.spec.js

@@ -0,0 +1,19 @@
+/**
+ * @jest-environment jsdom
+ */
+
+import React from 'react';
+import renderer from 'react-test-renderer';
+import 'jest-styled-components';
+import { Router } from '@mocks/';
+
+import { NotFound } from '../';
+
+it('renders <NotFound /> without throwing', () => {
+  const tree = renderer.create(
+        <Router>
+            <NotFound />
+        </Router>
+    ).toJSON();
+  expect(tree).toMatchSnapshot();
+});

packages/joyent-boilerplate/src/components/navigation/header.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+import { Img } from 'normalized-styled-components';
+import remcalc from 'remcalc';
+
+import Logo from '@assets/triton_logo.png';
+import {
+  Header,
+  HeaderBrand,
+} from 'joyent-ui-toolkit';
+
+const StyledLogo = Img.extend`
+  width: ${remcalc(87)};
+  height: ${remcalc(25)};
+`;
+
+const NavHeader = () => (
+  <Header>
+    <HeaderBrand>
+      <Link to="/">
+        <StyledLogo src={Logo} />
+      </Link>
+    </HeaderBrand>
+  </Header>
+);
+
+export default NavHeader;

packages/joyent-boilerplate/src/components/navigation/index.js

@@ -0,0 +1,2 @@
+export { default as Header } from './header';
+export { default as NotFound } from './not-found';

packages/joyent-boilerplate/src/components/navigation/not-found.js

@@ -0,0 +1,44 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styled from 'styled-components';
+import remcalc from 'remcalc';
+import { H1, P, Button } from 'joyent-ui-toolkit';
+import { LayoutContainer } from '@components/layout';
+
+const StyledContainer = styled.div`
+  margin-top: ${remcalc(60)};
+`;
+
+const StyledTitle = styled(H1)`
+  font-weight: normal;
+  font-size: ${remcalc(32)};
+`;
+
+const StyledP = styled(P)`
+  margin-bottom: ${remcalc(30)};
+  max-width: ${remcalc(490)};
+`;
+
+const NotFound = ({
+  title = 'I have no memory of this place',
+  message = 'HTTP 404: We can’t find what you are looking for. Next time, always follow your nose.',
+  link = 'Back home',
+  to = '/'
+}) => (
+  <LayoutContainer>
+    <StyledContainer>
+      <StyledTitle>{title}</StyledTitle>
+      <StyledP>{message}</StyledP>
+      <Button to={to}>{link}</Button>
+    </StyledContainer>
+  </LayoutContainer>
+);
+
+NotFound.propTypes = {
+  title: PropTypes.string,
+  message: PropTypes.string,
+  link: PropTypes.string,
+  to: PropTypes.string
+};
+
+export default NotFound;

packages/joyent-boilerplate/src/containers/home/__tests__/__snapshots__/index.spec.js.snap

@@ -0,0 +1,40 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders <Home /> without throwing 1`] = `
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  padding-top: 1.1875rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  display: block;
+  -webkit-flex-flow: column;
+  -ms-flex-flow: column;
+  flex-flow: column;
+}
+
+@media only screen and (min-width:48em) {
+  .c0 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c0 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c0 {
+    width: 76rem;
+  }
+}
+
+<div
+  className="c0"
+>
+  Welcome
+</div>
+`;

packages/joyent-boilerplate/src/containers/home/__tests__/index.spec.js

@@ -0,0 +1,14 @@
+/**
+ * @jest-environment jsdom
+ */
+
+import React from 'react';
+import renderer from 'react-test-renderer';
+import 'jest-styled-components';
+
+import Home from '../';
+
+it('renders <Home /> without throwing', () => {
+  const tree = renderer.create(<Home />).toJSON();
+  expect(tree).toMatchSnapshot();
+});

packages/joyent-boilerplate/src/containers/home/index.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import { LayoutContainer } from '@components/layout';
+
+const Home = () => <LayoutContainer>Welcome</LayoutContainer>;
+
+export default Home;

packages/joyent-boilerplate/src/containers/navigation/__tests__/__snapshots__/header.spec.js.snap

@@ -0,0 +1,140 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders <Header /> without throwing 1`] = `
+.c2 {
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 500;
+  font-size: 1.5rem;
+  text-transform: uppercase;
+  color: ;
+  font-size: 1.8125rem;
+  margin: 0;
+}
+
+.c1 {
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-align-self: stretch;
+  -ms-flex-item-align: stretch;
+  align-self: stretch;
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  padding: 0.9375rem 0;
+}
+
+.c0 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: space-between;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: space-between;
+  justify-content: space-between;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  -webkit-align-items: stretch;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+  background-color: ;
+  max-height: 3.3125rem;
+  min-height: 3.3125rem;
+  padding: 0 1.125rem;
+  line-height: 1.5625rem;
+}
+
+.c3 {
+  border-style: none;
+  width: 5.4375rem;
+  height: 1.5625rem;
+}
+
+<div
+  className="c0"
+>
+  .c1 {
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 500;
+  font-size: 1.5rem;
+  text-transform: uppercase;
+  color: ;
+  font-size: 1.8125rem;
+  margin: 0;
+}
+
+.c0 {
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-align-self: stretch;
+  -ms-flex-item-align: stretch;
+  align-self: stretch;
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  padding: 0.9375rem 0;
+}
+
+.c2 {
+  border-style: none;
+  width: 5.4375rem;
+  height: 1.5625rem;
+}
+
+<div
+    className="c0"
+  >
+    .c0 {
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-weight: 500;
+  font-size: 1.5rem;
+  text-transform: uppercase;
+  color: ;
+  font-size: 1.8125rem;
+  margin: 0;
+}
+
+.c1 {
+  border-style: none;
+  width: 5.4375rem;
+  height: 1.5625rem;
+}
+
+<h2
+      className="c0"
+    >
+      .c0 {
+  border-style: none;
+  width: 5.4375rem;
+  height: 1.5625rem;
+}
+
+<a
+        href="/"
+        onClick={[Function]}
+      >
+        .c0 {
+  border-style: none;
+  width: 5.4375rem;
+  height: 1.5625rem;
+}
+
+<img
+          className="c0"
+          src="test-file-mock"
+        />
+      </a>
+    </h2>
+  </div>
+</div>
+`;

packages/joyent-boilerplate/src/containers/navigation/__tests__/__snapshots__/not-found-hoc.spec.js.snap

@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders <withNotFound /> without throwing 1`] = `<withNotFound />`;

packages/joyent-boilerplate/src/containers/navigation/__tests__/header.spec.js

@@ -0,0 +1,21 @@
+/**
+ * @jest-environment jsdom
+ */
+
+import React from 'react';
+import renderer from 'react-test-renderer';
+import 'jest-styled-components';
+
+import { Router } from '@mocks/';
+import { Header } from '../';
+
+it('renders <Header /> without throwing', () => {
+  const tree = renderer
+    .create(
+      <Router>
+        <Header />
+      </Router>
+    )
+    .toJSON();
+  expect(tree).toMatchSnapshot();
+});

packages/joyent-boilerplate/src/containers/navigation/__tests__/not-found-hoc.spec.js

@@ -0,0 +1,14 @@
+/**
+ * @jest-environment jsdom
+ */
+
+import React from 'react';
+import renderer from 'react-test-renderer';
+import 'jest-styled-components';
+
+import { withNotFound } from '../';
+
+it('renders <withNotFound /> without throwing', () => {
+  const tree = renderer.create(<withNotFound />).toJSON();
+  expect(tree).toMatchSnapshot();
+});

packages/joyent-boilerplate/src/containers/navigation/header.js

@@ -0,0 +1,9 @@
+import React from 'react';
+
+import { Header as HeaderComponent } from '@components/navigation';
+
+export const Header = () => (
+  <HeaderComponent />
+);
+
+export default Header;

packages/joyent-boilerplate/src/containers/navigation/index.js

@@ -0,0 +1,2 @@
+export { default as Header } from './header';
+export { default as withNotFound } from './not-found-hoc';

packages/joyent-boilerplate/src/containers/navigation/not-found-hoc.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { NotFound } from '@components/navigation';
+
+const pathsExample = {
+  title: 'I have no memory of this place',
+  message:
+    'HTTP 404: We can’t find what you are looking for. Next time, always follow your nose.',
+  link: 'Back home',
+  to: '/'
+};
+const NotFoundHOC = (paths = pathsExample) => (
+  <NotFound
+    title={paths.title}
+    message="Sorry, but our princess is in another castle."
+    to={paths.to}
+    link={paths.link}
+  />
+);
+
+export default NotFoundHOC;

packages/joyent-boilerplate/src/graphql/Example.gql

@@ -0,0 +1,11 @@
+query Portal {
+  portal {
+    user {
+      firstName
+    }
+    datacenter {
+      id
+      region
+    }
+  }
+}

packages/joyent-boilerplate/src/index.js

@@ -0,0 +1,5 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import App from './app';
+
+ReactDOM.render(<App />, document.getElementById('root'));

packages/joyent-boilerplate/src/router.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import { BrowserRouter, Route, Switch } from 'react-router-dom';
+import styled from 'styled-components';
+
+import { Header } from '@containers/navigation';
+
+import Home from '@containers/home';
+
+import { NotFound } from '@components/navigation';
+
+const Container = styled.div`
+  display: flex;
+  flex: 1 1 auto;
+  position: relative;
+  flex-flow: column;
+`;
+
+const Router = (
+  <BrowserRouter>
+    <Container>
+      <Route path="/" component={Header} />
+      <Switch>
+        <Route path="/" exact component={Home} />
+        <Route path="/*" component={NotFound} />
+      </Switch>
+    </Container>
+  </BrowserRouter>
+);
+
+export default Router;

packages/joyent-boilerplate/src/state/state.js

@@ -0,0 +1,4 @@
+const state = {}
+
+
+export default state;

packages/joyent-boilerplate/src/state/store.js

@@ -0,0 +1,58 @@
+import { createStore, combineReducers, applyMiddleware, compose } from 'redux';
+import { reducer as formReducer } from 'redux-form';
+import { ApolloClient, createNetworkInterface } from 'react-apollo';
+import state from './state';
+
+const GLOBAL =
+  typeof window === 'object'
+    ? window
+    : {
+        location: {
+          hostname: '0.0.0.0'
+        }
+      };
+
+const GQL_PORT = process.env.REACT_APP_GQL_PORT || 443;
+const GQL_HOSTNAME =
+  process.env.REACT_APP_GQL_HOSTNAME || GLOBAL.location.hostname;
+const GQL_PROTOCOL = process.env.REACT_APP_GQL_PROTOCOL || 'https';
+
+export const client = new ApolloClient({
+  dataIdFromObject: o => {
+    const id = o.id
+      ? o.id
+      : o.slug
+        ? o.slug
+        : o.uuid
+          ? o.uuid
+          : o.timestamp
+            ? o.timestamp
+            : o.name && o.instance
+              ? `${o.name}-${o.instance}`
+              : o.name
+                ? o.name
+                : o.time && o.value
+                  ? `${o.time}-${o.value}`
+                  : 'apollo-cache-key-not-defined';
+    return `${o.__typename}:${id}`;
+  },
+  networkInterface: createNetworkInterface({
+    uri: `${GQL_PROTOCOL}://${GQL_HOSTNAME}:${GQL_PORT}/api/graphql`
+  })
+});
+
+export const store = createStore(
+  combineReducers({
+    apollo: client.reducer(),
+    form: formReducer
+  }),
+  state, // Initial state
+  compose(
+    applyMiddleware(client.middleware()),
+    // If you are using the devToolsExtension, you can add it here also
+    // eslint-disable-next-line no-negated-condition
+    typeof GLOBAL.__REDUX_DEVTOOLS_EXTENSION__ !== 'undefined'
+      ? GLOBAL.__REDUX_DEVTOOLS_EXTENSION__()
+      : f => f
+  )
+);

packages/joyent-boilerplate/test/file-mock.js

@@ -0,0 +1 @@
+module.exports = 'test-file-mock';

packages/joyent-boilerplate/test/mocks/index.js

@@ -0,0 +1,3 @@
+export { default as Router } from './router';
+export { default as Store } from './store';
+export { default as Theme } from './theme';

packages/joyent-boilerplate/test/mocks/router.js

@@ -0,0 +1,4 @@
+import React from 'react';
+import { MemoryRouter } from 'react-router-dom';
+
+export default ({ children }) => <MemoryRouter>{children}</MemoryRouter>;

packages/joyent-boilerplate/test/mocks/store.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import { client, store } from '@state/store';
+import { ApolloProvider } from 'react-apollo';
+
+export default ({ children }) => (
+  <ApolloProvider client={client} store={store}>
+    {children}
+  </ApolloProvider>
+);

packages/joyent-boilerplate/test/mocks/theme.js

@@ -0,0 +1,7 @@
+import React from 'react';
+import { ThemeProvider } from 'styled-components';
+import { theme } from 'joyent-ui-toolkit';
+
+export default ({ children }) => (
+  <ThemeProvider theme={theme}>{children}</ThemeProvider>
+);

packages/joyent-boilerplate/test/run

@@ -0,0 +1,66 @@
+#!/usr/bin/env node
+
+// Do this as the first thing so that any code reading it knows the right env.
+process.env.BABEL_ENV = 'test';
+process.env.NODE_ENV = 'test';
+process.env.PUBLIC_URL = '';
+
+// Makes the script crash on unhandled rejections instead of silently
+// ignoring them. In the future, promise rejections that are not handled will
+// terminate the Node.js process with a non-zero exit code.
+process.on('unhandledRejection', err => {
+  throw err;
+});
+
+// Ensure environment variables are read.
+require('react-scripts/config/env');
+
+const jest = require('jest');
+const argv = process.argv.slice(2);
+
+// This is not necessary after eject because we embed config into package.json.
+const createJestConfig = require('react-scripts/scripts/utils/createJestConfig');
+const path = require('path');
+const paths = require('react-scripts/config/paths');
+
+const config = createJestConfig(
+  relativePath =>
+    path.resolve(
+      __dirname,
+      '../../../node_modules/react-scripts',
+      relativePath
+    ),
+  path.resolve(__dirname, '../../../'),
+  false
+);
+
+// patch
+config.testEnvironment = 'node';
+config.transform = Object.assign(
+  {},
+  {
+    '\\.(gql|graphql)$': 'jest-transform-graphql'
+  },
+  config.transform
+);
+config.testMatch = [
+  '<rootDir>/packages/joyent-boilerplate/src/**/**/__tests__/**/*.js',
+  '<rootDir>/packages/joyent-boilerplate/src/**/**/**/?(*.)(spec|test).js'
+];
+config.moduleNameMapper = Object.assign({}, config.moduleNameMapper, {
+  '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$':
+    '<rootDir>/packages/joyent-boilerplate/test/file-mock.js',
+  '^@root/(.*)$': '<rootDir>/packages/joyent-boilerplate/src/$1',
+  '^@mocks/(.*)$': '<rootDir>/packages/joyent-boilerplate/test/mocks$1',
+  '^@components/(.*)$':
+    '<rootDir>/packages/joyent-boilerplate/src/components/$1',
+  '^@containers/(.*)$':
+    '<rootDir>/packages/joyent-boilerplate/src/containers/$1',
+  '^@graphql/(.*)$': '<rootDir>/packages/joyent-boilerplate/src/graphql/$1',
+  '^@assets/(.*)$': '<rootDir>/packages/joyent-boilerplate/src/assets/$1',
+  '^@state/(.*)$': '<rootDir>/packages/joyent-boilerplate/src/state/$1'
+});
+
+argv.push('--config', JSON.stringify(config));
+
+jest.run(argv);

packages/normalized-styled-components/package.json

@@ -63,13 +63,17 @@
   "jest": {
     "testEnvironment": "jsdom",
     "testRegex": "test/index.js",
-    "setupFiles": ["<rootDir>/../../node_modules/react-scripts/config/polyfills.js"],
+    "setupFiles": [
+      "<rootDir>/../../node_modules/react-scripts/config/polyfills.js"
+    ],
     "testEnvironment": "node",
     "transform": {
       "^.+\\.(js|jsx)$": "<rootDir>/../../node_modules/react-scripts/config/jest/babelTransform.js",
       "^(?!.*\\.(js|jsx|css|json)$)": "<rootDir>/../../node_modules/react-scripts/config/jest/fileTransform.js"
     },
-    "transformIgnorePatterns": ["[/\\\\]node_modules[/\\\\].+\\.(js|jsx)$"],
+    "transformIgnorePatterns": [
+      "[/\\\\]node_modules[/\\\\].+\\.(js|jsx)$"
+    ],
     "rootDir": "."
   }
 }

packages/remcalc/.eslintignore

@@ -1,3 +1,2 @@
 .nyc_output
 coverage
-dist

packages/remcalc/package.json

@@ -3,7 +3,14 @@
   "version": "1.0.8",
   "license": "MPL-2.0",
   "description": "Calculate the `rem`'s from `px` values",
-  "keywords": ["calc", "rem", "em", "px", "pixels", "pixel"],
+  "keywords": [
+    "calc",
+    "rem",
+    "em",
+    "px",
+    "pixels",
+    "pixel"
+  ],
   "repository": "github:yldio/joyent-portal",
   "main": "dist/remcalc.umd.js",
   "jsnext:main": "dist/remcalc.es.js",
@@ -49,13 +56,17 @@
     ],
     "env": {
       "test": {
-        "plugins": ["istanbul"]
+        "plugins": [
+          "istanbul"
+        ]
       }
     }
   },
   "ava": {
     "tap": true,
-    "require": ["babel-register"],
+    "require": [
+      "babel-register"
+    ],
     "babel": "inherit"
   }
 }

packages/rnd-id/.eslintignore

@@ -1,3 +1,2 @@
 .nyc_output
 coverage
-dist

packages/rnd-id/package.json

@@ -3,7 +3,10 @@
   "version": "1.0.8",
   "license": "MPL-2.0",
   "description": "Generate a random alpha string",
-  "keywords": ["random", "alphabetical"],
+  "keywords": [
+    "random",
+    "alphabetical"
+  ],
   "repository": "github:yldio/joyent-portal",
   "main": "dist/rnd-id.umd.js",
   "jsnext:main": "dist/rnd-id.es.js",
@@ -46,13 +49,17 @@
     ],
     "env": {
       "test": {
-        "plugins": ["istanbul"]
+        "plugins": [
+          "istanbul"
+        ]
       }
     }
   },
   "ava": {
     "tap": true,
-    "require": ["babel-register"],
+    "require": [
+      "babel-register"
+    ],
     "babel": "inherit"
   }
 }

packages/styled-is/package.json

@@ -62,13 +62,17 @@
     ],
     "env": {
       "test": {
-        "plugins": ["istanbul"]
+        "plugins": [
+          "istanbul"
+        ]
       }
     }
   },
   "ava": {
     "tap": true,
-    "require": ["babel-register"],
+    "require": [
+      "babel-register"
+    ],
     "babel": "inherit"
   }
 }

packages/ui-toolkit/package.json

@@ -1,6 +1,6 @@
 {
   "name": "joyent-ui-toolkit",
-  "version": "1.2.0",
+  "version": "2.0.0",
   "license": "MPL-2.0",
   "repository": "github:yldio/joyent-portal",
   "main": "dist/umd/index.js",

packages/unitcalc/package.json

@@ -14,23 +14,35 @@
     "unit"
   ],
   "repository": "github:yldio/joyent-portal",
-  "main": "src/index.js",
+  "main": "dist/unitcalc.umd.js",
+  "jsnext:main": "dist/unitcalc.es.js",
+  "module": "dist/unitcalc.es.js",
+  "entry": "src/index.js",
   "scripts": {
-    "lint": "eslint . --fix --format=tap",
+    "lint": "eslint . --fix",
-    "test": "cross-env NODE_ENV=test nyc --reporter=lcov --reporter=text ava"
+    "lint-ci": "eslint . --format junit --output-file $CIRCLE_TEST_REPORTS/lint/unitcalc.xml",
+    "test": "bup && cross-env NODE_ENV=test nyc --reporter=lcov --reporter=text ava",
+    "test-ci": "cross-env NODE_ENV=test nyc --report-dir=$CIRCLE_ARTIFACTS/unitcalc --reporter=lcov --reporter=text ava --tap | tap-xunit > $CIRCLE_TEST_REPORTS/test/unitcalc.xml",
+    "build": "bup",
+    "prepublish": "bup"
   },
   "dependencies": {
     "lodash.flatten": "^4.4.0",
     "remcalc": "^1.0.8"
   },
   "devDependencies": {
-    "ava": "0.19.1",
+    "ava": "^0.22.0",
-    "babel-plugin-istanbul": "^4.1.3",
+    "babel-plugin-istanbul": "^4.1.4",
-    "babel-register": "^6.24.1",
+    "babel-plugin-transform-es2015-arrow-functions": "^6.22.0",
-    "cross-env": "^5.0.0",
+    "babel-plugin-transform-es2015-parameters": "^6.24.1",
-    "eslint": "^3.19.0",
+    "babel-plugin-transform-es2015-spread": "^6.22.0",
-    "eslint-config-joyent-portal": "^1.0.3",
+    "babel-register": "^6.26.0",
-    "nyc": "^10.3.2"
+    "bup": "^1.0.9",
+    "cross-env": "^5.0.5",
+    "eslint": "^4.5.0",
+    "eslint-config-joyent-portal": "3.0.0",
+    "nyc": "^11.1.0",
+    "tap-xunit": "^1.7.0"
   },
   "nyc": {
     "sourceMap": false,
@@ -38,6 +50,11 @@
   },
   "babel": {
     "sourceMaps": "inline",
+    "plugins": [
+      "transform-es2015-parameters",
+      "transform-es2015-arrow-functions",
+      "transform-es2015-spread"
+    ],
     "env": {
       "test": {
         "plugins": [