Support for dataProp

Author: bhunjadi

__tests__/components/containers/PostItemReactiveWithDataProp.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import {withQuery} from 'meteor/cultofcoders:grapher-react';
+import {postsList} from '../../bootstrap/namedQueries';
+import PostWithDataProp from '../dumb/PostWithDataProp';
+
+export default withQuery(() => {
+    return postsList.clone()
+}, {
+    single: true,
+    reactive: true,
+    dataProp: 'post',
+})(PostWithDataProp);

__tests__/components/containers/PostItemWithDataProp.jsx

@@ -0,0 +1,11 @@
+import React from 'react';
+import {withQuery} from 'meteor/cultofcoders:grapher-react';
+import {postsList} from '../../bootstrap/namedQueries';
+import PostWithDataProp from '../dumb/PostWithDataProp';
+
+export default withQuery(() => {
+    return postsList.clone()
+}, {
+    single: true,
+    dataProp: 'post',
+})(PostWithDataProp);

__tests__/components/dumb/PostWithDataProp.jsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import Loading from './Loading';
+import Error from './Error';
+
+const PostWithDataProp = ({post, isLoading, error}) => {
+    if (isLoading) {
+        return <Loading />;
+    }
+
+    if (error) {
+        return <Error error={error} />;
+    }
+
+    return <div className="title">{post.title}</div>
+};
+
+export default PostWithDataProp;

__tests__/main.client.js

@@ -9,11 +9,14 @@ import {withQuery} from 'meteor/cultofcoders:grapher-react';
 import {expect} from 'chai';
 
 import PostItemContainer from './components/containers/PostItem';
+import PostItemWithDataPropContainer from './components/containers/PostItemWithDataProp';
+import PostItemReactiveWithDataPropContainer from './components/containers/PostItemReactiveWithDataProp';
 import PostItemPollingContainer from './components/containers/PostItemPolling';
 import PostItemReactiveContainer from './components/containers/PostItemReactive';
 import PostItemErrorContainer from './components/containers/PostItemError';
 import PostItemReactiveErrorContainer from './components/containers/PostItemReactiveError';
 import Post from './components/dumb/Post';
+import PostWithDataProp from './components/dumb/PostWithDataProp';
 import Loading from './components/dumb/Loading';
 import Error from './components/dumb/Error';
 
@@ -48,6 +51,37 @@ describe('withTracker()', function () {
         }, 100)
     });
 
+    it('[Static] Should work with dataProp', function (done) {
+        const wrapper = mount(<PostItemWithDataPropContainer />);
+        let loadingComponent = wrapper.html();
+
+        expect(wrapper.find('PostWithDataProp').length).to.equal(1);
+        expect(wrapper.find('Loading').length).to.equal(1);
+
+        setTimeout(function () {
+            let html = wrapper.html();
+            expect(html).to.equal('<div class="title">Post 0</div>');
+
+            done();
+        }, 100)
+    });
+
+    it('[Reactive] Should work with dataProp', function (done) {
+        const wrapper = mount(<PostItemReactiveWithDataPropContainer />);
+        let loadingComponent = wrapper.html();
+
+        // expect(wrapper.find('PostWithDataProp').length).to.equal(1);
+        // expect(wrapper.find('Loading').length).to.equal(1);
+
+        setTimeout(function () {
+            wrapper.update();
+
+            let html = wrapper.html();
+            expect(html).to.equal('<div class="title">Post 0</div>');
+
+            done();
+        }, 100)
+    });
 
     it('[Reactive] Should load the date after mounting', function (done) {
         const wrapper = mount(<PostItemReactiveContainer />);
@@ -118,4 +152,4 @@ describe('withTracker()', function () {
             }, 200);
         }, 100);
     });
-});
+});

defaults.js

@@ -1,4 +1,5 @@
 export default {
     reactive: false,
     single: false,
-}
+    dataProp: 'data',
+}

lib/checkOptions.js

@@ -8,9 +8,10 @@ export default function (options) {
         pollingMs: Match.Maybe(Number),
         errorComponent: Match.Maybe(React.Component),
         loadingComponent: Match.Maybe(React.Component),
+        dataProp: Match.Maybe(String),
     });
 
     if (options.reactive && options.poll) {
        throw new Meteor.Error(`You cannot have a query that is reactive and it is with polling`)
     }
-}
+}

lib/withQueryContainer.js

@@ -39,7 +39,7 @@ export default function withQueryContainer(WrappedComponent) {
             ...props,
             isLoading: error ? false : isLoading,
             error,
-            data: config.single ? data[0] : data,
+            [config.dataProp]: config.single ? data[0] : data,
             query
         })
     };