Login with Unstoppable Domains

Added Login with Unstoppable which allows 300k+ users to log in to dapps with their human readable NFT domain (like brian.crypto) username as opposed to a cryptocurrency address.

Related Issue

https://github.com/GetAlluo/decentralised-app/issues/56

How Has This Been Tested?

This was tested locally

https://user-images.githubusercontent.com/109177105/201004354-90add7ce-74ba-412c-9feb-8f31413222c6.mov

Resolution with Unstoppable Domains

Added Resolution with Unstoppable Domains to use/display the NFT domain instead of a lengthy hexadecimal address

Related Issue

https://github.com/GetAlluo/decentralised-app/issues/57

How Has This Been Tested?

This was tested locally

https://user-images.githubusercontent.com/109177105/207958569-d4cb2fba-0db5-4bdc-9c78-37c9b5db0646.mov

Bumps decode-uri-component from 0.2.0 to 0.2.2.

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Is your feature request related to a problem? Please describe. To help with tracking progress and help with analytics, we would like to setup some event tracking on the main dapp. To do this we need to add a few custom events (https://help.heap.io/definitions/events/events-overview/#how-many-events-should-i-define) this can be done using the heap SDK: https://developers.heap.io/reference/track

Describe the solution you'd like Here is a list of custom events needed: General events:

• when onboards.js is connected: heap.track('walletConnected', {walletType: '{type of wallet, like metamask}', chain: '{what chain the user is connected to like mainnet or polygon}'});

Farm

• [ ] when the farm button is clicked by a user: heap.track('clickFarm', {pool: '{Ib or boost}', currency: '{usd or eur or cvx/eth}'});
• [ ] when the user has stopped typing in the deposit box: heap.track('startedDepositing', {pool: '{Ib or boost}', currency: '{usd or eur or cvx/eth}', amount: '{just the amount typed}'});
• [ ] when the user approves transaction is mined: heap.track('approvedTransactionMined', {pool: '{Ib or boost}', currency: '{usd or eur or cvx/eth}', amount: '{just the amount approved}'});
• [ ] when the user deposit transaction is mined: heap.track('depositTransactionMined', {pool: '{Ib or boost}', currency: '{usd or eur or cvx/eth}', amount: '{just the amount deposited}'});

Autoinvest

• [ ] when the autoinvest modal is opened: heap.track('clickAutoinvest');
• [ ] when the user has selected a token: heap.track('autoInvestTokenSelected', {token: '{name of the token selected}'});
• [ ] when the user has stopped typing in the deposit box: heap.track('startedAutoinvestDeposit', token: '{usdc or eurj or cvx/eth}', amount: '{just the amount typed}'});
• [ ] when the user approves transaction to ricochet is mined: heap.track('approvedTransactionMined', {pool: '{Ib or boost}', currency: '{usd or eur or cvx/eth}', amount: '{just the amount approved}'});
• [ ] when the user deposit transaction is mined: heap.track('depositTransactionMined', {pool: '{Ib or boost}', currency: '{usd or eur or cvx/eth}', amount: '{just the amount deposited}'});

Transfer

• [ ] when the transfer page is opened: heap.track('transfer');
• [ ] when the user has stopped typing in the amount box: heap.track('transferAmount', {amount: '{just the amount typed}'});
• [ ] when the user has stopped typing in the recipient box: heap.track('transferRecipient');
• [ ] when the user clicks the transfer button: heap.track('transferButtonClicked');

Stake

• [ ] when the stake page is opened: heap.track('stake');
• [ ] when the user has stopped typing in the amount box: heap.track('stakeLockAmount', {amount: '{just the amount typed}'});
• [ ] when the user clicks the stake button: heap.track('stakeLockButtonClicked');
• [ ] when the user has stopped typing in the amount box: heap.track('stakeLockAmount', {amount: '{just the amount typed}'});
• [ ] when the user has stopped the slider on an amount: heap.track('stakeUnlockAmount', {amount: '{just the amount typed}'});
• [ ] when the user clicks the stake button: heap.track('stakeUnlockButtonClicked');

Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered.

Additional context Add any other context or screenshots about the feature request here.

Is your feature request related to a problem? Please describe. We should be able to integrate the Resolution library of Unstoppable domains in the Transfer page, so instead of putting addresses, the user is able to simply put a domain main ie. 0xtuytuy.crypto and the webapp should be able to resolve the owner of the NFT and send the funds to that address.

Describe the solution you'd like We should be able to use this library: https://docs.unstoppabledomains.com/developer-toolkit/resolution-integration-methods/resolution-libraries/resolution/

Keep in mind that the asset transfer page is today only on Polygon, we should therefore make sure that the domain is available on Polygon.

On the UI side, the domain or a 0x address should be the only valid inputs, we should not overwrite the text the user enters.

We should keep the validation if a user tries to enter something else but a 0x address or a .nft, .x, .bitcoin, .dao, .888, .zil, .crypto, .wallet, .blockchain the error message should say:

Recipient address or domain name is not valid

Describe alternatives you've considered NA

Additional context NA

Is your feature request related to a problem? Please describe. This would allow Unstoppable Domain owners to login into our webapp with a native login. It should be a simple module to add to our integrations. Hopefully would open up our target user pool.

Describe the solution you'd like Here is a set way to integrate with Unstoppable Domain: https://docs.unstoppabledomains.com/login-with-unstoppable/login-integration-guides/web3-onboard-guide/

Should be pretty straight forward to add it as a module. Whom ever does this task please get in touch with me regarding REACT_APP_CLIENT_ID REACT_APP_REDIRECT_URI REACT_APP_FALLBACK_ISSUER

Describe alternatives you've considered NA

Additional context NA

Describe the bug Today there is no HMAC identity verification on our webapp. This could lead to some someone viewing the conversation of some of our customers.

To Reproduce Undisclosed on here to avoid black hats

Expected behavior There should be no way fo an unauthorized server to view the conversation we have with a customer.

Screenshots NA

Desktop (please complete the following information): NA

Smartphone (please complete the following information): NA

Additional context This can be fixed by implementing the following checks: https://developers.intercom.com/installing-intercom/docs/enable-identity-verification-on-your-web-product

Is your feature request related to a problem? Please describe. We use Intercom to communicate with our customers on chat, we would also like to use Intercom to help customers understand what the app does with a product tour. This needs to be driven by custom events that the app will send to intercom informing intercom what is happening on the app so that the product tour can then be built on these custom events.

Describe the solution you'd like We need to install this library: https://developers.intercom.com/installing-intercom/docs/basic-javascript in the webapp.

We then need to add an event like this: https://developers.intercom.com/installing-intercom/docs/intercom-javascript#intercomtrackevent

the name of the event should be 'connected-wallet' this event should be sent to intercom when the user has finished connecting his wallet (metamaks or other wallet supported)

Describe alternatives you've considered best product tour really...

Additional context Add any other context or screenshots about the feature request here.