Ошибка Socket.IO с обработчиком событий

Question

В моей игре я пытаюсь сделать так, чтобы плитки выбирались один раз, когда устанавливается соединение с сервером, тогда каждый человек, который подключается, получает плитки. Внутри useEffect, где должно происходить событие «join». Кажется, что обработчик события «join» не работает, хотя «connect» все еще работает. Может кто-нибудь помочь мне понять, почему это так?

index. js

io.on("connection", async socket => {
  console.log("New connection --------");
  const tiles = await getAllTiles();

  socket.on("join", ({ username, lobby }, callback) => {
    console.log("USER JOINED");
    const { error, user } = addUser({ id: socket.id, username, lobby });

    if (error) return callback(error);

    socket.join(user.lobby);

    io.to(user.lobby).emit("usersData", {
      lobby: user.lobby,
      users: getUsersInLobby(user.lobby)
    });

    socket.emit("tileData", {
      tiles: tiles
    });

    callback();
  });

  socket.on("disconnect", () => {
    console.log("User disconnected --------");
  });
});

Реагирующий компонент

  useEffect(() => {
    const { username, lobby } = queryString.parse(location.search);
    socket = io(ENDPOINT);

    socket.emit("join", { username, lobby }, error => {
      if (error) {
        alert(error);
      }
    });
  }, [ENDPOINT, location.search]);