Merge pull request LucasBassetti#117 from Cyclodex/allowMetadataInStepsProps

Allowing metadata to appear in the props.steps

Author: LucasBassetti

lib/ChatBot.jsx

@@ -193,8 +193,8 @@ class ChatBot extends Component {
     const steps = {};
 
     for (let i = 0, len = previousSteps.length; i < len; i += 1) {
-      const { id, message, value } = previousSteps[i];
-      steps[id] = { id, message, value };
+      const { id, message, value, metadata } = previousSteps[i];
+      steps[id] = { id, message, value, metadata };
     }
 
     return steps;
@@ -307,15 +307,15 @@ class ChatBot extends Component {
       const { previousSteps } = this.state;
 
       const renderedSteps = previousSteps.map((step) => {
-        const { id, message, value } = step;
-        return { id, message, value };
+        const { id, message, value, metadata } = step;
+        return { id, message, value, metadata };
       });
 
       const steps = [];
 
       for (let i = 0, len = previousSteps.length; i < len; i += 1) {
-        const { id, message, value } = previousSteps[i];
-        steps[id] = { id, message, value };
+        const { id, message, value, metadata } = previousSteps[i];
+        steps[id] = { id, message, value, metadata };
       }
 
       const values = previousSteps.filter(step => step.value).map(step => step.value);

tests/lib/ChatBot.spec.js

@@ -8,7 +8,7 @@ import FloatButton from '../../lib/FloatButton';
 import Header from '../../lib/Header';
 import HeaderIcon from '../../lib/HeaderIcon';
 import { CloseIcon } from '../../lib/icons';
-// import { TextStep, OptionsStep, CustomStep } from '../../lib/steps';
+import { TextStep, OptionsStep, CustomStep } from '../../lib/steps';
 
 const CustomComponent = () => (
   <div />
@@ -289,4 +289,50 @@ describe('ChatBot', () => {
       expect(wrapper.find('input.rsc-input')).to.have.length(0);
     });
   });
+
+  describe('Metadata', () => {
+    const wrapper = mount(
+      <ChatBot
+        botDelay={0}
+        steps={[
+          {
+            id: '1',
+            message: 'Set metadata!',
+            metadata: {
+              custom: 'Hello World',
+            },
+            trigger: '2',
+          },
+          {
+            id: '2',
+            message: params => (params.steps[1].metadata.custom),
+            end: true,
+          },
+        ]}
+      />,
+    );
+
+    before(() => {
+      // Somehow it needs something like this, to wait for the application to be rendered.
+      // TODO: improve this...
+      wrapper.simulate('keyPress', { key: 'Enter' });
+    });
+
+    after(() => {
+      wrapper.unmount();
+    });
+
+    it('should be accessible in "steps" and "previousStep"', () => {
+      const bubbles = wrapper.find(TextStep);
+      const step2Bubble = bubbles.at(1);
+      expect(step2Bubble.props().previousStep.metadata.custom).to.be.equal('Hello World');
+      expect(step2Bubble.props().steps[1].metadata.custom).to.be.equal('Hello World');
+    });
+
+    it('should render in second bubble', () => {
+      const bubbles = wrapper.find(TextStep);
+      const step2Bubble = bubbles.at(1);
+      expect(step2Bubble.text()).to.be.equal('Hello World');
+    });
+  });
 });