Promise in context.dispatch

[bringking]

I am not sure if this is a fluxible thing or a React issue, but on my initial server-rendered view, if I have a synchronous method in the action, the data propagates to the store and gets de-hyrdated-

'use strict';
var debug = require('debug')('koaReact:loadPageAction');

module.exports = function( context, payload, done ) {
    context.dispatch('LOAD_CAMPAIGNS_START');
    context.dispatch('LOAD_CAMPAIGNS', [{name:"test"}]);
    context.dispatch('LOAD_CAMPAIGNS_END');
    done();
};

However, if I use a function that returns a promise, then the data never gets propagated and then de-hyrdated into the state.

'use strict';
var debug = require('debug')('koaReact:loadPageAction');
var campaignsDal = require("../services/campaigns");

module.exports = function( context, payload, done ) {
    context.dispatch('LOAD_CAMPAIGNS_START');
    campaignsDal.query({}).then(function( result ) {
        context.dispatch('LOAD_CAMPAIGNS', result.toJSON());
        context.dispatch('LOAD_CAMPAIGNS_END');
        done();
    });
};

Is this a problem because of the promise? I am using Koa.js, so I am not sure if the promise is causing the view to be served before the promise is resolved?

[gpbl]

Are you using fetchr with the fetchr plugin to register your services?

[bringking]

No, I am just trying to use a generic service that returns a promise.

[gpbl]

If the server does send a response, but with an empty state, it may be a problem with the contexts you are using. If it doesn't send any response, I'd check why the done() function is never called (something should tell the router "ok I'm done, now serve the response").

I've been fighting with both cases until I got how fluxible works. Trying to isolate the problem did help a lot!

[bringking]

I figured it out. Basically I was using the flux-routr plugin and firing off my route dependent actions to load the initial data-

 campaigns: {
        path: '/campaigns',
        method: 'get',
        page: 'campaigns',
        label: 'Campaigns',
        action: function( context, payload, done ) {
            loadCampaigns(context,payload,done);
            done();
        }
    },

But I was calling done instead of letting loadCampaigns call done(). Therefore, the action was immediately returning and react was rendering the view assuming no changes were emitted.

 campaigns: {
        path: '/campaigns',
        method: 'get',
        page: 'campaigns',
        label: 'Campaigns',
        action: function( context, payload, done ) {
            loadCampaigns(context,payload,done);
        }
    },

Removing the done() fixed the problem.