react node js socket io emit does not reach the front - node.js

Question

Hello I have a function to send to two sockets values
getMatchConfigurationFor = players => {
console.log(sessionMap.all())
if(players){
const match = new Match(players);
const result = {
idMatch: match.id,
playerOne: match.players[0],
playerTwo:match.players[1]
}
return result;
}
}
configurePlayersForNewMatch = (matchedPlayers) => {
matchedPlayers.forEach(player =>
sessionMap.get(player.socketId)
.broadcast.to(player.socketId)
.emit('match',
this.getMatchConfigurationFor(matchedPlayers)));
}
I tested all of it and it's working perfectly, but I tried to listen to the socket on the front end sme success I don't know why
my front end:
import React, { Component } from 'react';
import io from 'socket.io-client';
import Loading from './Loading'
import Players from './Players'
class Home extends Component {
constructor(props, context) {
super(props, context);
this.socket = null;
this.state = {
queue: [],
loading: true,
players: [],
};
}
componentDidMount() {
// io() not io.connect()
this.socket = io('http://localhost:9000');
const player = JSON.parse(localStorage.getItem('user'));
this.socket.emit('addPlayer-Queue', player);
this.socket.on('match', (result) => {
console.log('a')
console.log(result);
});
this.socket.open();
}
componentWillUnmount() {
this.socket.close();
}
render() {
const { queue } = this.state;
const { loading } = this.state;
const { players } = this.state
const visibility = loading ? 'hidden' : 'visible';
return (
<div className="container">
<div className="result">
</div>
<div className="ctnFlex">
<div className="playerOne">{players.map(pls => <p>{pls.name}</p>)}</div>
<Loading loading={loading} message='in queue.' />
<div className="playerTwo" style={{ visibility }}>
<Players players={players}/>
</div>
</div>
</div>
)
}
}
export default Home;
I have a session map of all sockets that come into my server:
var SessionMap = {};
module.exports = {
set: function(key,value){
SessionMap[key] = value;
},
get: function(key){
return SessionMap[key]
},
delete: function(key){
delete SessionMap[key]
},
all: function(){
return SessionMap
}
}
I debugged all my code and without any kind of error
A console. log of one of the sockets being sent the emit
https://pastebin.com/XHDXH9ih