We have a payment gateway implemented with Authorize.net's Accept.js javascript library in Reactjs. This is is button tag code.

<button
   ref={this.paymentBtnRef}
   style={{ display: "none" }}
   className="AcceptUI"
   disabled={!this.state.acceptJsLoaded || !this.state.formData}
   data-billingaddressoptions='{"show":false, "required":false}'
   data-apiloginid={CONSTANTS.AUTH_NET_API_LOGIN_ID}
   data-clientkey={CONSTANTS.AUTH_NET_CLIENT_KEY}
   data-acceptuiformbtntxt="Proceed"
   data-acceptuiformheadertxt="Payment information"
   data-paymentoptions='{"showCreditCard": true, "showBankAccount": false}'
   data-responsehandler="handlePaymentTokenResponse"
   cancelUrl="/"
>
   [ checkout ]
</button>

I am using the class component in Reactjs and this is where Accept.js loads:-

componentDidMount = () => {
   window.handlePaymentTokenResponse = (obj) => {
      if (this.state.formData) {
         this.props.registerUser({
            ...this.state.formData,
            paymentTokenObj: obj.opaqueData,
         });

         // eslint-disable-next-line
         this.state.formData = null;
      }
   };

   loadScript(
      document,
      "script",
      "authorize-net-accept-js",
      "https://jstest.authorize.net/v3/AcceptUI.js",
      () => {
         this.setState(
            {
               acceptJsLoaded: true,
            },
            () => console.log("authorize-net-accept-js loaded")
         );
      }
   );
   this.props.fetchCreateAccountData();
};

I want to redirect when the user closes the Model but I can't find anything on Authorize.net documentation for cancelling the URL. When the user closes the dialog it stays on the current page I want to redirect the user to another page.

Accept.js renders AccpetUI dialog in an iframe so I can't add onClick on the close icon button. How should I redirect the user ?