JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://mobiledemo.jaspersoft.com/jasperserver-pro/client/visualize.js"></script>

<button id="previousPage" disabled>prev</button>
<input id="currentPage" value="1" style="width: 30px;"/>
<button id="nextPage">next</button>
<br><br>
    
<div id="App"></div>

React

function RenderVisualize () {
  React.useEffect(function () {
visualize({
	auth: {
		name: "joeuser", 
		password: "joeuser",
        	organization: "organization_1"
	}
}, function (v) {
    var currentPage = 1,
        totalPages,
        report = v.report({
            resource: "/public/Samples/Reports/AllAccounts",
            container: "#container",
            events: {
                changePagesState: function(page) {
                    currentPage = page;
                    checkPagesConditions();
                },
                changeTotalPages: function(pages) {
                    totalPages = pages;
                    checkPagesConditions();
                }
            }
        });

    $("#currentPage").on("change", function() {
        var value = parseInt($(this).val(), 10);
        
        if (!isNaN(value) && value >= 1 && value <= totalPages) {
            currentPage = value;

            report
			    .pages(currentPage)
    			.run()
                    .done(checkPagesConditions)
		    		.fail(function(err) { alert(err); });
        }       
	});
	
    $("#previousPage").on("click", function() {
        report
			.pages(--currentPage)
			.run()
                .done(checkPagesConditions)
				.fail(function(err) { alert(err); });
	});

	$("#nextPage").on("click", function() {
        report
			.pages(++currentPage)
			.run()
                .done(checkPagesConditions)
                .fail(function(err) { alert(err); });
	});
    
    function checkPagesConditions() {
        $("#currentPage").val(currentPage);
        $("#previousPage").prop("disabled", currentPage === 1);
        $("#nextPage").prop("disabled", currentPage === totalPages);
    }
});
  }, [])

  return (
    <div id='container'></div>
  )
}

ReactDOM.render(<RenderVisualize />, document.querySelector("#App"))