I want to use a table or a listview to display a database table and let the user makes multiple changes (delete, add, update) and the UI (table or listview) should reflect the change right away. In the end, all the changes should be sent back to the database once (bulk insert).
Based on some reading, I think this is where temp state should be used but I am a bit confused about the workflow.
When the temp state should be used: store all the data after the changes have been made or store the data from the beginning and track all the changes along the way? And should the database table be the source of table/listview or the temp state (let the table/listview refers to temp state value)?
@doris.l funny coincidence, I just built a Retool app that utilized a very similar workflow. The use case was letting app users upload an arbitrary number of screenshots, with each having an optional description (text) alongside it. Here's how I did it:
Organize the UI for the CRUD operation (for me, a filepicker and text input)
Initialize a temp state variable (I had the initial value as an empty array)
Every time a user added a new "object" (screenshot and description), I would push it to the temporary state array via a Run JS Code query
All new objects are displayed in a listview component, with "edit" and "remove" buttons that would adjust the temporary state accordingly
On final submit, I'd push the value of the temporary state to the database via a bulk insert