feat: TransactionButton component and others

[luchobonatti]

Closes #31

Description:

• Added a new development mode option to the environment configuration.
• Added a new hook called useWeb3Status for managing web3 connection status and actions.
• Optimized the chains configuration for development mode.
• Updated the ConnectWalletButton component to accept a label prop.
• Added a new type utility called RequiredNonNull.
• Added TransactionButton component for handling transactions.
• Added a demo for the TransactionButton component on the index page.

UPDATE:

I made some final modifications to the txButton. I believe this approach is the best.

• I added a fallback prop (similar to what we use in Suspense), which defaults to ConnectWallet.
• I added a chain prop to show or hide the “Switch to {chain}” message and change the button’s action accordingly.
• I added a labelSending prop to change the text when the transaction is pending.

Steps:

The transactions can be tested in Sepolia network If wallet is not connected displays ConnectButton

Type of change:

• [x] New feature
• [ ] Bug fix
• [ ] Breaking change
• [ ] Enhancement
• [ ] Refactoring
• [ ] Chore

How Has This Been Tested?

• [x] Manual testing
• [ ] Automated tests
• [ ] Other (explain)

Remember to check that:

• Your code follows the style guidelines of this project
• You have performed a self-review of your code
• You have commented your code in hard-to-understand areas
• You have made corresponding changes to the documentation
• Your changes generate no new warnings

Screenshots

(Add screenshots or videos to help test this pull request)

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
dappbooster	✅ Ready (Inspect)	Visit Preview	Jul 2, 2024 4:46pm

[luchobonatti]

• Added a demo for the TransactionButton component on the index page.

Beautiful code!

I'm not connected, but I'm getting this ... instead of the "connect your wallet" message.

I lost the ability to switch networks from the modal:

I changed to Sepolia from the wallet, and got this:

I wasn't able to test it but, boy, it looks promising!!

oh, it seems like you don't set the dev mode on true. I hardcoded the contracts address in the demo file, it only works on Sepolia. Let me see what happened.

[fernandomg]

oh, it seems like you don't set the dev mode on true.

aaaaah!! I see 🫠