fix: multiple connections issue

This pull request aims to fix #1. I saw an old PR (#2) trying to fix this same issue using refs, but the problem with that was that it was setting the ref inside the render function and not inside an useEffect hook, therefore, it was creating a new connection of socket.io in each render.

The approach that I followed was creating and storing the instance of socket.io inside an useEffect hook. The only caveat that this approach has is that in the first render it will return a null value and after that, the socket instance; this because of the useEffect hook.

@focux this is clever! i have tested your fix, and by wrapping the socket in if (socket), works like charm! :)

thank you for your contribution!