How to use hookstore to avoid this error?

[gitcatrat]

Error I'm getting in console:

Warning: Can't perform a React state update on an unmounted component. 
This is a no-op, but it indicates a memory leak in your application. 
To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.

Error location in hookstore code:

this.setters.forEach(function (setter) {
  return setter(_this.state);
});

Here's the situation that fails:

PS! Also tried to pass dispatch/user store array directly to button as prop, same thing.

function Header() {
  const [user, dispatch] = useStore('user');
  
  return (
    <div>
      {/* other stuff.. */}
      
      {user.loggedIn && (
         <LogoutButton />
      )}
    </div>
  );
}

function LogoutButton() {
  // this component doesn't exist anymore after
  // dispatch runs, hookstore still tries to update it?
  const [user, dispatch] = useStore('user');
  
  function logout() {
    // sets user.loggedIn to false
    dispatch({type: 'logout'});
  }
  
  return (
    <button onClick={logout}>Logout</button>
  );
}

[gitcatrat]

Ah, could be a false alarm unless you already want to make this package future proof.

I was running concurrent mode with latest experimental React release.

[jhonnymichel]

Hey! Concurrent mode is still something I plan on supporting, right now this warn will exist. That said, it's inside a try catch and it won't stop execution of your app, I'm only logging the error