TACo specific Operator Bonding

From Michal:

If we want to have it in the same modal, then I think the best approach would be to create a separate MapOperatorToStakingProviderForm for Taco app and then submit both forms in MapOperatorToStakingProviderModal/index.tsx. It looks like it should be possible using refs. We've done similar thing, where we submitted multiple forms with one submit buttons (see onAuthorizeApps function in src/pages/Staking/AuthorizeStakingApps/index.tsx). I assume the final look that we want to achieve is something like on the screenshot below.

This is needed with the assumption that address for tbtc + random beacon can be different than the one for taco. For tbtc + random beacon we also check if the operator is already used for different staking provider, I assume you would want the same for taco (so one staking provider can be mapped to one, and only one, taco operator), but correct me if I'm wrong. This might indicate that both forms can use similar logic in some cases, and some functions might get refactored for a better reusability. For example checkIfOperatorIsMappedToAnotherStakingProvider function might need a refactor, so that it checks the thing for a specific app, rather than all of the apps - this could be then reused in both forms.

Last thing is that we would need to slighty refactor code for MapOperatorToStakingProviderConfirmationModal (see screenshot below). We should probably pass two operators, one for tbtc/random-beacon, and the other one for taco. Then we should display the proper cards for either all of them (for new users) or only taco (for users that already mapped random-beacon + tbtc). We should also decide if we want to allow users to still map only tbtc + random beacon without taco, which in this case we will only show those in confirmation modal. Image

threshold-network / token-dashboard

TACo specific Operator Bonding #678