Guide to create a reducer that is connected to the nRFConnectCore store in the boilerplate?

[Edvard Gjessing Bakken]

Reffering to the boilerplate: NordicSemiconductor/pc-nrfconnect-boilerplate

Can someone make a quick guide to create a reducer that is connected to the nRFConnectCore[0] store in the boilerplate? Just the minimal necessities.

If this question is wrong because the modules dispatched actions is not ment to update the state of the store in nRF core, but a local store in the module ( like ble or RSSI), please say so.

I'm trying to build a new module based on the boilerplate, but i can't find the place where the module/boilerplate reducers are imported and combined into a rootReducer to create the store. (the index.js combines and exports yes, but where is the import of this export??)

In nRF core there is a function decorateReducer [1] which contains the command:

    const appReducerFn = app[method]; // i think this is selecting the exported rootReducer from the app?

The app variable is defined in the function loadModule [2] with the command:

    window.require(modulePath); //imports all the javascript files in the path. Right?[3]

These variables is imported and creates a store i the nRF Connect core. 

Maybe it is something i'm missing, but this does not explain things for me. Where is the import of the exportet rootReducer in the module? 

:)

[0] github.com/.../pc-nrfconnect-core
[1] github.com/.../apps.js
[2] github.com/.../fileUtil.js
[3] http://requirejs.org/

[Magne Rodem]

Hi Edvard,

The API reference gives some information and examples on how to create reducers in nRF Connect apps: https://github.com/NordicSemiconductor/pc-nrfconnect-core/wiki/API-reference#adding-information-to-state 

The state in nRF Connect for desktop is structured like this:

{
  core: {
    ...
  },
  app: {
    ...
  },
}

The state below `state.core` is managed by the core framework. Here you will find state related to logging, navigation, serial ports, etc. that is common for all apps. The state below `state.app`, however, is managed by the app. If you implement a `reduceApp` function in your app's index.jsx as described in the API reference, then you should be able to add some custom state in your app.

You were asking specifically about the root reducer. That can be found here: github.com/.../index.js. If you follow the reducer tree from here, then you will see what information can be found in `state.core`, and how `state.app` is implemented.

Also, you may know this already, but if you build pc-nrfconnect-core in development mode (`npm run dev`), and open the development console(Ctrl+Shift+I) when you have the app running, you will see a log of all actions that are dispatched and how they affect the state.

I hope this cleared things up a bit. Feel free to contact me if you have further questions.

[Edvard Gjessing Bakken]

Hi Magne,

Thanks for the response. It enlightened many aspects!

Like you said, it was all in the export of reduceApp in index.jsx

The problem i had was that i had two reduceApp functions in the export, because i did not notice the boilerplate came with an allready made reduceApp function so i made my own. The program has for many days now exported an empty reducer which did nothing, twisting my brain for why not my self made reduceApp function did not work.

Have a nice day!