Component not rerendering when passing store manually to components

[clydeespeno]

Hi Guys,

I posted this question on stackoverflow.

https://stackoverflow.com/questions/45874911/component-not-rerendering-when-passing-store-manually-to-components-react-redux

Basically, I am having an issue where my components are connected initially but, I don't get the subsequence updates despite ensuring that states are immutable.

I am writing an application that dynamically renders react components from json definitions. The renderer component has its own store, and the dynamically generated component tree is from another store. I did not use Provider for the 2nd one. I am passing them manually as seen from the question above.

I can give more context if needed. Thanks for any advice/help!

[markerikson]

This is a bug tracker, not a support system. Stack Overflow is definitely the right place to ask this question.

That said, it looks like you're re-running connect() every time you re-render the parent component, which will generate a different component class every time. Don't do that - you need to maintain the same component class, otherwise React will throw away the old component instance when you re-render because it thinks they're different types.

[clydeespeno]

thanks @markerikson for the reply. Sorry about posting it here. I actually can't understand whether it's a usability issue or a bug on react-redux (I'm still leaning more towards it being a usability issue). I can confirm that connect is never called again when the parent component rerenders.

From what I see

return (props) => {
        const ConnectedData = connect(mapStateToProps(schema))(DataComponent)
        return (
            <ConnectedData {...props}
                           store={store}/>)
    }

is called only once for each dynamically created Component. Meaning, there are no new Component classes created (at least all the debug step and console logs doesn't show Components are reacreated). Thanks for the insight though. At least I did check a potential issue there.

[markerikson]

Hmm. I'll admit I'm sorta intrigued by the question. Any chance you have a link to a repo containing the actual app in question? If not, can you show how you're actually using that connectedComponent() function?

[clydeespeno]

Let me create a sample repo. I'll submit another comment once it's done. thanks in advance!

[clydeespeno]

Hi @markerikson, sorry for getting back to you late. I had to dumb down the repository without losing so much of the context.
I pushed the repository here:
https://github.com/clydeespeno/redux-custom-store

[clydeespeno]

Found the issue. I was using an older version of react-redux (5.0.2) which contains the bug described here: #589.

Thanks @markerikson. My bad, I did not even check whether my version was already outdated.

[markerikson]

Heh. Glad you got that figured out. (The best kind of problem report - one that resolves itself without me having to do anything! :) )