Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(synapse-interface): Upgraded wagmi, viem, rainbowkit to 2.x #2458

Merged
merged 20 commits into from
Apr 17, 2024

Conversation

abtestingalpha
Copy link
Collaborator

@abtestingalpha abtestingalpha commented Apr 4, 2024

Summary by CodeRabbit

  • New Features

    • Introduced support for new blockchain networks, DFK Chain and Dogechain, enhancing connectivity and integration options.
  • Enhancements

    • Upgraded to the latest versions of key dependencies to improve stability and performance.
    • Enhanced transaction handling with updated function calls and improved gas estimation logic.
    • Streamlined the user interface by refining import statements and using more efficient hooks across various components.
  • Bug Fixes

    • Corrected the transaction status checks to use string identifiers for clarity and reliability in transaction outcomes.
    • Fixed chain variable assignments across multiple components to ensure consistency in network interactions.
  • Refactor

    • Consolidated and optimized the use of blockchain network utilities and components for better maintainability and performance.

92cab529f933121df5f6d47ad57dba2b1514954a: synapse-interface preview link
92cab529f933121df5f6d47ad57dba2b1514954a: explorer-ui preview link
aa50b6f3b4720a1d79526c7d717fc2e2cfc7b61c: explorer-ui preview link
aa50b6f3b4720a1d79526c7d717fc2e2cfc7b61c: synapse-interface preview link
4fec7b7e6fc02ef195ffd0d258ff55ccbad4e3c4: synapse-interface preview link
4fec7b7e6fc02ef195ffd0d258ff55ccbad4e3c4: explorer-ui preview link
2ffd7c42afe85aa0ddf98dae6fbe94bec17fef9e: synapse-interface preview link
2ffd7c42afe85aa0ddf98dae6fbe94bec17fef9e: explorer-ui preview link
e47c5338a10dfb7e326bbf27d57607b80c8483d3: synapse-interface preview link
e47c5338a10dfb7e326bbf27d57607b80c8483d3: explorer-ui preview link
fa1d3e83afdba1958ddd88f695133a7e8d74dcd2: synapse-interface preview link
fa1d3e83afdba1958ddd88f695133a7e8d74dcd2: explorer-ui preview link
81c7256139144adecbad7927bcdabc1989fc2986: synapse-interface preview link
2f208d2e30572e1a2e8e298e6ea8fd6998bff50e: synapse-interface preview link
2f208d2e30572e1a2e8e298e6ea8fd6998bff50e: explorer-ui preview link
4571dbcaa934a3b34ca90cdd035f6f2ced02f60a: explorer-ui preview link
4571dbcaa934a3b34ca90cdd035f6f2ced02f60a: synapse-interface preview link
29d9cd0bac99ef04d97480f85572e3cc9a23a1d7: explorer-ui preview link
29d9cd0bac99ef04d97480f85572e3cc9a23a1d7: synapse-interface preview link
0cfe97c558191e1c007296a227e82bb3dfeed9da: synapse-interface preview link
0cfe97c558191e1c007296a227e82bb3dfeed9da: explorer-ui preview link
f3625f8da694a800c41e50fbbb648b6610469796: synapse-interface preview link
f3625f8da694a800c41e50fbbb648b6610469796: explorer-ui preview link
9568f0c3276dc82b21ece51e2da8c057686cf19f: synapse-interface preview link
9568f0c3276dc82b21ece51e2da8c057686cf19f: explorer-ui preview link

Copy link
Contributor

coderabbitai bot commented Apr 4, 2024

Walkthrough

The update involves a significant overhaul of the Synapse Interface, focusing on package upgrades, import optimizations, and enhanced blockchain functionality. Notable changes include version updates for key packages, migration from @wagmi/core to viem, introduction of new chain constants, and improvements in transaction handling and utility functions.

Changes

File Path Change Summary
.../package.json Updated various packages, including next to version 14.1.3.
.../_app.tsx,
.../pages/pool/PoolBody.tsx,
.../pages/pool/[poolId].tsx,
.../pages/pools/index.tsx,
.../pages/stake/StakeCard.tsx,
.../pages/stake/[routerIndex].tsx,
.../pages/stake/index.tsx,
.../pages/state-managed-bridge/index.tsx,
.../pages/swap/index.tsx,
.../contexts/UserProvider.tsx
Updated imports and blockchain-related hooks/components.
.../pages/stake/StakeCard.tsx,
.../slices/bridge/reducer.ts,
.../slices/poolUserDataSlice.ts,
.../slices/portfolio/hooks.ts,
.../utils/actions/approveAndStake.tsx,
.../utils/actions/approveAndWithdraw.tsx,
.../utils/actions/claimStake.tsx,
.../components/Portfolio/Portfolio.tsx
Transitioned from @wagmi/core to viem for Address type and related imports.
.../constants/chains/extraWagmiChains.ts,
.../constants/chains/supportedChains.ts,
.../utils/createTransports.ts
Introduced new chain constants and utilities for expanded blockchain support.
.../utils/actions/fetchBlockNumber.tsx,
.../components/_Transaction/helpers/getTransactionReceipt.ts
Enhanced transaction and block number handling functions.

🐇✨
In the code's weave, a change does thread,
New chains to explore, as old ones are shed.
A rabbit hops through, with glee on its spree,
Updates abound, in the code sea we're free!
Hop, skip, deploy, let's see what's anew,
In the digital burrow, where bytes dance and stew. 🌟🐾


Recent Review Details

Configuration used: .coderabbit.yaml

Commits Files that changed from the base of the PR and between fadc33e and 379df9f.
Files selected for processing (3)
  • packages/synapse-interface/pages/pool/poolManagement/Withdraw.tsx (5 hunks)
  • packages/synapse-interface/pages/stake/StakeCard.tsx (3 hunks)
  • packages/synapse-interface/utils/sortTokens.ts (2 hunks)
Files skipped from review as they are similar to previous changes (2)
  • packages/synapse-interface/pages/pool/poolManagement/Withdraw.tsx
  • packages/synapse-interface/pages/stake/StakeCard.tsx
Additional comments not posted (4)
packages/synapse-interface/utils/sortTokens.ts (4)

1-1: Ensure that the import from @wagmi/core is correctly updated to reflect any changes in the library's export structure due to the upgrade.


2-2: The import of Address and zeroAddress from viem should be verified to ensure that these exports exist in the updated version of the library.


10-10: The import of wagmiConfig should be checked for compatibility with the new version of wagmi. Ensure that the structure and expected properties of wagmiConfig have not changed.

Verification successful

The structure of wagmiConfig in the updated version of wagmi has been successfully verified. The configuration is created using the createConfig function from @wagmi/core, and it includes connectors, chains, transports, and an SSR flag. This structure aligns with the expected properties for wagmiConfig to function correctly with the wagmi library.

Action Required:
No further action is required regarding the structure of wagmiConfig. The import and usage in sortTokens.ts are compatible with the current structure of wagmiConfig.

Scripts Executed

The following scripts were executed for the analysis:


Script:

#!/bin/bash
# Check the structure of `wagmiConfig` in the updated version of `wagmi`.
ast-grep --lang typescript --pattern $'export const wagmiConfig = { $$$ }' --file '@/wagmiConfig'

Length of output: 290



Script:

#!/bin/bash
# Locate the wagmiConfig file and check its structure
file_path=$(fd wagmiConfig.ts --type f --full-path)
ast-grep --lang typescript --pattern $'export const wagmiConfig = { $$$ }' $file_path

Length of output: 213



Script:

#!/bin/bash
# Display the contents of wagmiConfig.ts to manually verify its structure
cat packages/synapse-interface/wagmiConfig.ts

Length of output: 1196


81-81: The usage of multicall function with wagmiConfig as a parameter needs to be validated against the new API documentation of wagmi to ensure that the function signature and expected parameters align with the updated library version.


Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share
Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>.
    • Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai generate unit testing code for this file.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai generate interesting stats about this repository and render them as a table.
    • @coderabbitai show all the console.log statements in this repository.
    • @coderabbitai read src/utils.ts and generate unit testing code.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (invoked as PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger a review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai help to get help.

Additionally, you can add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.

CodeRabbit Configration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

Copy link

cloudflare-workers-and-pages bot commented Apr 4, 2024

Deploying sanguine-fe with  Cloudflare Pages  Cloudflare Pages

Latest commit: 379df9f
Status: ✅  Deploy successful!
Preview URL: https://f1437e6d.sanguine-fe.pages.dev
Branch Preview URL: https://fe-viem-wagmi-rainbowkit-upg.sanguine-fe.pages.dev

View logs

Copy link

cloudflare-workers-and-pages bot commented Apr 4, 2024

Deploying sanguine with  Cloudflare Pages  Cloudflare Pages

Latest commit: 379df9f
Status: ✅  Deploy successful!
Preview URL: https://64321532.sanguine.pages.dev
Branch Preview URL: https://fe-viem-wagmi-rainbowkit-upg.sanguine.pages.dev

View logs

Copy link

codecov bot commented Apr 4, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 47.05342%. Comparing base (98618a5) to head (379df9f).
Report is 6 commits behind head on master.

Additional details and impacted files
@@                 Coverage Diff                 @@
##              master       #2458         +/-   ##
===================================================
- Coverage   47.14286%   47.05342%   -0.08944%     
===================================================
  Files            388         384          -4     
  Lines          29540       29373        -167     
  Branches          83          83                 
===================================================
- Hits           13926       13821        -105     
+ Misses         14159       14102         -57     
+ Partials        1455        1450          -5     
Flag Coverage Δ
packages 90.62500% <ø> (+0.09766%) ⬆️
promexporter ?

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@abtestingalpha abtestingalpha force-pushed the fe/viem-wagmi-rainbowkit-upgrade branch from b802eea to 2e61878 Compare April 5, 2024 16:41
@abtestingalpha abtestingalpha changed the title [wip] feat(synapse-interface): upgrades wagmi, viem, rainbowkit to 2.x feat(synapse-interface): upgrades wagmi, viem, rainbowkit to 2.x Apr 5, 2024
@abtestingalpha abtestingalpha marked this pull request as ready for review April 5, 2024 20:46
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 9

Review Status

Configuration used: .coderabbit.yaml

Commits Files that changed from the base of the PR and between e02ddb5 and dd6c436.
Files ignored due to path filters (1)
  • yarn.lock is excluded by !**/*.lock
Files selected for processing (56)
  • packages/explorer-ui/package.json (1 hunks)
  • packages/synapse-constants/constants/minichef.ts (1 hunks)
  • packages/synapse-interface/README.md (1 hunks)
  • packages/synapse-interface/actions/approveErc20Token.ts (2 hunks)
  • packages/synapse-interface/actions/getErc20TokenAllowance.ts (2 hunks)
  • packages/synapse-interface/actions/harvestLpPool.ts (2 hunks)
  • packages/synapse-interface/actions/stakeLpToken.ts (2 hunks)
  • packages/synapse-interface/actions/swapPoolAddLiquidity.ts (2 hunks)
  • packages/synapse-interface/actions/swapPoolCalculateAddLiquidity.ts (2 hunks)
  • packages/synapse-interface/actions/swapPoolCalculateTokenAmount.ts (2 hunks)
  • packages/synapse-interface/actions/swapPoolRemoveLiquidity.ts (3 hunks)
  • packages/synapse-interface/actions/swapPoolRemoveLiquidityOneToken.ts (3 hunks)
  • packages/synapse-interface/actions/unstakeLpToken.ts (2 hunks)
  • packages/synapse-interface/components/Activity/Activity.tsx (1 hunks)
  • packages/synapse-interface/components/ConnectionIndicators.tsx (2 hunks)
  • packages/synapse-interface/components/Pools/PoolHeader.tsx (2 hunks)
  • packages/synapse-interface/components/Portfolio/Portfolio.tsx (2 hunks)
  • packages/synapse-interface/components/Portfolio/components/PortfolioConnectButton.tsx (2 hunks)
  • packages/synapse-interface/components/Portfolio/components/PortfolioContent.tsx (1 hunks)
  • packages/synapse-interface/components/StateManagedBridge/BridgeTransactionButton.tsx (3 hunks)
  • packages/synapse-interface/components/StateManagedBridge/InputContainer.tsx (2 hunks)
  • packages/synapse-interface/components/StateManagedBridge/OutputContainer.tsx (1 hunks)
  • packages/synapse-interface/components/StateManagedSwap/SwapInputContainer.tsx (2 hunks)
  • packages/synapse-interface/components/StateManagedSwap/SwapTransactionButton.tsx (3 hunks)
  • packages/synapse-interface/components/Wallet.tsx (3 hunks)
  • packages/synapse-interface/components/_Transaction/helpers/getTransactionReceipt.ts (1 hunks)
  • packages/synapse-interface/components/_Transaction/helpers/useIsTxReverted.ts (1 hunks)
  • packages/synapse-interface/constants/extraWagmiChains.ts (3 hunks)
  • packages/synapse-interface/constants/minichef.ts (1 hunks)
  • packages/synapse-interface/contexts/SegmentAnalyticsProvider.tsx (2 hunks)
  • packages/synapse-interface/contexts/UserProvider.tsx (2 hunks)
  • packages/synapse-interface/ethers.ts (3 hunks)
  • packages/synapse-interface/next.config.js (1 hunks)
  • packages/synapse-interface/package.json (4 hunks)
  • packages/synapse-interface/pages/_app.tsx (1 hunks)
  • packages/synapse-interface/pages/pool/PoolBody.tsx (3 hunks)
  • packages/synapse-interface/pages/pool/[poolId].tsx (2 hunks)
  • packages/synapse-interface/pages/pool/poolManagement/Deposit.tsx (6 hunks)
  • packages/synapse-interface/pages/pool/poolManagement/DepositButton.tsx (3 hunks)
  • packages/synapse-interface/pages/pool/poolManagement/Withdraw.tsx (3 hunks)
  • packages/synapse-interface/pages/pool/poolManagement/WithdrawButton.tsx (3 hunks)
  • packages/synapse-interface/pages/pool/poolManagement/index.tsx (1 hunks)
  • packages/synapse-interface/pages/pools/PoolCard.tsx (1 hunks)
  • packages/synapse-interface/pages/pools/index.tsx (2 hunks)
  • packages/synapse-interface/pages/stake/StakeCard.tsx (2 hunks)
  • packages/synapse-interface/pages/stake/[routerIndex].tsx (2 hunks)
  • packages/synapse-interface/pages/stake/index.tsx (2 hunks)
  • packages/synapse-interface/pages/state-managed-bridge/index.tsx (5 hunks)
  • packages/synapse-interface/pages/swap/index.tsx (4 hunks)
  • packages/synapse-interface/slices/bridge/reducer.ts (1 hunks)
  • packages/synapse-interface/slices/poolUserDataSlice.ts (1 hunks)
  • packages/synapse-interface/slices/portfolio/hooks.ts (2 hunks)
  • packages/synapse-interface/utils/actions/approveAndStake.tsx (3 hunks)
  • packages/synapse-interface/utils/actions/approveAndWithdraw.tsx (1 hunks)
  • packages/synapse-interface/utils/actions/claimStake.tsx (1 hunks)
  • packages/synapse-interface/utils/actions/fetchBlockNumber.tsx (1 hunks)
Files not processed due to max files limit (16)
  • packages/synapse-interface/utils/actions/fetchPortfolioBalances.tsx
  • packages/synapse-interface/utils/actions/getCorePoolData.ts
  • packages/synapse-interface/utils/actions/getPoolApyData.ts
  • packages/synapse-interface/utils/actions/getPoolData.ts
  • packages/synapse-interface/utils/actions/getPrices.ts
  • packages/synapse-interface/utils/actions/getStakedBalance.ts
  • packages/synapse-interface/utils/actions/getTokenAllowance.ts
  • packages/synapse-interface/utils/actions/withdrawStake.tsx
  • packages/synapse-interface/utils/approveToken.tsx
  • packages/synapse-interface/utils/contracts/useContracts.tsx
  • packages/synapse-interface/utils/hooks/usePortfolioListener.ts
  • packages/synapse-interface/utils/hooks/useTokenBalance.tsx
  • packages/synapse-interface/utils/hooks/useTransactionListener.ts
  • packages/synapse-interface/utils/providers/SynapseProvider.tsx
  • packages/synapse-interface/utils/sortTokens.ts
  • packages/synapse-interface/wagmiConfig.ts
Files skipped from review due to trivial changes (1)
  • packages/synapse-interface/components/StateManagedBridge/OutputContainer.tsx
Additional comments not posted (61)
packages/synapse-interface/actions/getErc20TokenAllowance.ts (1)

1-4: LGTM! The updated imports and the inclusion of wagmiConfig in the readContract call align with the PR's objectives of upgrading libraries and refactoring the codebase.

packages/synapse-interface/actions/swapPoolCalculateAddLiquidity.ts (1)

5-5: LGTM! The addition of wagmiConfig and its usage in the readContract call are correctly implemented to align with the upgraded library requirements.

packages/synapse-interface/actions/swapPoolCalculateTokenAmount.ts (1)

5-5: LGTM! The addition of wagmiConfig and its usage in the readContract call are correctly implemented to align with the upgraded library requirements.

packages/synapse-interface/components/_Transaction/helpers/getTransactionReceipt.ts (1)

8-14: LGTM! The switch to using supportedChains and accepting chainId as a parameter aligns with the PR's objectives and the updated library requirements.

packages/synapse-interface/actions/harvestLpPool.ts (1)

2-9: LGTM! The updated imports and function calls, including the use of simulateContract, waitForTransactionReceipt, and wagmiConfig, align with the PR's objectives of upgrading libraries and refactoring the codebase.

packages/synapse-interface/actions/stakeLpToken.ts (1)

2-9: LGTM! The updated imports and function calls, including the use of simulateContract, waitForTransactionReceipt, and wagmiConfig, align with the PR's objectives of upgrading libraries and refactoring the codebase.

packages/synapse-interface/actions/unstakeLpToken.ts (1)

2-9: LGTM! The updated imports and function calls, including the use of simulateContract, waitForTransactionReceipt, and wagmiConfig, align with the PR's objectives of upgrading libraries and refactoring the codebase.

packages/synapse-constants/constants/minichef.ts (1)

1-1: The update to import Address from viem aligns with the PR's objective to consolidate type imports. Ensure all references to Address throughout the project have been updated accordingly.

packages/synapse-interface/constants/minichef.ts (1)

1-3: The updates to import Address from viem and adjust the import path for ALL_CHAINS are consistent with the PR's objectives. Ensure all related references are updated accordingly.

packages/synapse-interface/constants/extraWagmiChains.ts (1)

34-34: Confirm that the removal of specific blockchain configurations aligns with the project's current and future requirements.

Ensure that the removal of these configurations does not impact any existing functionalities or integrations.

packages/synapse-interface/contexts/SegmentAnalyticsProvider.tsx (2)

7-7: Consider verifying the correct import path for wagmiConfig to ensure it aligns with the project's structure and conventions.


25-25: Ensure that the getAccount function from @wagmi/core is compatible with the wagmiConfig parameter, especially in the context of the upgraded library versions. This is crucial for maintaining the integrity of account-related analytics events.

packages/synapse-interface/utils/actions/claimStake.tsx (1)

1-1: The change in the import of the Address type from @wagmi/core to viem aligns with the PR's objective to upgrade and refactor for new library versions. Ensure that all instances where the Address type is used have been updated accordingly to maintain type consistency across the project.

packages/synapse-interface/pages/stake/[routerIndex].tsx (2)

1-1: The modification to use useAccount instead of useNetwork for determining the connected chain aligns with the updated API from the upgraded libraries. This change is a good adaptation to the new library versions.


27-27: Ensure that the chain object obtained from useAccount is used consistently throughout the component, especially in contexts where chain-specific logic or rendering is required. This is crucial for maintaining correct functionality across different blockchain networks.

packages/synapse-interface/ethers.ts (2)

3-5: The addition of wagmiConfig and its usage in getPublicClient and getWalletClient function calls is a significant change that aligns with the PR's objective to upgrade and refactor for new library versions. Ensure that wagmiConfig is correctly configured and that its usage here is consistent with the upgraded library's requirements.


26-27: Verify that the getEthersProvider function correctly handles the publicClient obtained from getPublicClient with the wagmiConfig parameter, especially in the context of the upgraded library versions. This is crucial for maintaining the integrity of Ethereum provider initialization.

packages/synapse-interface/pages/pool/poolManagement/index.tsx (1)

2-2: The change in the import of the Address type from @wagmi/core to viem aligns with the PR's objective to upgrade and refactor for new library versions. Ensure that all instances where the Address type is used have been updated accordingly to maintain type consistency across the project.

packages/synapse-interface/slices/poolUserDataSlice.ts (1)

3-3: The change in the import of the Address type from @wagmi/core to viem aligns with the PR's objective to upgrade and refactor for new library versions. Ensure that all instances where the Address type is used have been updated accordingly to maintain type consistency across the project.

packages/synapse-interface/README.md (1)

27-27: Clarify the intention behind changing the Node.js version requirement to exactly "18.17.0".

Is this change intended to enforce a strict version requirement due to specific dependencies, or could it potentially be broadened for greater flexibility?

packages/synapse-interface/components/Pools/PoolHeader.tsx (1)

4-5: LGTM! The changes to use useAccount instead of useNetwork and import Address from 'viem' align with the PR objectives and improve consistency.

packages/synapse-interface/contexts/UserProvider.tsx (1)

15-26: > 📝 NOTE

This review was outside the diff hunks and was mapped to the diff hunk with the greatest overlap. Original lines [2-23]

LGTM! The introduction of useAccountEffect and the adjustments in destructuring useAccount are well-aligned with the PR's objectives and likely enhance the component's functionality.

packages/synapse-interface/slices/portfolio/hooks.ts (1)

11-17: > 📝 NOTE

This review was outside the diff hunks and was mapped to the diff hunk with the greatest overlap. Original lines [14-84]

LGTM! The addition of wagmiConfig and its usage in getAccount(wagmiConfig) align with the PR's objectives and ensure compatibility with the updated libraries.

packages/synapse-interface/pages/pool/[poolId].tsx (1)

1-7: > 📝 NOTE

This review was outside the diff hunks and was mapped to the diff hunk with the greatest overlap. Original lines [4-42]

LGTM! The update to use useAccount instead of useNetwork for the chain variable aligns with the PR's objectives and enhances the page's functionality.

packages/synapse-interface/components/Portfolio/components/PortfolioConnectButton.tsx (1)

1-8: > 📝 NOTE

This review was outside the diff hunks and was mapped to the diff hunk with the greatest overlap. Original lines [3-67]

LGTM! The switch to switchChain from switchNetwork and the inclusion of wagmiConfig in the switchChain call align with the PR's objectives and likely improve the component's functionality.

packages/synapse-interface/utils/actions/approveAndWithdraw.tsx (1)

9-9: LGTM! The change in the import source for Address from 'wagmi' to 'viem' aligns with the PR's objectives and enhances consistency across the project.

packages/synapse-interface/utils/actions/approveAndStake.tsx (1)

30-36: > 📝 NOTE

This review was outside the diff hunks and was mapped to the diff hunk with the greatest overlap. Original lines [1-96]

LGTM! The change in the import source for Address from 'wagmi' to 'viem' and the removal of explicit TransactionReceipt type declarations align with the PR's objectives and simplify the code without losing clarity or functionality.

packages/synapse-interface/pages/pool/poolManagement/WithdrawButton.tsx (2)

15-16: Ensure the chain object obtained from useAccount is correctly utilized throughout the component, especially in conditions that depend on the chain ID.


20-20: The use of useAccountEffect for handling disconnection is appropriate. Ensure that other account-related effects, if any, are also managed within this hook to maintain consistency.

packages/synapse-interface/package.json (3)

32-32: Upgrading @rainbow-me/rainbowkit to version 2.0.4 is in line with the PR objectives. Ensure that the application is tested thoroughly with this version as major version upgrades can introduce breaking changes.


40-40: The addition of @tanstack/react-query version 4.28.0 is necessary for compatibility with RainbowKit 2.0. Verify that all instances where data fetching and caching are used have been migrated to use react-query where applicable.

Verification successful

Given the corrected script did not produce any output, it suggests that there are no instances of the old data fetching pattern using fetch( in the JavaScript files of the codebase. This could indicate that the migration to use react-query for data fetching and caching, as necessitated by the addition of @tanstack/react-query version 4.28.0 for compatibility with RainbowKit 2.0, has been completed or that the initial usage of such patterns was absent.

Scripts Executed

The following scripts were executed for the analysis:


Script:

#!/bin/bash
# Search for old data fetching patterns that should now use react-query.
rg --type js "fetch("

Length of output: 86



Script:

#!/bin/bash
# Corrected search for old data fetching patterns that should now use react-query.
rg --type js "fetch\("

Length of output: 24


56-56: Upgrading next to version 14.1.3 is crucial for compatibility with the new library versions. Ensure that the Next.js specific features such as SSR, SSG, and API routes are tested for any potential issues introduced by the upgrade.

packages/synapse-interface/pages/stake/index.tsx (1)

17-17: Switching from useNetwork to useAccount for obtaining connectedChain is consistent with the library upgrades. Ensure that the logic depending on the connected chain ID functions correctly across the component.

packages/synapse-interface/components/ConnectionIndicators.tsx (1)

49-49: Passing wagmiConfig as the first argument to switchChain is a significant change. Ensure that wagmiConfig is correctly configured and available in the scope where switchChain is called.

packages/synapse-interface/pages/pools/index.tsx (1)

21-21: Switching from useNetwork to useAccount for obtaining chain is consistent with the library upgrades. Ensure that the logic depending on the connected chain ID functions correctly across the component.

packages/synapse-interface/pages/pool/poolManagement/DepositButton.tsx (1)

18-19: Switching to useAccount and useSwitchChain for account and chain management aligns with the library upgrades. Ensure that the logic for handling connection status and chain switching is correctly implemented throughout the component.

packages/synapse-interface/components/StateManagedBridge/InputContainer.tsx (1)

45-45: Switching from useNetwork to useAccount for obtaining chain is consistent with the library upgrades. Ensure that the logic depending on the connected chain ID functions correctly across the component.

packages/synapse-interface/components/Portfolio/components/PortfolioContent.tsx (1)

2-2: LGTM!
Ensure the Address type from 'viem' is fully compatible with its usage throughout the codebase.

packages/synapse-interface/components/StateManagedSwap/SwapInputContainer.tsx (1)

3-3: LGTM!
Ensure the chain object structure provided by useAccount is compatible with its usage throughout the component.

packages/synapse-interface/components/StateManagedBridge/BridgeTransactionButton.tsx (1)

6-6: LGTM!
Ensure the new hooks useAccountEffect and useSwitchChain are used correctly and their functionalities are fully compatible with the component's requirements.

packages/synapse-interface/pages/pool/PoolBody.tsx (1)

3-3: LGTM!
Ensure the Address type from 'viem' and the useSwitchChain hook are fully compatible with their usage in the component.

packages/synapse-interface/components/Wallet.tsx (1)

3-3: LGTM!
Ensure the chain object structure provided by useAccount is compatible with its usage throughout the component.

packages/synapse-interface/pages/_app.tsx (1)

1-219: LGTM!
Ensure the new QueryClient and the adjusted provider components are correctly implemented and fully integrated with the rest of the application.

packages/synapse-interface/components/Activity/Activity.tsx (1)

5-5: LGTM!
Ensure the Address type from 'viem' is fully compatible with its usage throughout the codebase.

packages/synapse-interface/components/Portfolio/Portfolio.tsx (1)

4-4: LGTM!
Ensure the Address type from 'viem' and the new hooks useAccount and useAccountEffect are fully compatible with their usage in the component.

packages/synapse-interface/pages/pools/PoolCard.tsx (1)

2-2: Replace the import of Address from 'wagmi' with 'viem' to align with the new library versions.

packages/synapse-interface/pages/pool/poolManagement/Deposit.tsx (3)

47-48: Ensure the newly imported Address type from 'viem' and wagmiConfig are correctly utilized throughout the file.


205-205: Correctly replaced waitForTransaction with waitForTransactionReceipt to align with the updated library functions. Verify that wagmiConfig is correctly passed as a parameter.


337-337: The replacement of fetchBalance with getBalance and the use of wagmiConfig is appropriate. Ensure that wagmiConfig is correctly configured to work with the new function calls.

packages/synapse-interface/pages/pool/poolManagement/Withdraw.tsx (3)

5-6: The replacement of the import for Address from 'wagmi' to 'viem' is consistent with the library upgrades. Ensure that the Address type is used correctly in the context of the new import.


40-40: The addition of wagmiConfig import is necessary for the updated function calls. Verify that wagmiConfig is correctly utilized in the context of waitForTransactionReceipt.


229-229: Correctly updated the waitForTransaction call to waitForTransactionReceipt and ensured wagmiConfig is passed as a parameter. This change aligns with the updated library functions.

packages/synapse-interface/pages/swap/index.tsx (4)

18-18: The replacement of waitForTransaction with waitForTransactionReceipt is appropriate for the updated library usage. Ensure that all instances of transaction waiting are updated accordingly.


42-42: The addition of wagmiConfig import is necessary for the updated function calls. Verify that wagmiConfig is correctly utilized in the context of getWalletClient and waitForTransactionReceipt.


260-260: Ensure that wagmiConfig is correctly passed as a parameter to getWalletClient to align with the updated library functions.


294-294: Correctly updated the waitForTransaction call to waitForTransactionReceipt and ensured wagmiConfig is passed as a parameter. This change aligns with the updated library functions.

packages/synapse-interface/pages/stake/StakeCard.tsx (2)

2-2: The replacement of the import for Address from 'wagmi' to 'viem' is consistent with the library upgrades. Ensure that the Address type is used correctly in the context of the new import.


382-383: The modification of the condition check from tx?.status === 1 to tx?.status === 'success' aligns with the updated transaction status handling. Verify that this change correctly reflects the expected transaction outcomes.

packages/synapse-interface/slices/bridge/reducer.ts (1)

2-2: The import statement for the Address type has been updated to use 'viem' instead of 'wagmi'. Ensure that the Address type from 'viem' is fully compatible with its usage throughout this file.

packages/synapse-interface/pages/state-managed-bridge/index.tsx (2)

2-30: The import statements have been updated, with some additions and removals to reflect the changes in the component's dependencies. Ensure that all added imports are used within the component and that the removal of unused imports does not affect functionality.


386-399: > 📝 NOTE

This review was outside the diff hunks and was mapped to the diff hunk with the greatest overlap. Original lines [352-457]

The function calls and logic related to gas estimation and transaction execution have been updated and refactored. Verify that these changes correctly implement the updated APIs and requirements of the upgraded libraries, and test to ensure they do not negatively impact performance or functionality.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

packages/synapse-interface/pages/_app.tsx Outdated Show resolved Hide resolved
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

@abtestingalpha abtestingalpha changed the title feat(synapse-interface): upgrades wagmi, viem, rainbowkit to 2.x feat(synapse-interface): Upgrading wagmi, viem, rainbowkit to 2.x Apr 16, 2024
@abtestingalpha abtestingalpha changed the title feat(synapse-interface): Upgrading wagmi, viem, rainbowkit to 2.x feat(synapse-interface): Upgraded wagmi, viem, rainbowkit to 2.x Apr 16, 2024
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

packages/synapse-interface/pages/_app.tsx Show resolved Hide resolved
@abtestingalpha abtestingalpha force-pushed the fe/viem-wagmi-rainbowkit-upgrade branch from 00efe3e to 5b3e045 Compare April 17, 2024 13:05
@abtestingalpha abtestingalpha force-pushed the fe/viem-wagmi-rainbowkit-upgrade branch from 5b3e045 to 379df9f Compare April 17, 2024 13:27
@abtestingalpha abtestingalpha merged commit 76349ab into master Apr 17, 2024
43 checks passed
@abtestingalpha abtestingalpha deleted the fe/viem-wagmi-rainbowkit-upgrade branch April 17, 2024 13:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant