[Playground] Integration of the wallet extension and playground

[ukorvl]

Right now we are able to use only built-in wallet in the playground.
Motivation - usage of external wallet extension would be very beneficial for developers on nil and users, allowing them to use one wallet in different projects and environments.

This is a large issue, including several tasks

• A basic way of connecting wallet extension and react application. We already have an example in academy
• Change of business logic layer in playground app
• Ensure extension works with playground and tutorials also
• Add a convenient way of switching between built-in and extension wallets
• Small adjustments to design.
  • When user don't have a created built-in wallet and extension is not connected we should show a button which will allow to choose wallet to connect.
  • When one of the wallets is connected there should be probably a button-icon near the wallet panel allowing to switch between wallets

[ukorvl]

Small adjustments to design.
When user don't have a created built-in wallet and extension is not connected we should show a button which will allow to choose wallet to connect.
When one of the wallets is connected there should be probably a button-icon near the wallet panel allowing to switch between wallets

@mdaria17 what do you think about this part, is it correct from the UX POV?

[mdaria17]

Hey! Here is a link to the Figma file with the flow

Plus, I attached a video with the explanation of how it is supposed to work

Smart.account.and.wallet.extension.switching.mov

[ukorvl]

@gitshreevatsa here is a video with demo of extension wallet connection and switching!

[khannanov-nil]

Relates to #777. Me and @gitshreevatsa chose to proceed as was originally planned. @gitshreevatsa will handle the entire wallet integration flow including the relevant UI changes in the account pane. I will handle all other UI changes.