Can only send data from the end which initiated the connection. How to send Data from other end (PeerJs) - webrtc

Question

I am using the peerjs module in my SvelteKit app to create a peer-to-peer file transfer app
Also the custom signaling server using peerjs --port 5000 command and it's connecting successfully
Here's my code typescript from the file sender's end:
import { FormatFileSize } from '../lib/utils/FormatFileSize'; // function to convert file size into a string of kb, MB, GB file sizes
import Peer from 'peerjs';
import type { DataConnection } from 'peerjs'; // had to import separately because no export of DataConnection was shown from the 'peerjs' module I don't know why
import { onMount } from 'svelte';
export let file: FileList; // the file which needs to be transfered
let senderPeerId: string = '';
onMount(() => {
let peer: Peer = new Peer({
host: '/',
port: 5000
});
peer.on('open', function (id) {
console.log('My peer ID is: ' + id);
senderPeerId = id;
});
peer.on('connection', (dataConnection: DataConnection) => {
console.log('connected', dataConnection);
dataConnection.send('Hello'); // trying to send this but it's not being recie
dataConnection.on('data', function (data) {
console.log('Received', data); // I am logging the data received from the other end
});
});
});
And here's my code typescript from the file receiver's end (But this end is initiating the peer connection):
import type { PageData } from './$types';
import Peer from 'peerjs';
import { onMount } from 'svelte';
export let data: PageData; // in the formate of { receiverId: string } because this page params contain the peer id of the sender.
let peer: Peer; // initiating here so that can use it elsewhere
onMount(() => {
peer = new Peer({
host: '/',
port: 5000
});
peer.on('open', function (id) {
console.log('My peer ID is: ' + id);
startPeerConnection();
});
});
function startPeerConnection() {
const dataConnection = peer.connect(data.receiverId);
console.log(dataConnection);
dataConnection.on('open', function () {
console.log('connection started');
dataConnection.on('data', function (data) {
console.log('Received', data); // logging the data, but no data is recieved
});
dataConnection.send('World'); // this data is sent successfully and logged in the console of the other side
});
}
What am I doing wrong here, or only the side which initiates the connection can send data?
I looked through the internet but couldn't find a similar problem and a solution to it, please help !!