Upon changing a row in a table, I have an event handler that trigger query1. Query1 contains this JS code (simplification):
let apidata = {
idempotency_token:invoiceable_cars_table.selectedRow.data.vin,
};
return apidata
Now, when I press quickly multiple different rows, the apidata returned does not correspond to each rows data individually, but sometimes also contains duplicates, i.e. shows most recent row double. How is this possible, and how should I resolve this?
Additionally, there are also some variables (not shown in query1, but available in real application), that draw their data from transformers, that in turn also depend on textInputs within the Retool that cause a similar issue.
A resolution would be if there is a way that the event handler only fires when the queries from the previous event handle are finished - some sort of queing mechanism (async does not work I think since it is upon row change). I tried using a temp state variable for this and disable user interaction on the table, but this does not update in real-time, i.e. users still can click 2 rows before it gets locked. Help on this matter would be very much appreciated!
Edit:
Debouncing won't work, since I really want it to be controlled (handling crucial data).
Another question for my understanding of SelectedRow: when SelectedRow is used in a query, does it handle the SelectedRow on which it was triggered, or the current one that is shown in the table interface? (Press row 1: trigger Query, shown row 2 -> does SelectedRow that got triggered from row 1 then reflect row 1 or 2?)
