title: Managing exit of a user from a game 'room' on React?
body: <p>This might seem complicated - I am working on a game app on React that involves users all joining a certain <code>&lt;Route&gt;</code> in my project. When all users are on this route, the game is unpaused and if not the game is paused. </p>
  
  <p>My question is: How can I manage to suddenly pause the game if a user leaves the link or closes the tab ? Is there any way to actively check this on react? I figured useEffect hook might be useful but I don't know how to get the number of users leaving a site or closing the tab in real-time at once.</p>
  
  <p>Here is some basic code to understand what I want. I have a functional React component <code>&lt;GameSession&gt;</code> that hosts a game when users join this link:</p>
  
  <pre><code>const GameSession = ({userRegistered}) =&gt;{
  
    const [paused, setPaused] = useState(false);
  
    useEffect(() =&gt; {
    // store some user related data in localStorage when the user loads
  
    }, []);
  
    useEffect(() =&gt; {
    setPaused(numberofUsersInGame === totalUsers ? false : true)
    }, [numberofUsersInGame]);
   /* MY PROBLEM IS IN THIS EFFECT HOOK ABOVE. HOW TO CHECK IF A USER HAS LEFT THIS 
  COMPONENT OR PAGE SO I CAN UPDATE numberofUsersInGame ? */
  
     if(!userRegistered)
     return &lt;Redirect to="/dashboardpage"&gt;
  
     if(paused)               
    return &lt;PausedComponent /&gt; /*this component should fire a return when total
                                 number of users registered to this game is not
                                 equal to current number of users who are
                                 active on the GameSession component (this link)*/
  
     return (
        &lt;Fragment&gt;
        &lt;GameComponent&gt;
        &lt;/Fragment&gt;
        );
  
  
  };
  GameSession.propTypes = {
  // PropTypes go here
  };
  const mapStateToProps = (state) =&gt; ({
  //states go here
  });
  export default connect(mapStateToProps, mapDispatchToProps)(GameSession);
  </code></pre>