I use the following method to achieve what you want using the fewest dependent pieces. The reason I do it the following way is to cut down the trail I have to follow when something doesn’t work.
I add a Data Detail component (based on the same data as my table) which then drives the other actions.
When I click the desired cell I set the ID of the data_detail to match the id of the table row
I have a Class Toggle Dynamic Attribute on the table row that toggles the class to bg-dark if “id == data_detail.data.id” - to indicate which row is selected
On the Modal I set the Modal Show Dynamic Attribute to data_detail.data.id - this makes the modal appear when it has anything greater than 0 in the data_detail id.
On the Modal I set the Hidden Dynamic Event to data_detail.select(0) - this sets the data_detail id to 0 and removes the data detail, removes the bg-dark class from the table row etc
I set the variable of the server connect that is to fire from data_detail.data.id - once that changes the Server Connect component will fire and the data is then available to your modal to work with.
I would highly recommend that you put all your server connects, data details, variables, query’s and modals at the top of your page before your page html structure. The main reason that I recommend this is because if you don’t and your page gets complicated you will drive yourself barmy trying to locate them as you work later.