Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] React component doesn't connect to Overmind #528

Open
SergeiKalachev opened this issue Jul 6, 2021 · 1 comment
Open

[BUG] React component doesn't connect to Overmind #528

SergeiKalachev opened this issue Jul 6, 2021 · 1 comment
Assignees
Labels
bug Something isn't working

Comments

@SergeiKalachev
Copy link

Hello @christianalfoni

There is a bug that happens in specific conditions, component does not connect to overmind and does not react on state changes.

Background and problem

I updated overmind packages to the latest versions:

    "overmind": "28.0.1",
    "overmind-react": "29.0.1",

Migrated codebase according to the migration guide.
While testing I noticed that <Header /> component does not render icons after logging-in:
Jul-06-2021 15-40-05

Icons:
Screen Shot 2021-07-06 at 3 40 40 PM

In the devtools I see that <Header /> isn't connected even though I have useOvermindState and some state used inside render function:
Screen Shot 2021-07-06 at 3 42 30 PM

The only functionality-relevant change is removing onInitialize and creating new action called onInitializeOvermind. After some digging I discovered conditions in which bug appear:

  1. Setting boolean flag to false inside onInitializeOvermind
  2. Accessing boolean flag in component via useOvermindState hook.
const Component1 = () => {
    const { someBooleanValue } = useOvermindState();

    return (<div>{String(someBooleanValue)}</div>)
}
  1. Running action that updates boolean to true inside function component's body, e.g
const Component2 = () => {
    const { setToTrue } = useOvermindActions();

    setToTrue();

    return (<div>Some text</div>)
}

In such case Component1 won't connect to overmind and will ignore any changes to someBooleanValue.

Reproducible examples

CodeSandbox number one has an old version of overmind with onInitialize where everything is working as expected (Press Toggle to see changes): https://codesandbox.io/s/overmind-connect-issue-old-working-0jm9w?file=/src/FinishLoginOnMount.tsx

Codesandbox is the same code migrated according to the guide. Component does not connect to overmind (Toggle changes value in state but component doesn't care): https://codesandbox.io/s/overmind-connect-issue-60u5w

Expected behavior

I would expect the same behavior as in older version of overmind 27.0.0. Component should connect anyway, doesn't matter how I call actions (inside useEffect or in function component's body) and whether I change flag inside initializeOvermind.

I hope it helps. @christianalfoni Will you have a chance to look at it?

@SergeiKalachev SergeiKalachev added the bug Something isn't working label Jul 6, 2021
@christianalfoni
Copy link
Member

Hi @SergeiKalachev and thanks so much for diving into it! I will take another round of Overmind related fixes and will check this one first! 😄

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants