How to use react-async-script - 8 common examples

token: tokenAddress,
        address: buyFromAddress,
        // amount: amountString,
        onComplete: () => {
          this.props.onComplete();
        },
        onCancel: () => {
          console.info("Trade cancelled");
        },
      },
      "body",
    );
  }
}

export const AirswapBuyCVL = makeAsyncScriptLoader(airswapScript)(BuyCVLBase);

// @ts-ignore
    window.AirSwap.Trader.render(
      {
        mode: "sell",
        env: environment,
        token: tokenAddress,
        onComplete: () => {
          this.props.onComplete();
        },
      },
      "body",
    );
  }
}

export const AirswapSellCVL = makeAsyncScriptLoader(airswapScript)(SellCVLBase);

) : (
                                    <div>
                                        <h2>Your organisation is on the Startup plan</h2>
                                        <p>Click <a>here</a> if you'd like to cancel your plan</p>
                                    </div>
                                )) : null}
                            
                        )
                    }
                
            
        );
    }
};

const WrappedAccountPage = makeAsyncScriptLoader(ConfigProvider(AccountPage), 'https://js.chargebee.com/v2/chargebee.js', {
    removeOnUnmount: true
});

AccountPage.propTypes = {};

module.exports = (props) =&gt; (
     {
        Chargebee.init({
            site: Project.chargebee.site
        });
        Chargebee.registerAgain();
    }} /&gt;
);

)
                    }
                
            
        );
    }
};

const WrappedPaymentModal = makeAsyncScriptLoader(ConfigProvider(PaymentModal), 'https://js.chargebee.com/v2/chargebee.js', {
    removeOnUnmount: true,
});

PaymentModal.propTypes = {};

module.exports = props => (
     {
          Chargebee.init({
              site: Project.chargebee.site,
          });
          Chargebee.registerAgain();
          Chargebee.getInstance().setCheckoutCallbacks(cart => ({
              success: () => {
                  AppActions.editOrganisation(Object.assign({}, AccountStore.getOrganisation(), {
                      paid_subscription: true,

function getOptions() {
  return (typeof window !== "undefined" && window.recaptchaOptions) || {};
}
function getURL() {
  const dynamicOptions = getOptions();
  const lang = dynamicOptions.lang ? `&hl=${dynamicOptions.lang}` : "";
  const hostname = dynamicOptions.useRecaptchaNet ? "recaptcha.net" : "www.google.com";
  return `https://${hostname}/recaptcha/api.js?onload=${callbackName}&render=explicit${lang}`;
}

const callbackName = "onloadcallback";
const globalName = "grecaptcha";
const initialOptions = getOptions();

export default makeAsyncScriptLoader(getURL, {
  callbackName,
  globalName,
  removeOnUnmount: initialOptions.removeOnUnmount || false,
})(ReCAPTCHA);

private renderPaymentForm = (): JSX.Element => {
    const AsyncScriptLoader = makeAsyncScriptLoader("https://js.stripe.com/v3/")(LoadingMessage);
    if (this.state.stripeLoaded) {
      return (
        
          
            
              {(paymentsCreateStripePayment: MutationFunc) => {
                return (

public render(): JSX.Element {
    const userChannelID = (this.context && this.context.currentUser && this.context.currentUser.userChannel.id) || "";
    const userEmail =
      this.context && this.context.currentUser && this.context.currentUser.userChannel.EmailAddressRestricted;
    const AsyncScriptLoader = makeAsyncScriptLoader("https://js.stripe.com/v3/")(LoadingMessage);
    if (this.state.stripeLoaded) {
      return (
        
          
            
              {(paymentsCreateStripePayment: MutationFunc) => {
                return (
                  
                    {(setEmailMutation: MutationFunc) => {
                      return (

render() {
      const WrappedComponent = makeAsyncScriptLoader(
        () => ,
        'https://js.stripe.com/v2/',
        {
          globalName: 'Stripe'
        }
      )
      return (
        
      )
    }
  }