Socket.io connection to different mySQL tables, Angular front end

I have an angular app that displays a table of data (mySQL database) and updates whenever anything is added to the database. I feel that I should add I'm very inexperienced, i know angular but trying to learn more about backened operations.

I'm using a websocket (socket.io) on a node.js server to achieve this. It works fine but I'd like to add a second unrelated table of data that will appear in a different part of my app. . Should I set up another websocket to achieve this? Or can one websocket interact with 2 different table in the one database.

All of the SQL queries are handled in the backend and look like this.

// Create MySQLEvents
    const instance = new MySQLEvents(connection, {
        startAtEnd: true  // to record only new binary logs
    });

await instance.start();

instance.addTrigger({
    name: 'Monitor all SQL Statements',
    expression: 'mydb.*',  // listen to database
    statement: MySQLEvents.STATEMENTS.ALL,
    onEvent: e => {
        currentData = e.affectedRows;

        let newData;

        switch (e.type) {
case "INSERT":
                database.table('products')
                    .withFields(['id', 'title', 'quantity', 'price'])
                    .sort({id: -1})
                    .getAll()
                    .then(prods => {
                        data = prods;
                        io.sockets.emit('update', {prods: [...data]});
                    })
                    .catch(err => console.log(err));
                .....

My front end just accepts and displays the incoming data. I'd be unsure of how to add a second socket to it.

Here is my socket.service.ts in angular.

export class SocketService {

constructor(private socket: Socket) { }

  getInitialData() {
    return this.createObserver('initial');
  }

  getUpdatedData() {
    return this.createObserver('update');
  }
   
  private createObserver(event: string) {
    return this.socket.fromEvent(event);
  }

and here is the component.ts

export class DashboardComponent implements OnInit, OnDestroy {

  private subs: Subscription[] = [];
  localData: any[] = [];

  constructor(private socketService: SocketService) {
  }

  ngOnInit() {
    this.subs.push(
      this.socketService.getInitialData().subscribe((data: ServerResponse) => {
        this.localData = data.prods;
      })
    );


    this.subs.push(
      this.socketService.getUpdatedData().subscribe((data: ServerResponse) => {
        this.localData = data.prods;
      })
    );
  }

  ngOnDestroy() {
    this.subs.forEach(s => s.unsubscribe());
  }    

}

interface ServerResponse {
  prods: any[];
  type?: string;
}

I just iterate over localData to display the table.

My ideal outcome would be to have the one websocket with multiple endpoints. I just don't know how to handle this with mySQL events.

Similarly if I had 2 completely separate websockets I'm unsure how to handle that on the angular side.