search

tonyhb / redux-ui

Easy UI state management for react redux
636 stars 58 forks source link

UPDATE_UI_STATE vs MASS_UPDATE_UI_STATE and child components #55

Closed Rich-amoebaWare closed 8 years ago

Rich-amoebaWare commented 8 years ago

I have a component that has this ui state property:

dialogOpen: false

I am trying to change it to this because I have several dialogs I want to track state of (where XXX is identifier of a dialog):

dialog: { open: false, ...other props }

I use updateUI('dialogOpen', true) and the child component sees changed state and will display itself. When updateUI('dialogOpen',false) is called the child component sees the change and hides itself.

But, when I switch to the second state the child component is not updated when I call: updateUI( {dialog: merge(ui.dialog, {open: true} ) } ) )

The state is updated correctly as I can see it in the devTool monitor and can watch the action update the state correctly. But the child component is not notified/updated like in the first example.

I see that an UPDATE_UI_STATE action is sent in the first case when a string/value pair is passed to updateUI() but a MASS_UPDATE_UI_STATE is sent when passing an object to the updateUI().

My parent component state looks like this: @ui({ key: 'client', persist: true, state: { activeTab: "contactLog", dialogOpen: false, dialog: { open: false, initValues: {}, values: {} }, ........ and my child component state (dumb and not connected) who reads the ui.state and sets up its ui according to values contained in the ui state.... @ui({ state: { buttons: { cancel: {id: "cancel", label: "Cancel"}, submit: {id: "submit", label: "Submit"}, } } })

How can I get the same behavior when passing an object to updateUI() ? Or how can I work around this difference?

Rich-amoebaWare commented 8 years ago

I think this was just a "user error"... I went back and completely redid my actions and state management code in parent and child components and problem went away.