Which design pattern is good to receive bids from different fronts to a single backend in javascript

I want some guidance, I am working on a WordPress plugin that offers to bid.

There are 2 types of users who can place a bid for an auction. An actual user OR an admin who is able to place a bid to any auction on the behalf of any user.

Well from the frontend, the user is able to place a bid as well as from the backend admin can place a bid on the behalf of a user, and there is a live table that is rendering all the biddings. but the issue is that when the admin adds a bid it shows up in the table but if any user from frontend places a bid this doesn't pop up in the same table .. thou admin has to reload the page to see if any bid appears from the frontend.

I was using setInterval() with an ajax call, but the issue is with setIntervel that if there is any bid from frontend user it keeps loading again and again.

someone suggested following the Observer Design pattern to resolve this hurdle. which I tried but no luck...

I think the Observer design pattern won't help me here.

// The news class is the Observable class or "subject"
class News {
    // A list of observers
    constructor() {
        this.observers = [];
    }

    // Method for subscribing to, or "observing" observable
    addSubscriber(subscriber) {
        this.observers.push(subscriber);
    }

    // Method for unsubscribing from observable
    unsubscribe(subscriber) {
        var index = this.observers.indexOf(subscriber);
        this.observers.splice(index, index);
    }

    // Method for sending data to subsribers
    transmit(data) {
        console.log('transmit: ', data);
        this.observers.forEach(subscriber => subscriber.receive(data));
    }
}


// The News Outlets are subscribers to the news in different languages
class NewsOutlet {
    // We will set the language when we instantiate the news outlet
    constructor() {
        this.data = '';
        this.news = '';
    }

    receive(data) {
        this.data   = data;
        var self    = this;

        // Translate after receiving
        jQuery.ajax({
            url: Observer.ajaxurl,
            type : 'POST',
            encoding: 'UTF-8',
            dataType: 'JSON',
            data: {
                action: 'get_live_room_auction_status',
                last_timestamp : Observer.last_timestamp
            },
            success: function(result) {
                self.news = result;
                self.reportTheNews();
            }
        });

    }

    reportTheNews() {
        // A shady workaround for our HTML efforts!
        jQuery('.bidders-list tbody').append(this.news);
        // document.getElementById(elemId).innerText = this.news;

    }

}


let news = new News;
let enOutlet = new NewsOutlet();

news.addSubscriber(enOutlet);

var sendNews = function( auction_id, timestamp ) {
    news.transmit(timestamp);
    news.observers.forEach(function(o){
        o.reportTheNews();
    });
}