ExtJS6 Modern: Ext.grid.plugin.PagingToolbar that interacts with grid's store

GridPagingToolbar.js

/**
 * When I first used the "Ext.grid.plugin.PagingToolbar" plugin with ExtJS6.2 modern I thought it could interact and load prev/next pages using the grid's store. 
 * The fact is that the pagingtoolbar does not interact with the store, it splits "pages" of data within the current grid data, but this is not what I was looking for. 
 * Therefore here's my attempt to extend the PagingToolbar and create a paging plugin that actually loads store pages according to the slider. 
 */

Ext.define('MyApp.util.GridPagingToolbar', {
    extend: 'Ext.grid.plugin.PagingToolbar',


    updateGrid: function (grid, oldGrid) {
        this.callParent(arguments);
        this.unbindHook(grid, 'onScrollBinder', 'checkPageChange');
    },


    onUpdateVisibleCount: function (grid) {
        var store = grid.getStore(),
            pageSize = store.getPageSize(),
            totalPages = Math.ceil(store.getTotalCount() / pageSize);
        this.setTotalPages(totalPages);
        this.setPageSize(pageSize);
    },


    onNextPageTap: function () {
        var store = this.getGrid().getStore();
        if (store.currentPage * store.getPageSize() < store.getTotalCount()) {
            var page = store.currentPage + 1;
            this.setCurrentPage(page);
        }
    },


    onPreviousPageTap: function () {
        var store = this.getGrid().getStore();
        if (store.currentPage > 1) {
            var page = store.currentPage - 1;
            this.setCurrentPage(page);
        }
    },


    onPageChange: function (field, page) {
        var grid = this.getGrid();
        grid.getStore().loadPage(page, {
            scope: this,
            callback: function () {
                var topRecord = this.getPageTopRecord(page);
                grid.scrollToRecord(topRecord);
                this.setCurrentPage(page);
            }
        });
    },


    updatePageButtons: function () {
        // do nothing
    }
});