Description:
JS queries that are triggered by buttons' event handlers get triggered randomly up to 40 times when it should only trigger once.
Environment:
I am only facing this issue on Retool Mobile, it works perfectly fine on web.
Attached are screen recordings from mobile and from web:
Web:
Mobile:
One JS query I am facing the issue with:
onAddProspect
// Retrieve customer attributes form data and market-specific inputs
const newProspectData = customerAttributesForm.data;
console.log("NEW PROSPECT DATA == ", newProspectData);
let inputsData = _.get(getMarketSpecificInputs, 'data', null)
? getMarketSpecificInputs.data
: await getMarketSpecificInputs.trigger().then(response => _.get(response, 'data', []));
// Get the keys of new prospect data fields
const newProspectFormDataFields = Object.keys(newProspectData);
// Prepare new prospect customer attributes
const newProspectCustomerAttributes = {
user_id: _.get(getPcmInfo, 'data.user_id[0]', null),
magento_instance_id: _.get(getPcmInfo, 'data.magento_instance_id[0]', null),
};
// Create a new prospect and retrieve the new prospect ID
const createNewProspectReturn = await addProspect.trigger({
additionalScope: {
prospectData: newProspectCustomerAttributes,
},
});
console.log("NEW PROSPECT CUSTOMER ATTRIBUTES == ", createNewProspectReturn);
const newProspectId = _.get(createNewProspectReturn, 'result[0].id', null);
// Map new prospect form data fields to input IDs and values
const newProspectFormDataFieldsIds = _.compact(formatDataAsArray(inputsData)
.filter(input => _.includes(newProspectFormDataFields, input.name))
.map(input => {
const inputOption = _.find(input.options, { input_option_id: newProspectData[input.name] });
const inputOptionValue = _.get(inputOption, 'input_name', newProspectData[input.name]);
return {
input_id: parseInt(input.input_id, 10),
input_option_value: inputOptionValue,
customer_attributes_id: parseInt(newProspectId, 10),
customer_attributes_id_input_option_value: `${newProspectId}_${inputOptionValue}`, // Fixed this line
input_option_id: (!inputOption || isNaN(newProspectData[input.name])) ? null : parseInt(newProspectData[input.name], 10),
};
})
);
// Add new prospect input options
const newProspectInputOptionsReturn = await addCustomerInputOptions.trigger({
additionalScope: {
inputsData: newProspectFormDataFieldsIds,
},
});
console.log("NEW PROSPECT INPUT OPTIONS RETURN == ", newProspectInputOptionsReturn);
// Return the result
await getPcmCustomers.trigger();
return newProspectInputOptionsReturn;
On success
navigator.back()
utils.showNotification()
Editor
