I am developing a custom dashboard with a table created from XML. The table has an id of "summary_table" which I am calling to extend with custom cell renderer.  The issue is that the table doesn't render the extended view of the table on first load. But if I click on the table header - which will trigger a sort function, the extended view works. Same thing when I click on a page from pagination view.  This is the view when I first load the dashboard.  (DATA SHOWN BELOW ARE ALL MOCK DATA) And this is the view when I click on any of the table headers. Which should have been rendered on first load. I am thinking that the table didn't re-rendered again after adding the new BaseCellRenderer.    here's my code.            var CustomCellRenderer = TableView.BaseCellRenderer.extend({ canRender: function(cell) { // Enable this custom cell renderer for the confirm field return cell.field === 'Expiry_Extension' }, render: function($td, cell) { console.log(cell.value) if(cell.value != ""){ const extension = cell.value.split("|")[0] const expiration_date = cell.value.split("|")[1] const order_id = cell.value.split("|")[2] let html = `` let button_html = ` <button class="extend_expiry btn-sm btn btn-primary"><i class="icon icon-plus-circle"></i></button>` if(extension == 'null'){ html += button_html } else{ html += extension html += button_html } $td.html(html) } } }); // Create an instance of the custom cell renderer var myCellRenderer = new CustomCellRenderer(); setTimeout(function(){ mvc.Components.get("summary_table").getVisualization(function(tableView) { tableView.addCellRenderer(myCellRenderer); tableView.table.render() console.log("rendered") }); },1000) }             ... View more