hippo-fw 0.9.5 → 0.9.6

data/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hippo-fw",
-  "version": "0.9.4",
+  "version": "0.9.5",
   "description": "Hippo is a framework for easily writing single page web applications",
   "main": "client/hippo/index.js",
   "repository": "https://github.com/argosity/hippo",
@@ -10,18 +10,18 @@
     "client"
   ],
   "dependencies": {
-    "actioncable": "^5.1.1",
+    "actioncable": "^5.1.2",
     "babel-core": "^6.25.0",
     "babel-eslint": "^7.2.3",
     "babel-jest": "^20.0.3",
-    "babel-loader": "^7.1.0",
+    "babel-loader": "^7.1.1",
     "babel-plugin-lodash": "^3.2.11",
     "babel-plugin-transform-decorators-legacy": "^1.3.4",
     "babel-plugin-transform-es2015-modules-commonjs": "^6.23.0",
     "babel-plugin-transform-flow-strip-types": "^6.22.0",
     "babel-plugin-transform-function-bind": "^6.22.0",
     "babel-plugin-transform-runtime": "^6.15.0",
-    "babel-preset-env": "^1.5.2",
+    "babel-preset-env": "^1.6.0",
     "babel-preset-es2015-loose": "^8.0.0",
     "babel-preset-jest": "^20.0.3",
     "babel-preset-latest": "^6.16.0",
@@ -30,64 +30,66 @@
     "babel-preset-stage-1": "^6.16.0",
     "big.js": "^3.1.3",
     "classnames": "^2.2.5",
-    "compression-webpack-plugin": "^0.4.0",
+    "compression-webpack-plugin": "^1.0.0",
     "core-decorators": "^0.19.0",
     "create-react-class": "^15.6.0",
     "css-loader": "^0.28.4",
-    "domtastic": "^0.15.0",
-    "enzyme": "^2.9.0",
-    "eslint": "^4.0.0",
-    "eslint-config-argosity": "^1.1.3",
+    "domtastic": "^0.15.1",
+    "enzyme": "^2.9.1",
+    "eslint": "^4.2.0",
+    "eslint-config-argosity": "^1.1.5",
     "file-loader": "^0.11.2",
     "flexboxgrid": "^6.3.1",
-    "grommet": "^1.4.0",
+    "grommet": "^1.5.0",
     "history": "^4.6.3",
     "identity-obj-proxy": "^3.0.0",
     "invariant": "^2.2.2",
     "jest": "^20.0.4",
     "jest-cli": "^20.0.4",
-    "jest-enzyme": "^3.3.0",
-    "jest-fetch-mock": "^1.0.7",
-    "js-yaml": "^3.8.2",
-    "jsdom": "^11.0.0",
+    "jest-enzyme": "^3.6.0",
+    "jest-fetch-mock": "^1.2.0",
+    "js-yaml": "^3.9.0",
+    "jsdom": "^11.1.0",
     "lodash": "^4.17.4",
     "loglevel": "^1.4.1",
-    "mobx": "^3.1.16",
-    "mobx-decorated-models": "^0.5.2",
+    "mobx": "^3.2.1",
+    "mobx-decorated-models": "^0.6.3",
     "mobx-persist": "^0.3.3",
-    "mobx-react": "^4.1.0",
+    "mobx-react": "^4.2.2",
     "node-sass": "^4.5.0",
     "ory-editor": "^0.2.12",
-    "pluralize": "^5.0.0",
+    "pluralize": "^6.0.0",
     "prop-types": "^15.5.8",
-    "qs": "^6.3.0",
+    "qs": "^6.5.0",
     "react": "^15.6.1",
     "react-addons-shallow-compare": "^15.6.0",
     "react-addons-test-utils": "^15.6.0",
     "react-async-component": "^1.0.0-beta.3",
+    "react-braintree-fields": "^0.6.0",
     "react-dom": "^15.6.1",
     "react-dropzone": "^3.13.3",
-    "react-flexbox-grid": "git+https://github.com/nathanstitt/react-flexbox-grid.git#devel",
+    "react-flexbox-grid": "1.1.3",
+    "react-fontawesome": "^1.6.1",
     "react-hot-loader": "3.0.0-beta.6",
-    "react-input-slider": "^1.6.0",
+    "react-input-slider": "^2.0.0",
     "react-motion": "^0.5.0",
     "react-native-storage": "^0.2.2",
-    "react-router": "^4.1.1",
-    "react-router-dom": "^4.1.1",
+    "react-router": "^4.1.2",
+    "react-router-dom": "^4.1.2",
     "react-sidebar": "^2.3.0",
+    "react-tap-event-plugin": "^2.0.1",
     "react-test-renderer": "^15.6.1",
-    "react-tippy": "^0.14.0",
-    "react-virtualized": "^9.8.0",
-    "resolve-url-loader": "^2.0.3",
-    "rsvp": "^3.3.3",
+    "react-tippy": "^1.0.2",
+    "react-virtualized": "^9.9.0",
+    "resolve-url-loader": "^2.1.0",
     "sass-loader": "^6.0.6",
     "sockjs-client": "^1.1.4",
     "sprintf-js": "^1.0.3",
     "style-loader": "^0.18.2",
     "url-loader": "^0.5.9",
-    "validator": "^7.1.0",
-    "webpack": "^3.0.0",
-    "webpack-dev-server": "^2.5.0",
+    "validator": "^8.0.0",
+    "webpack": "^3.3.0",
+    "webpack-dev-server": "^2.5.1",
     "whatwg-fetch": "^2.0.2",
     "when-dom-ready": "^1.2.4"
   }

data/spec/client/access/login-dialog.spec.jsx

@@ -1,12 +1,11 @@
-jest.mock('hippo/models/sync');
-jest.mock('hippo/config');
-
-import React  from 'react';
-
+import React from 'react'; // eslint-disable-line no-unused-vars
 import User        from 'hippo/user';
 import Config      from 'hippo/config';
 import LoginDialog from 'hippo/access/login-dialog';
 
+jest.mock('hippo/models/sync');
+jest.mock('hippo/config');
+
 describe('Login Dialog', () => {
     beforeEach(() => (Config.access_token = '0123456789'));
     afterEach(() => (Config.access_token = ''));

data/spec/client/components/__snapshots__/query-builder.spec.jsx.snap

@@ -66,8 +66,8 @@ exports[`Query Builder Component renders and matches snapshot 1`] = `
       autoFocus={true}
       className="grommetux-text-input grommetux-input"
       defaultValue={undefined}
-      onChange={[Function]}
       onFocus={[Function]}
+      onInput={[Function]}
       onKeyDown={[Function]}
       placeholder={undefined}
       style={

data/spec/client/components/__snapshots__/record-finder.spec.jsx.snap

@@ -0,0 +1,72 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`RecordFinder Component renders 1`] = `
+<div
+  className="form-field record-finder"
+>
+  <div
+    className="grommetux-form-field grommetux-form-field--size-medium"
+    onClick={[Function]}
+  >
+    <label
+      className="grommetux-form-field__label"
+      htmlFor={undefined}
+    >
+      Name
+    </label>
+    <span
+      className="grommetux-form-field__contents"
+    >
+      <input
+        autoComplete="off"
+        autoFocus={undefined}
+        className="grommetux-text-input grommetux-input"
+        defaultValue={undefined}
+        name="name"
+        onBlur={[Function]}
+        onChange={[Function]}
+        onFocus={[Function]}
+        onInput={[Function]}
+        onKeyDown={[Function]}
+        onKeyPress={[Function]}
+        placeholder={undefined}
+        type="text"
+        value=""
+      />
+      <button
+        aria-label={undefined}
+        className="grommetux-button grommetux-button--plain grommetux-control-icon-search"
+        disabled={false}
+        href={undefined}
+        onBlur={[Function]}
+        onClick={[Function]}
+        onFocus={[Function]}
+        onMouseDown={[Function]}
+        onMouseUp={[Function]}
+        type="button"
+      >
+        <span
+          className="grommetux-button__icon"
+        >
+          <svg
+            aria-label="search"
+            className="grommetux-control-icon grommetux-control-icon-search grommetux-control-icon--responsive"
+            height="24px"
+            role="img"
+            version="1.1"
+            viewBox="0 0 24 24"
+            width="24px"
+          >
+            <path
+              d="M15,15 L22,22 L15,15 Z M9.5,17 C13.6421356,17 17,13.6421356 17,9.5 C17,5.35786438 13.6421356,2 9.5,2 C5.35786438,2 2,5.35786438 2,9.5 C2,13.6421356 5.35786438,17 9.5,17 Z"
+              fill="none"
+              stroke="#000"
+              strokeWidth="2"
+            />
+          </svg>
+        </span>
+      </button>
+    </span>
+  </div>
+</div>
+`;

data/spec/client/components/asset.spec.jsx

@@ -1,12 +1,8 @@
-import React from 'react';
-
-import { Col } from 'react-flexbox-grid';
+import React from 'react'; // eslint-disable-line no-unused-vars
 import Asset from 'hippo/components/asset';
-
 import { TestImage } from '../test-models';
-import { Snapshot } from 'hippo/testing/screens';
 
-describe("Asset Component", () => {
+describe('Asset Component', () => {
     it('renders', () => {
         const image = new TestImage();
         const asset = mount(<Asset model={image} name="asset" />);

data/spec/client/components/data-list.spec.jsx

@@ -1,16 +1,12 @@
-import React from 'react';
+import React from 'react'; // eslint-disable-line no-unused-vars
 import { range } from 'lodash';
-
 import Query     from 'hippo/models/query';
-
 import DataList from 'hippo/components/data-list';
-
 import { Container } from '../test-models';
-import { Snapshot } from 'hippo/testing/screens';
 
 jest.mock('hippo/models/sync');
 
-describe("DataList Component", () => {
+describe('DataList Component', () => {
     let query;
 
     beforeEach(() => {

data/spec/client/components/data-table.spec.jsx

@@ -1,16 +1,14 @@
-import React from 'react';
-import { first, map, find, range } from 'lodash';
+import React from 'react'; // eslint-disable-line no-unused-vars
+import { range } from 'lodash';
 import { autorun } from 'mobx';
-import Sync from 'hippo/models/sync';
 import Query     from 'hippo/models/query';
-
 import DataTable from 'hippo/components/data-table';
 
 import { Container } from '../test-models';
 
 jest.mock('hippo/models/sync');
 
-describe("DataTable Component", () => {
+describe('DataTable Component', () => {
     let query;
 
     beforeEach(() => {

data/spec/client/components/date-time.spec.jsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React from 'react'; // eslint-disable-line no-unused-vars
 import DateTime from 'hippo/components/date-time/date-time-drop';
 import moment from 'moment';
 

data/spec/client/components/form.spec.jsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React from 'react'; // eslint-disable-line no-unused-vars
 import {
     nonBlank, validEmail, hasLength, validURL, FormState,
 } from 'hippo/components/form';
@@ -10,7 +10,7 @@ describe('Form Validation functions', () => {
             email: { validate: validEmail },
             name:  { validate: hasLength({ length: 3 }) },
         });
-        expect(form.get('email.isValid')).toBe(false);
+        expect(form.get('email').isValid).toBe(false);
         expect(form.isValid).toBe(false);
         expect(form.isTouched).toBe(false);
 

data/spec/client/components/master-detail.spec.jsx

@@ -1,5 +1,4 @@
-import React from 'react';
-
+import React from 'react'; // eslint-disable-line no-unused-vars
 import { Snapshot } from 'hippo/testing/screens';
 import MasterDetail from 'hippo/components/master-detail';
 

data/spec/client/components/network-activity-overlay.spec.jsx

@@ -1,8 +1,7 @@
-import React from 'react';
-
+import React from 'react'; // eslint-disable-line no-unused-vars
+import { Snapshot } from 'hippo/testing/screens';
 import NetworkActivityOverlay from 'hippo/components/network-activity-overlay';
 import { Box } from '../test-models';
-import { Snapshot } from 'hippo/testing/screens';
 
 jest.useFakeTimers();
 

data/spec/client/components/query-builder.spec.jsx

@@ -1,15 +1,12 @@
-import React from 'react';
-
+import React from 'react'; // eslint-disable-line no-unused-vars
 import QueryBuilder from 'hippo/components/query-builder';
-
-import { Box } from '../test-models';
 import { Snapshot } from 'hippo/testing/screens';
 import Query from 'hippo/models/query';
+import { Box } from '../test-models';
 
 jest.useFakeTimers();
 
-describe("Query Builder Component", () => {
-
+describe('Query Builder Component', () => {
     let query;
 
     beforeEach(() => {

data/spec/client/components/record-finder.spec.jsx

@@ -1,17 +1,16 @@
-import React from 'react';
+import React from 'react'; // eslint-disable-line no-unused-vars
 import { range } from 'lodash';
 
 import Query     from 'hippo/models/query';
 
 import { Snapshot } from 'hippo/testing/screens';
 import RecordFinder from 'hippo/components/record-finder';
-
+import { FormState } from 'hippo/components/form';
 import { Container } from '../test-models';
 
 jest.mock('hippo/models/sync');
-import { FormState, stringValue } from 'hippo/components/form';
 
-describe("RecordFinder Component", () => {
+describe('RecordFinder Component', () => {
     let query;
     let props;
     let formState;
@@ -44,5 +43,6 @@ describe("RecordFinder Component", () => {
             <RecordFinder {...props} />,
         );
         expect(finder).toHaveRendered('TextInput');
+        expect(Snapshot(<RecordFinder {...props} />)).toMatchSnapshot();
     });
 });

data/spec/client/models/pub_sub.spec.js

@@ -1,15 +1,17 @@
 import { onBoot, observePubSub } from 'hippo/models/pub_sub';
 import PubSubChannel from 'hippo/models/pub_sub/channel';
-
+import Config from 'hippo/config';
 import { Ship, Container } from '../test-models';
 
 jest.mock('hippo/user', () => ({
     isLoggedIn: true,
 }));
 jest.mock('hippo/models/pub_sub/channel');
+jest.mock('hippo/config');
 
 describe('PubSub', () => {
     it('watches and checks in and out', () => {
+        Config.api_host = 'testing';
         const ship = new Ship();
         const container = new Container({ id: '2' });
         onBoot();

data/spec/client/models/query.spec.js

@@ -1,7 +1,5 @@
 import Sync from 'hippo/models/sync';
 import { map, find, range, shuffle } from 'lodash';
-
-import Clause from 'hippo/models/query/clause';
 import Query  from 'hippo/models/query';
 import { Box } from '../test-models';
 
@@ -42,12 +40,9 @@ describe('Model Queries', () => {
     });
 
     it('calculates fields', () => {
-        const q = new Query({ src: Box });
-        expect(q.src).toEqual(Box);
-        expect(q.clauses).toHaveLength(1);
-        const clause = q.clauses[0];
-        expect(clause).toBeInstanceOf(Clause);
-        expect(clause.query).toBe(q);
+        expect(query.clauses).toHaveLength(1);
+        expect(query.clauses[0].field).toBe(query.fields[1]);
+        expect(query.clauses[0].operator.id).toBe('like');
     });
 
     it('calculates min width', () => {
@@ -78,7 +73,7 @@ describe('Model Queries', () => {
         const clause = query.clauses[0];
         expect(clause.field.id).toEqual('computed');
         expect(clause.operator.id).toEqual('like');
-        expect(map(clause.validOperators, 'id')).toEqual(['like', 'eq']);
+        expect(map(clause.validOperators, 'id')).toEqual(['like', 'eq', 'contains']);
         clause.field = query.fields[3];
         expect(clause.operator.id).toEqual('eq');
         expect(map(clause.validOperators, 'id')).toEqual(['eq', 'lt', 'gt']);

data/spec/client/screens/system-settings-tenants.spec.jsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React from 'react'; // eslint-disable-line no-unused-vars
 
 import TenantModel from 'hippo/models/tenant';
 import Tenant from 'hippo/screens/system-settings/tenant';

data/spec/client/screens/system-settings.spec.jsx

@@ -1,7 +1,4 @@
-import React from 'react';
-
-import { Snapshot } from 'hippo/testing/screens';
-
+import React from 'react'; // eslint-disable-line no-unused-vars
 import Settings from 'hippo/screens/system-settings';
 import Instance from 'hippo/screens/instance';
 import { getTestScreen } from '../test-models';

data/spec/client/workspace/__snapshots__/menu.spec.jsx.snap

@@ -29,10 +29,9 @@ exports[`Workspace Menu has groups with screens 1`] = `
         className="grommetux-heading grommetux-heading--strong"
       >
         Settings
-        <i
-          className="icon icon-wrench"
-          onClick={undefined}
-          style={undefined}
+        <span
+          aria-hidden={true}
+          className="fa fa-wrench"
         />
       </h4>
     </header>
@@ -44,10 +43,9 @@ exports[`Workspace Menu has groups with screens 1`] = `
     onClick={[Function]}
   >
     User Management
-    <i
-      className="icon icon-group"
-      onClick={undefined}
-      style={undefined}
+    <span
+      aria-hidden={true}
+      className="fa fa-group"
     />
   </a>
   <a
@@ -57,10 +55,9 @@ exports[`Workspace Menu has groups with screens 1`] = `
     onClick={[Function]}
   >
     System Settings
-    <i
-      className="icon icon-cogs"
-      onClick={undefined}
-      style={undefined}
+    <span
+      aria-hidden={true}
+      className="fa fa-cogs"
     />
   </a>
   <a
@@ -70,10 +67,9 @@ exports[`Workspace Menu has groups with screens 1`] = `
     onClick={[Function]}
   >
     title
-    <i
-      className="icon icon-red"
-      onClick={undefined}
-      style={undefined}
+    <span
+      aria-hidden={true}
+      className="fa fa-red"
     />
   </a>
 </nav>
@@ -87,10 +83,9 @@ exports[`Workspace Menu has renders menu options 1`] = `
   onClick={[Function]}
 >
   title
-  <i
-    className="icon icon-red"
-    onClick={undefined}
-    style={undefined}
+  <span
+    aria-hidden={true}
+    className="fa fa-red"
   />
 </a>
 `;