Another edge case? Store not updating properly.

Hey again,

I am presently converting a past project to Undux (along with TypeScript and React Hooks).

Islands are rendered from the IslandSet component as such:

// simplified

Object.keys(islands).map(type =>  
  <Island key={type} island={island} />
)

An Island can be moved via react-native-web's PanResponder. When I initialize it, I define onPanResponderRelease:

onPanResponderRelease: () => {
  // ...

  if (!same) {
    GameplayStore.set("count")(count + inBounds)
    this.setState({onBoard})
  }

  // ...
}

The logic is when I drag an island onto the board, the count should increase by 1. If I drag an island off the board, it should decrease by 1. And otherwise, it's a no-op.

So, when I drag one island onto the board, the count goes from 0 to 1. BUT, when I drag a second island onto the board, it also goes up from 0 to 1.

refactor-bug

I had a theory that this might have to do with how onPanResponderRelease captures count, so I tried passing count as a prop in IslandSet.

Additionally, adding a log in the component (outside of this function), I do see it triggered for all islands whenever I move one, which means they are all re-rendering properly.

debug-islands

I was getting the proper behavior just using plain React components (and passing down a setState function as a prop).

At this point, the plan would be to re-convert this part of the project back to something like my master branch, which would be disappointing given that the thing that most excited me about Undux was that I'd no longer have a need to pass down that setState function.

bcherny / undux

Another edge case? Store not updating properly. #80