Add concurrent handling to ScriptLoading

Fix OnboardingRenderer
This commit is contained in:
Pedro Silva 2023-08-24 10:26:23 +01:00
parent e66289b3a1
commit 2ae5e2bb4c
No known key found for this signature in database
GPG key ID: E2EE20C0669D24B3
2 changed files with 52 additions and 12 deletions

View file

@ -4,25 +4,60 @@ import widgetBuilder from "../Renderer/WidgetBuilder";
import merge from "deepmerge";
import {keysToCamelCase} from "./Utils";
// This component may be used by multiple modules. This assures that options are shared between all instances.
let options = window.ppcpWidgetBuilder = window.ppcpWidgetBuilder || {
isLoading: false,
onLoadedCallbacks: [],
loadingWaitTime: 5000 // 5 seconds
};
export const loadPaypalScript = (config, onLoaded) => {
// If PayPal is already loaded call the onLoaded callback and return.
if (typeof paypal !== 'undefined') {
onLoaded();
return;
}
// Add the onLoaded callback to the onLoadedCallbacks stack.
options.onLoadedCallbacks.push(onLoaded);
// Return if it's still loading.
if (options.isLoading) {
return;
}
options.isLoading = true;
// Arm a timeout so the module isn't locked on isLoading state on failure.
let loadingTimeout = setTimeout(() => {
console.error('Failed to load PayPal script.');
options.isLoading = false;
options.onLoadedCallbacks = [];
}, options.loadingWaitTime);
// Callback to be called once the PayPal script is loaded.
const callback = (paypal) => {
widgetBuilder.setPaypal(paypal);
onLoaded();
for (const onLoadedCallback of options.onLoadedCallbacks) {
onLoadedCallback();
}
options.isLoading = false;
options.onLoadedCallbacks = [];
clearTimeout(loadingTimeout);
}
// Build the PayPal script options.
let scriptOptions = keysToCamelCase(config.url_params);
scriptOptions = merge(scriptOptions, config.script_attributes);
// Load PayPal script for special case with data-client-token
if (config.data_client_id.set_attribute) {
dataClientIdAttributeHandler(scriptOptions, config.data_client_id, callback);
return;
}
// Load PayPal script
loadScript(scriptOptions).then(callback);
}