Issue 487

[armandocodecr]

Description - Resolves #487

This pull request introduces significant updates and improvements to our project by migrating to the latest versions of wagmi and rainbowkit. This migration was essential to address a bug related to outdated dependencies and to enable support for Rabby Wallet, which was not available in the previously used versions.

Key Changes:

1. Migration to wagmi and rainbowkit v2:

   • Updated wagmi and rainbowkit to their latest versions as per RainbowKit's guide.
   • Required due to the deprecation of WalletConnect v1, which was shut down in June 2023.

2. Addition of Rabby Wallet:

   • Integrated support for Rabby Wallet by updating the configuration to use the new connectorsForWallets function.

3. Configuration Changes:

   • Created walletConfig.ts to centralize wallet configurations, including the project ID for WalletConnect.
   • Updated .env.local and .env.production with VITE_WALLETCONNECT_CLOUD_ID, required for the WalletConnect integration. A test project ID was used, but a permanent one should be created via WalletConnect Cloud.

4. Component Updates:

   • final-preview-step.tsx:
     • Replaced useSigner with useAccount and getWalletClient.
     • Adjusted the creation of the group to align with the new wallet handling logic.
   • add-member-modal.tsx:
     • Replaced useSigner with useAccount and getWalletClient.
     • Updated member addition logic to comply with the latest API changes.

5. Context Update:

   • AuthContextProvider:
     • Migrated from deprecated API usage to the latest context configuration with WagmiProvider and configWallets.
     • Integrated QueryClientProvider from @tanstack/react-query.

6. Dependency Updates:

   • Updated several dependencies in package.json for compatibility with the latest wagmi and rainbowkit.

References:

• Migration Guide: RainbowKit - WalletConnect v2 Migration
• Custom Wallet List: RainbowKit - Custom Wallet List

Related Issue

This PR addresses issues with outdated wallet integrations and resolves compatibility problems due to the shutdown of WalletConnect v1.

Issue link: Issue #487

Does this introduce a breaking change?

• Yes
• No

Breaking Change Details:

• New API Usage: The updated versions of wagmi and rainbowkit require new APIs (useAccount, getWalletClient). Ensure that all parts of the project are updated accordingly.
• WalletConnect Project ID: A valid project ID must be obtained and set in .env.local and .env.production for WalletConnect to function correctly.
• Wallet Configuration: Configuration for wallets is now centralized in walletConfig.ts. Review and test the new setup thoroughly.

Other information

Migration Note:

• Project ID: A project ID for WalletConnect Cloud must be obtained and set in .env.local and .env.production under the variable VITE_WALLETCONNECT_CLOUD_ID. The current setup uses a test ID which should be replaced with a valid project-specific ID.
• WalletConnect v1 Shutdown: The migration ensures compliance with the transition from WalletConnect v1 to v2, aligning with industry standards and maintaining connection capabilities.

Component Changes Summary:

• Before and After:
  • final-preview-step.tsx:
    • Before: Used deprecated methods for wallet connection and signer retrieval.
    • After: Updated to use useAccount and getWalletClient from wagmi.
  • add-member-modal.tsx:
    • Before: Utilized outdated API for signer handling.
    • After: Modified to use the latest wagmi API for wallet connection.

These updates ensure the project is compatible with the latest standards and libraries, enhancing security, functionality, and maintainability.

[vercel]

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

Name	Status	Preview	Comments	Updated (UTC)
bandada-docs	❌ Failed (Inspect)			Jun 17, 2024 6:12am
bandada-website	❌ Failed (Inspect)			Jun 17, 2024 6:12am

[vplasencia]

Hey @armandocodecr! So sorry for the late reply and thank you very much for the PR 🙏.

I think there are some errors when running yarn && yarn build. Can you see them?