I find the way I implemented the bulk update of editable rows of my table quite complicated, and asked myself if there is a better way to accomplish it.
First, clicking save triggers this modified version of a JS code snippet I found somewhere in the retool docs:
var rows = tableQ.recordUpdates;
var errors = '';
var errorText = '';
var total = rows.length;
function runQuery (i) {
if (i >= total) {
console.log('Finished running all queries');
getQDetails.trigger();
return;
}
var questionId = tableQ.recordUpdates['0'].question.question_id;
var questionName = (typeof tableQ.recordUpdates['0']['Custom Column 1'] === 'undefined') ? tableQ.recordUpdates['0'].question.question_name : tableQ.recordUpdates['0']['Custom Column 1'];
var questionDesc = (typeof tableQ.recordUpdates['0']['Custom Column 2'] === 'undefined') ? tableQ.recordUpdates['0'].question.question_description : tableQ.recordUpdates['0']['Custom Column 2'];
var questionTypeId = (typeof tableQ.recordUpdates['0']['Custom Column 3'] === 'undefined') ? tableQ.recordUpdates['0'].question.type.question_type_id : tableQ.recordUpdates['0']['Custom Column 3'];
console.log('Running query for row', i,);
updateQs.trigger({
additionalScope: {
questionId: questionId,
questionName: questionName,
questionDesc: questionDesc,
questionTypeId: questionTypeId
},
// You can use the argument to get the data with the onSuccess function
onSuccess: function(data) {
runQuery(i + 1);
},
onFailure: function(error) {
// Update the errorsText with all the errors encountered
errors += 'Found error at line ' + i.toString() + ': ' + error + '\n\n';
errorText.setValue(errors);
runQuery(i + 1);
}
});
}
runQuery(0);
Because GraphQL gives an error when recordUpdate
columns are undefined, I have to check and set them to the values already present.
This is the GraphQL mutation (via Hasura):
mutation update_a_question(
$question_id:Int!,
$question_name:String,
$question_description:String,
$question_type_id:Int
) {
update_questions_by_pk(pk_columns: {question_id: $question_id}, _set: {
question_name: $question_name,
question_description: $question_description,
question_type_id: $question_type_id
}) {
question_id
}
}
Am I missing something or is this the only way to achieve this with GraphQL? It seems like an awful lot of repetition and code that's not dry.