I will generally create a popup template as a reusable element and feed a custom state into it. This allows me to only have to create one popup, which then populates with whatever custom state I desire at the time, initiate any functionality, and then clear the state afterwards.
I attempted to do a similar thing with my popups but I found it only worked for groups (on my SPA) which have the same data type. So, if I want one popup to work for ‘delete invoice’ and ‘delete estimate’ and ‘delete customer’, I would have to have three popups because they each have unique data types.
I didn’t create it as a reusable element though which may be the reason I struggled?