
The user interface for my application is relatively straightforward: it's a batch ID list that updates every 15 to 30 seconds. Currently, it's a single column, but it might evolve into a table, possibly displaying additional information like the number of batch elements present.
The batch IDs will have different colors to indicate their state (e.g., not ready, ready for processing, in process, processed). I've learned that handling colors is best done through CSS.
The only user interaction required is clicking on a batch ID in the "ready to be processed" state to initiate the processing of that batch. Each element in the batch ID list would serve as a link for a GET request.
Apart from the dynamically changing batch ID list, the remainder of the page will remain static and serve decorative purposes.
My initial, perhaps less sophisticated approach, involves refreshing the entire page every 10-15 seconds to update the list. However, the main drawback is that it might refresh just as a user is about to click on a batch ID. To address this, I'm considering disabling the refresh if the mouse cursor is over the batch ID list.
Are there any better and simpler techniques I could use to achieve this functionality koows koows than the ones I've outlined here?