How can I persist nested redux store

Question

I want to persist nested object of my redux store. I tried https://github.com/rt2zz/redux-persist package but it doesn't work in my case. I wonder if it's possible to define a whitelist like this: 'user.statuses.verification.isDone'

This is my store:

{
    user: {
        statuses: {
            verification: { isPending: true, isDone: false },
            activation: { isPending: true, isDone: false },
            set1: { isPending: true, isDone: false, refNumber: xxx },
            set2: { isPending: true, isDone: false, refNumber: xxx },
        },
    },
}

I want to persist only "isDone" in every of statuses and "refNumber". Can anyone help me?

I already tried nested persist as described in redux persist documentation https://github.com/rt2zz/redux-persist#nested-persists but looks like it has a limitation to 2 levels.

whenever you are making change in state at the end JSON.stringify() it and push it in the localStorage with some key and whenever you are retrieving it use the same key and use JSON.parse() to convert it back to the object, hence the object will persist — Chirag Kushwaha, Apr 02 '22 at 09:01

score 2 · Accepted Answer · edited Apr 03 '22 at 13:10

I tried this https://stackoverflow.com/a/71616665 and it works perfectly.  In this example you can see the blacklist but you just need to replace it with the whitelist.

const config = getPersistConfig({
    key: 'root',
    storage: AsyncStorage,
    whitelist: [
        'user.statuses.verification.isDone’,  
        'user.statuses.activation.isDone’,  
        'user.statuses.set1.isDone’,
        'user.statuses.set1.refNumber’,
        'user.statuses.set2.isDone’,
        'user.statuses.set2.refNumber’,
    ],
    rootReducer, // your root reducer must be also passed here
    ... // any other props from the original redux-persist config omitting the stateReconciler
})

score 0 · Answer 2 · answered Apr 02 '22 at 13:54

You need to use this package: https://github.com/edy/redux-persist-transform-filter

The "issue" has already been addressed, it's more a precise implementation choice, not an issue according to the maintainers, and you have several different ways to address it:

redux-persist - how do you blacklist/whitelist nested state

How can I persist nested redux store

2 Answers2