Action Cable connecting to channel but not receiving data

Question

I created the following using ActionCable but not able to receive any data that is being broadcasted. It is subscribing to the channel.

This is my DoubleChannel.rb

class DoubleChannel < ApplicationCable::Channel
  def subscribed
    stream_from "doubles_channel_#{params[:id]}"
  end
end

This is the "edit" function where i broadcast the message to the channel

  def edit
    ActionCable.server.broadcast "doubles_channel_#{params[:id]}", "#{current_user.username} is currently editing the team"
    @double = Double.find(params[:id])
    @competition = @double.competition
    @gameweek = @competition.gameweek
  end

this is my doublesFunction.js

export function initializeDoubleChannel(doubleId) {
  const cable = createConsumer();
  const channel = cable.subscriptions.create({channel: `DoubleChannel`, id: `${parseInt(doubleId)}`}, {
    connected: function() {
      console.log("Connected to DoubleChannel");
    },
    disconnected: function() {
      console.log("Disconnected from DoubleChannel");
      document.getElementById("channel-status").innerText = "Disconnected from Double Channel";
    },
    received: function(data) {
      console.log("Received data:", data);
      document.getElementById("channel-status").innerText = data;
    }
  });
}

and this is the file where i import the initializeDoubleChannel function and call it

 import { initializeDoubleChannel } from "./doublesFunctions";
document.addEventListener("turbo:load", (e) => {
  const doubleId = document.querySelector(".double-id").innerText;
  initializeDoubleChannel(doubleId);
}

These are the logs when the the edit method is triggered

Started GET "/cable" [WebSocket] for ::1 at 2024-02-20 16:50:36 +0200
Successfully upgraded to WebSocket (REQUEST_METHOD: GET, HTTP_CONNECTION: Upgrade, HTTP_UPGRADE: websocket)
DoubleChannel is transmitting the subscription confirmation
DoubleChannel is streaming from doubles_channel_2

Now something weird is happening, when i subscribe to the channel, the data is not received and these are the messages in /cable in the network tab

messages in /cable in the network tab when edit is triggered and subscription to the channel is established (https://i.stack.imgur.com/uYw76.png)

When i refresh the page right before the new page loads, the data is received and i managed to screenshot the messages right before the new page is loaded

messages in /cable network tab right before the new page loads(https://i.stack.imgur.com/i7sCa.png)

As you can see the message is received then, what am i missing?