[Gateway] - FE Fixes for non-MM users #1690
Conversation
|
Warning Rate Limit Exceeded@Jennievon has exceeded the limit for the number of files or commits that can be reviewed per hour. Please wait 8 minutes and 24 seconds before requesting another review. How to resolve this issue?After the wait time has elapsed, a review can be triggered using the @coderabbitai review command. Alternatively, push new commits to this PR. We recommend that you space out your commits to avoid hitting the rate limit. How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. WalkthroughThe recent updates to the wallet extension's frontend involve enhancing error handling by changing thrown errors from Changes
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 X ? TipsChat with CodeRabbit Bot (
|
…nnifer/2584-gateway-frontend-improvement-before-testnet-release
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Review Status
Actionable comments generated: 6
Configuration used: CodeRabbit UI
Files selected for processing (6)
- tools/walletextension/frontend/src/api/ethRequests.ts (5 hunks)
- tools/walletextension/frontend/src/components/modules/common/connect-wallet.tsx (3 hunks)
- tools/walletextension/frontend/src/components/modules/home/disconnected.tsx (3 hunks)
- tools/walletextension/frontend/src/lib/utils.ts (2 hunks)
- tools/walletextension/frontend/src/services/ethService.ts (2 hunks)
- tools/walletextension/frontend/src/services/useGatewayService.ts (1 hunks)
Additional comments: 13
tools/walletextension/frontend/src/api/ethRequests.ts (1)
- 39-45: > Note: This review was outside the patches, so it was mapped to the patch with the greatest overlap. Original lines [39-116]
The PR description mentions that one of the objectives is to prompt users to install MetaMask if it's not present. However, the provided hunks do not show this functionality. Please verify if these changes are included elsewhere in the PR.
tools/walletextension/frontend/src/components/modules/common/connect-wallet.tsx (3)
6-6: The import of
downloadMetaMaskandethereumaligns with the PR's objective to handle non-MetaMask users by prompting them to install MetaMask if necessary.15-21: The conditional logic in the
onClickevent handler is well-implemented to handle user interactions based on the presence ofethereum. It ensures that the correct function is called depending on whether the user has MetaMask installed and whether the wallet is connected.32-32: The button text dynamically changes to prompt the user to either "Connect" or "Install" MetaMask, which is a good user experience practice, making the interface intuitive for both MetaMask users and non-users.
tools/walletextension/frontend/src/components/modules/home/disconnected.tsx (3)
19-19: The addition of the
downloadMetaMaskandethereumimports aligns with the PR's objective to handle non-MetaMask users.107-114: The conditional logic in the
onClickhandler to either connect to the Ten Testnet or prompt the installation of MetaMask is a good implementation of the PR's objectives.104-117: > Note: This review was outside the patches, so it was mapped to the patch with the greatest overlap. Original lines [16-117]
Overall, the changes in
disconnected.tsxare consistent with the PR's objectives and do not introduce any apparent issues.tools/walletextension/frontend/src/lib/utils.ts (3)
42-48: The null check for
ethereuminisTenChainis a good addition to prevent runtime errors in non-MetaMask environments.55-57: The
downloadMetaMaskfunction is correctly implemented to open the MetaMask download page in a new tab, with a check forwindowto ensure SSR compatibility.52-53: Verify that the newly exported
ethereumobject fromutils.tsis used consistently and does not cause any side effects in the application.
The usage of the newly exported
ethereumobject fromutils.tshas been verified across several files without any apparent side effects. The changes appear to be consistent with the PR's objectives.tools/walletextension/frontend/src/services/ethService.ts (3)
- 50-56: The change to return the
showToastcall in thehandleEthereumfunction is consistent with the PR objectives. Ensure that the callers ofhandleEthereumare updated to handle the returned value if they expect a void return type.
The verification process did not find any calls to
handleEthereum, indicating that there are no issues with how the returned value is handled in the current codebase.
96-101: The addition of a
showToastcall in theformatAccountsfunction to indicate the success of updating account authentication status aligns with the PR objectives. Ensure that this message is appropriate and does not introduce any side effects, such as being called multiple times in a loop or in rapid succession.50-56: > Note: This review was outside the patches, so it was mapped to the patch with the greatest overlap. Original lines [1-102]
Overall, the changes in
ethService.tsare consistent with the PR objectives and the AI-generated summary. No further issues are identified in the provided hunk.
| } catch (error: any) { | ||
| showToast(ToastType.DESTRUCTIVE, `${error.message}`); | ||
| showToast(ToastType.DESTRUCTIVE, `${error}`); | ||
| throw error; |
There was a problem hiding this comment.
The showToast function is being passed the entire error object, which may not result in a user-friendly message. Consider using error.message to ensure that the toast displays a meaningful error message to the user.
- showToast(ToastType.DESTRUCTIVE, `${error}`);
+ showToast(ToastType.DESTRUCTIVE, error.message || 'An unknown error occurred');Committable suggestion
❗ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.
| } catch (error: any) { | |
| showToast(ToastType.DESTRUCTIVE, `${error.message}`); | |
| showToast(ToastType.DESTRUCTIVE, `${error}`); | |
| throw error; | |
| } catch (error: any) { | |
| showToast(ToastType.DESTRUCTIVE, error.message || 'An unknown error occurred'); | |
| throw error; |
| @@ -39,7 +39,7 @@ const typedData = { | |||
|
|
|||
| export const switchToTenNetwork = async () => { | |||
| if (!ethereum) { | |||
| throw new Error("No ethereum object found"); | |||
| throw "No ethereum object found"; | |||
There was a problem hiding this comment.
The change from throwing an Error object to a string literal may impact error handling logic downstream that relies on properties of Error objects. Consider throwing a new Error with a message instead to maintain consistency with error object properties.
- throw "No ethereum object found";
+ throw new Error("No ethereum object found");Committable suggestion
❗ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.
| throw "No ethereum object found"; | |
| throw new Error("No ethereum object found"); |
| @@ -55,7 +55,7 @@ | |||
|
|
|||
| export const connectAccounts = async () => { | |||
| if (!ethereum) { | |||
| throw new Error("No ethereum object found"); | |||
| throw "No ethereum object found"; | |||
There was a problem hiding this comment.
This comment is the same as the previous one. Ensure that the error handling logic is consistent across the application by throwing Error objects instead of string literals.
- throw "No ethereum object found";
+ throw new Error("No ethereum object found");Committable suggestion
❗ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.
| throw "No ethereum object found"; | |
| throw new Error("No ethereum object found"); |
| @@ -69,7 +69,7 @@ | |||
|
|
|||
| export const getSignature = async (account: string, data: any) => { | |||
| if (!ethereum) { | |||
| throw new Error("No ethereum object found"); | |||
| throw "No ethereum object found"; | |||
There was a problem hiding this comment.
As with the previous instances, throwing a string literal here can lead to issues with error handling that expects an Error object.
- throw "No ethereum object found";
+ throw new Error("No ethereum object found");Committable suggestion
❗ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.
| throw "No ethereum object found"; | |
| throw new Error("No ethereum object found"); |
| @@ -78,7 +78,7 @@ | |||
| }); | |||
| } catch (error) { | |||
| console.error(error); | |||
| throw new Error("Failed to get signature"); | |||
| throw "Failed to get signature"; | |||
There was a problem hiding this comment.
The thrown string literal here should be replaced with an Error object to ensure that any error handling expecting an Error object can function correctly.
- throw "Failed to get signature";
+ throw new Error("Failed to get signature");Committable suggestion
❗ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.
| throw "Failed to get signature"; | |
| throw new Error("Failed to get signature"); |
| @@ -110,7 +110,7 @@ | |||
|
|
|||
| export async function addNetworkToMetaMask(rpcUrls: string[]) { | |||
| if (!ethereum) { | |||
| throw new Error("No ethereum object found"); | |||
| throw "No ethereum object found"; | |||
There was a problem hiding this comment.
Again, it's important to throw Error objects to maintain consistency in error handling throughout the application.
- throw "No ethereum object found";
+ throw new Error("No ethereum object found");Committable suggestion
❗ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.
| throw "No ethereum object found"; | |
| throw new Error("No ethereum object found"); |
There was a problem hiding this comment.
Review Status
Actionable comments generated: 0
Configuration used: CodeRabbit UI
Files ignored due to filter (1)
- tools/walletextension/api/static/favicon.ico
Files selected for processing (1)
- tools/walletextension/frontend/next.config.js (1 hunks)
Additional comments: 2
tools/walletextension/frontend/next.config.js (2)
4-8: The
distDirconfiguration has been commented out. This change could have significant implications on where the static files are generated during the build process. If thedistDirwas intentionally removed, ensure that this change is reflected in the build and deployment scripts and that all team members are aware of the new build directory. If this was unintentional, thedistDirshould be uncommented or the rationale for its removal should be documented.4-4: The change from single quotes to double quotes for the
outputvalue is a stylistic preference and does not affect functionality.
Jennievon
deleted the
jennifer/2584-gateway-frontend-improvement-before-testnet-release
branch
Why this change is needed
Please provide a description and a link to the underlying ticket
https://github.com/ten-protocol/ten-internal/issues/2584
What changes were made as part of this PR
Please provide a high level list of the changes made
PR checks pre-merging
Please indicate below by ticking the checkbox that you have read and performed the required
PR checks