Popup Manager

[HugoHMZ]

How to start using the Popup Manager:

1. Add the PopupShell Component into the expected page
2. When we want to show/close the popup, use the methods openPopup and closePopup provided by the Hook usePopup
3. Done

If you need to make a variant of the popup (that cannot be handled by the current one and the basic one):

1. Create a new Component inside the PopupVariant folder
2. Use the shared styling located in Popup.styles.tsx
3. add your Variant data object to the PopupData and PopupDataMap.
4. You're all set! Simply call openPopup with the string name of your type as the first argument and the data you want to pass to the popup as the second argument. The data will be safely typed to match the type specified in the first argument.

[danbastin]

I think this a fine direction for this as far as giving us the ability to render different kinds of popups. However, I would think less about rendering specific popup and more about popup "forms" For instance, here, the concede and mulligan popups are essentially identical to the default popup. In fact both of these could be created using the default popup.

It may be that you only included these as a demonstration of selecting the popup type, but certainly the default popup is on the right track for what we want. I think it will be helpful for you to get into a game and start looking at some of the prompts we're receiving fromt he back end. I think even just this default prompt would handle a lot of cases if we change it to render the buttons provided by the prompts instead of just a yes no. I would take a look at the BasicPrompt already in the frontend code as a reference for how the default might work.

[HugoHMZ]

Oh I see. About mulligan and concede, I saw a possible interest for a variant of design(red button because it's important action, or anything imaginable), but we can definitely make it part of the data object we pass to the openPopup method.

About the different prompts, I know that 80% of the prompts can be handled using the basic variant, it was mainly to show flexibility of coding. For the final versions, I see 4 variants:

• Basic ("yes" "no" method)
• Select card(s)
• Probably select from pile (https://www.figma.com/design/eOPqFG1725zHly0vv6s3IH/Karabast?node-id=5167-13172&t=LamatG1bC7hNBWSQ-1) (optional parameters could make it fit into the Select card(s) one)
• the Pile one (see discard/deck)

[danbastin]

Do we have support for multiple popups here or is that still WIP?

[HugoHMZ]

Not yet. But refactoring the code to handle multiple popups will not be that struggling