rapidfire | Making dynamic surveys should be | Application Framework library

I postes this question because I didn't find any related answer on stackoverflow. I did everything. I will explain what I have tried. When I start the Rails server using rails s, I get the following output:

The cells on the table on https://dev.meteo.cam/pricing overlapp on small screens:

Granted, this table is a bit special, because I changed the style such that the tbody becomes vertically scrollable.

However, what is confusing is that the code sample below works, using the same CSS styles:

Scenario:

I have a situation where a large number of checkboxes are bind to a function called onChange().

I also have another function that has the ability to reset/update specific checkboxes at once based on some other parameters in the code. Let's call this function rapidFire()

Now, what I would like to do is fire onChange() only and only when a user manually clicks on the checkbox. If my other code (reset/update) or rapidFire() that runs periodically, is making changes to the checkboxes where a series of onChange() calls are made, they should all be cancelled.

I have implemented a debounce logic to capture all onChange() calls made by the rapidFire() code, however, by the nature of debouncing, it still lets 1 call execute at the end after a certain milliseconds have elapsed.

What I would like to do is cancel all function calls made within a specific millisecond threshold assuming that they were made by the update/reset or rapidFire() code. I am also assuming here that if a human clicks a checkbox, it's hard for them to click another one within 250 ms or a similar timeframe.

Here's my code for debounce that I implemented with the help of this post