Merge pull request #368 from codaco/feature/quick-add-namegen

implement quick add property in name gen editor

config/webpack.config.js

@@ -255,7 +255,9 @@ module.exports = {
       // It is guaranteed to exist because we tweak it in `env.js`
       process.env.NODE_PATH.split(path.delimiter).filter(Boolean),
     ),
-    alias: {},
+    alias: {
+      concaveman: path.join(paths.appSrc, 'utils', 'webShims', 'concavemock.js'),
+    },
     plugins: [
       // Prevents users from importing files from outside of src/ (or node_modules/).
       // This often causes confusion because we only process files within src/ with babel.

src/components/StageEditor/Interfaces/NameGenerator.js

@@ -1,7 +1,7 @@
 import {
   Name,
   NodeType,
-  Form,
+  FormWithQuickAdd,
   NameGeneratorPrompts,
   NodePanels,
 } from '../sections';
@@ -10,7 +10,7 @@ const NameGenerator = {
   sections: [
     Name,
     NodeType,
-    Form,
+    FormWithQuickAdd,
     NameGeneratorPrompts,
     NodePanels,
   ],

src/components/StageEditor/sections/FormWithQuickAdd.js

@@ -0,0 +1,58 @@
+import React, { PureComponent } from 'react';
+import { connect } from 'react-redux';
+import { compose } from 'recompose';
+import cx from 'classnames';
+import { Field, formValueSelector } from 'redux-form';
+import Guidance from '../../Guidance';
+import { Toggle } from '../../../ui/components/Fields';
+import Form from './Form';
+
+class FormWithQuickAdd extends PureComponent {
+  render() {
+    const {
+      quickAdd,
+      disabled,
+    } = this.props;
+
+    const formClasses = cx(
+      'stage-editor-section',
+      { 'stage-editor-section--disabled': disabled },
+    );
+
+    return (
+      <div>
+        <Guidance contentId="guidance.editor.quickAdd">
+          <div className={formClasses}>
+            <h2 id="issue-form">Quick Add</h2>
+            <p>Should this stage use the quick add function?</p>
+            <div className="stage-editor-section-form">
+              <Field
+                name="quickAdd"
+                component={Toggle}
+                label="Enable the quick add function"
+              />
+            </div>
+          </div>
+        </Guidance>
+        { !quickAdd && <Form {...this.props} /> }
+      </div>
+    );
+  }
+}
+
+const mapStateToProps = (state, { form }) => {
+  const selector = formValueSelector(form.name);
+  const quickAdd = selector(state, 'quickAdd');
+  const nodeType = selector(state, 'subject.type');
+
+  return {
+    quickAdd,
+    disabled: !nodeType,
+  };
+};
+
+export { FormWithQuickAdd };
+
+export default compose(
+  connect(mapStateToProps),
+)(FormWithQuickAdd);

src/components/StageEditor/sections/index.js

@@ -3,6 +3,7 @@ export { default as Title } from './Title';
 export { default as Name } from './Name';
 export { default as NodeType } from './NodeType';
 export { default as Form } from './Form';
+export { default as FormWithQuickAdd } from './FormWithQuickAdd';
 export { default as NameGeneratorPrompts } from './NameGeneratorPrompts';
 export { default as NameGeneratorListPrompts } from './NameGeneratorListPrompts';
 export { default as NameGeneratorAutoCompletePrompts } from './NameGeneratorAutoCompletePrompts';

src/locales/en-US.js

@@ -60,6 +60,20 @@ export default {
       </p>
     </Fragment>
   ),
+  'guidance.editor.quickAdd': (
+    <Fragment>
+      <h3>The Quick Add function</h3>
+      <p>Using the quick add function allowa your participants to create a node by simply
+        entering a display label for it and pressing the enter key. The quick add form does not
+        obscure the node list, and will stay open and focused while the participant types,
+        providing an ideal environment for quickly listing off names.
+      </p>
+      <p>This function bypasses the new node form, and no other node attribute data collection is
+        possible at the time the node is created (although it can of course be collected in future
+        stages).
+      </p>
+    </Fragment>
+  ),
   'guidance.editor.form': (
     <Fragment>
       <h3>Choosing a Form</h3>

src/utils/webShims/concavemock.js

@@ -0,0 +1,2 @@
+// Temporary workaround until unsafe-eval issue is resolved
+module.exports = () => {};

src/utils/webShims/mockProtocol.json

@@ -473,35 +473,6 @@
         "entity": "node",
         "type": "d39a47507bbe27c2a7948861847f3607eda8e1be"
       },
-      "skipLogic": {
-        "action": "SHOW",
-        "operator": "EXACTLY",
-        "value": "3",
-        "filter": {
-          "join": "OR",
-          "rules": [
-            {
-              "type": "alter",
-              "id": "15218241538622",
-              "options": {
-                "type": "d39a47507bbe27c2a7948861847f3607eda8e1be",
-                "attribute": "6ae999552a0d2dca14d62e2bc8b764d377b1dd6c",
-                "operator": "EXACTLY",
-                "value": "Dee"
-              }
-            },
-            {
-              "type": "ego",
-              "id": "15218241553253",
-              "options": {
-                "attribute": "6ae999552a0d2dca14d62e2bc8b764d377b1dd6c",
-                "operator": "EXACTLY",
-                "value": "Bob"
-              }
-            }
-          ]
-        }
-      },
       "panels": [
         {
           "title": "Already mentioned",