Listening to Redux Store Polymer 2.0

Question

I am developing an app in Polymer 2 and am testing out how redux might work with it for controlling data flow. I have been following some simple examples and am trying to produce a proof of concept where I am able to move some data from one html to another using a redux store.

I am running the following function when a button is pressed in an html file:

savePackage() {
  const payload = {"Package Name" : "Integrations", "Description" : "A package for the integrations team"};
  this.dispatch('add', payload);
}

This function then dispatches an action to my redux-store.html where I am able to confirm I can see the object with a console.log.

Within my redux-store.html I am then running the following code:

const reducer = (state, action) => {
  switch (action.type) {
    case 'UPDATE_PACKAGE':
      const payload = action.newdata;
      console.log(payload);
      return Object.assign({}, state, { payload });
  }
};

const store = Redux.createStore(reducer);
const ReduxMixin = PolymerRedux(store);

From what I understand (by reading online) I should be able to access this array from another html file I have called data-model.html. The script block within this file looks like this:

class DataModel extends ReduxMixin(Polymer.Element) {
      static get is() { return 'data-model'; }
      static get properties() {
        return {
          payload: {
            type: Array,
            statepath: 'payload'
          }
        };
      }
    }

    customElements.define(DataModel.is, DataModel);

Inside the template tags within this file I have the following code:

<h1>data model [[payload]]</h1>

I believe this should be displaying the array from the first html file however it just displays "data model". I have tried to console.log this in the data-model.html however it seems redux is not pulling any data from the redux store.

I have checked all my import paths and checked for typos but I am unable to work out why this is not working. Any advice is appreciated.

Answer 1

The fix for this was a trivial one (I suspected it might be). Needed a capital P on statePath!

Thanks for all help with this anyway