[Bug]: `onAdd` and `onRemove` is getting called multiple times after hot-reload

[anguer]

Bug description

When invoking removeAllListeners to clean up event listeners, the event listeners for onAdd and onRemove are not cleared, resulting in multiple invocations.

Optional: Minimal reproduction

export const Provider = ({ children }: { children: ReactNode }) => {
  const [currentRoom, setCurrentRoom] = useState<Room<State> | null>(null);

  useEffect(() => {
    if (!currentRoom) {
      return;
    }

    log.info('registerRoomListeners', currentRoom.roomId);
    currentRoom.onLeave(onRoomLeave);
    currentRoom.onError(onRoomError);
    // currentRoom.onStateChange(onStateChange);
    currentRoom.onMessage('__playground_message_types', onPlaygroundMessage);
    // FIXME: onAdd and onRemove is getting called multiple times after hot-reload
    currentRoom.state.players.onAdd(onPlayerEnter);
    currentRoom.state.players.onRemove(onPlayerLeave);
    currentRoom.state.viewers.onAdd(onViewerEnter);
    currentRoom.state.viewers.onRemove(onViewerLeave);

    return () => {
      if (currentRoom) {
        log.info('unregisterRoomListeners', currentRoom.roomId);
        currentRoom.removeAllListeners();
      }
    };
  }, [
    currentRoom,
    onRoomLeave,
    onRoomError,
    onPlaygroundMessage,
    onPlayerEnter,
    onPlayerLeave,
    onViewerEnter,
    onViewerLeave,
  ]);

  return <>{children}</>;
};

[endel]

This will be fixed on https://github.com/colyseus/colyseus/issues/709