-
Notifications
You must be signed in to change notification settings - Fork 181
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
Release: v2.4.0 #614
base: develop
Are you sure you want to change the base?
Release: v2.4.0 #614
Conversation
…t into fix/ui-freezing
…t into fix/identicon-mismatch
WalkthroughThe changes introduce modifications to several Vue components and stylesheets. In Changes
Possibly related PRs
Suggested reviewers
✨ Finishing Touches
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? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
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 using PR comments)
Other keywords and placeholders
Documentation and Community
|
💼 Build Files |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (1)
packages/extension/src/ui/onboard/App.vue (1)
72-72
: Consolidate overflow properties.The
overflow: hidden;
on line 72 conflicts withoverflow-y: auto;
on line 75. Consider consolidating these properties for better maintainability.body { width: 100vw; height: 100vh; margin: 0; - overflow: hidden; font-size: 0; font-family: 'Roboto', sans-serif; - overflow-y: auto; + overflow-x: hidden; + overflow-y: auto; }Also applies to: 75-75
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
packages/extension/src/ui/onboard/App.vue
(2 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: buildAll
- GitHub Check: test
🔇 Additional comments (1)
packages/extension/src/ui/onboard/App.vue (1)
102-102
: Review the height constraints.The container has both
height: 100vh;
andmin-height: 700px;
. On desktop,100vh
will always be greater than 700px, makingmin-height
redundant. However, on mobile devices with small screens, this could force unnecessary scrolling.Please verify:
- Is the 700px minimum height requirement necessary for all screen sizes?
- Have you tested this on mobile devices to ensure a good user experience?
Also applies to: 108-108
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (3)
packages/extension/src/ui/action/components/network-menu/index.vue (1)
95-95
: Consider removing !important flags from styles.The use of
!important
flags in CSS should be avoided as they:
- Make styles harder to override when needed
- Can lead to specificity wars
- Make the codebase harder to maintain
- opacity: 1; + opacity: 1; - opacity: 0.6 !important; + opacity: 0.6; - opacity: 1 !important; + opacity: 1;Also applies to: 103-103, 109-110
packages/extension/src/ui/action/views/network-activity/components/network-activity-action.vue (1)
111-114
: Consider using CSS custom properties for focus styles.The focus styles could be more maintainable using CSS custom properties.
+:root { + --focus-ring-color: -webkit-focus-ring-color; + --focus-ring-offset: 2px; +} &:focus { - outline: -webkit-focus-ring-color auto 1px !important; - outline-offset: 2px !important; + outline: var(--focus-ring-color) auto 1px; + outline-offset: var(--focus-ring-offset); }packages/extension/src/ui/action/icons/tabs/activity.vue (1)
27-33
: Consider optimizing the inactive state SVG path.The path data for the inactive state contains an excessive number of coordinate points, which could be simplified for better maintainability and potentially smaller file size.
Consider using an SVG optimization tool to simplify the path data while maintaining visual fidelity. Tools like SVGO can help with this optimization.
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (8)
packages/extension/src/providers/ethereum/ui/styles/common-popup.less
(1 hunks)packages/extension/src/ui/action/components/network-menu/index.vue
(4 hunks)packages/extension/src/ui/action/icons/tabs/activity.vue
(1 hunks)packages/extension/src/ui/action/icons/tabs/assets.vue
(1 hunks)packages/extension/src/ui/action/icons/tabs/dapps.vue
(1 hunks)packages/extension/src/ui/action/icons/tabs/nfts.vue
(1 hunks)packages/extension/src/ui/action/views/network-activity/components/network-activity-action.vue
(4 hunks)packages/extension/src/ui/action/views/network-assets/components/network-assets-item.vue
(2 hunks)
✅ Files skipped from review due to trivial changes (1)
- packages/extension/src/providers/ethereum/ui/styles/common-popup.less
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: buildAll
- GitHub Check: test
🔇 Additional comments (8)
packages/extension/src/ui/action/components/network-menu/index.vue (1)
6-6
: LGTM! Improved active state handling.The addition of
exact-active-class
ensures precise route matching for active states.Also applies to: 15-15, 22-22, 32-32
packages/extension/src/ui/action/views/network-activity/components/network-activity-action.vue (1)
4-9
: LGTM! Improved semantic markup and accessibility.Great improvements:
- Using
<button>
instead of<a>
for actions is semantically correct- Added proper focus styles for keyboard navigation
Also applies to: 10-15
packages/extension/src/ui/action/views/network-assets/components/network-assets-item.vue (1)
7-7
: LGTM! Improved image rendering performance.The explicit width and height attributes help prevent Cumulative Layout Shift (CLS) and improve Core Web Vitals.
Also applies to: 226-228
packages/extension/src/ui/action/icons/tabs/assets.vue (2)
2-36
: LGTM! Clean and consistent SVG implementation.The conditional rendering of SVGs based on the
isActive
prop is well-structured, with proper opacity differentiation between active and inactive states.
39-46
: LGTM! Clean prop definition.The
isActive
prop is properly typed and has a sensible default value.packages/extension/src/ui/action/icons/tabs/nfts.vue (1)
2-42
: LGTM! Well-structured SVG with proper clipping path.The SVG implementation is clean with proper use of clipping path for the active state.
packages/extension/src/ui/action/icons/tabs/dapps.vue (1)
2-36
: LGTM! Clean grid icon implementation.The SVG implementation effectively represents a grid pattern with proper state handling.
packages/extension/src/ui/action/icons/tabs/activity.vue (1)
2-35
: LGTM! Consistent with other tab icons.The implementation follows the same pattern as other tab icons, maintaining consistency across the UI.
Also applies to: 38-51
Fix/show active network in tabs
…t into fix/identicon-mismatch
…into feat/backup-detected
fix: new networks automatic pinning
There was a problem hiding this 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
🧹 Nitpick comments (2)
packages/extension/tsconfig.node.json (1)
13-16
: Expanded Include Scope for File Coverage
The inclusion of"src/**/*.ts"
,"configs/**/*.ts"
, and"src/**/*.vue"
considerably broadens the files processed by this configuration, ensuring that both TypeScript and Vue files are correctly compiled. Please verify that this expanded scope aligns with your project structure and that it does not unintentionally include files that should be excluded from Node compilation.packages/extension/src/ui/action/App.vue (1)
633-648
: Consider a more concise implementation for network category handling.The current implementation for both
Pinned
andNew
categories follows a similar pattern. Consider refactoring to reduce code duplication.- case NetworksCategory.Pinned: { - const hasCurrentNetwork = pinnedNetworks.value.some( - net => net.name === currentNetwork.value.name, - ); - return hasCurrentNetwork - ? pinnedNetworks.value - : [...pinnedNetworks.value, currentNetwork.value]; - } - case NetworksCategory.New: { - const hasCurrentNetwork = newNetworks.includes(currentNetwork.value.name); - const newNets = networks.value.filter(net => - newNetworks.includes(net.name), - ); - - return hasCurrentNetwork ? newNets : [...newNets, currentNetwork.value]; - } + case NetworksCategory.Pinned: { + const networks = pinnedNetworks.value; + return networks.some(net => net.name === currentNetwork.value.name) + ? networks + : [...networks, currentNetwork.value]; + } + case NetworksCategory.New: { + const networks = networks.value.filter(net => newNetworks.includes(net.name)); + return newNetworks.includes(currentNetwork.value.name) + ? networks + : [...networks, currentNetwork.value]; + }
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
yarn.lock
is excluded by!**/yarn.lock
,!**/*.lock
📒 Files selected for processing (25)
package.json
(1 hunks)packages/extension-bridge/package.json
(1 hunks)packages/extension/configs/vite/empty.js
(1 hunks)packages/extension/configs/vite/transform-manifest.ts
(3 hunks)packages/extension/package.json
(3 hunks)packages/extension/src/libs/networks-state/index.ts
(0 hunks)packages/extension/src/ui/action/App.vue
(3 hunks)packages/extension/src/ui/action/main.ts
(1 hunks)packages/extension/src/ui/action/utils/browser.ts
(1 hunks)packages/extension/src/ui/action/views/import-account/views/import-account-password.vue
(2 hunks)packages/extension/src/ui/action/views/import-account/views/import-account-private-key.vue
(2 hunks)packages/extension/tsconfig.node.json
(1 hunks)packages/extension/vite.config.ts
(4 hunks)packages/hw-wallets/package.json
(2 hunks)packages/keyring/package.json
(1 hunks)packages/name-resolution/package.json
(2 hunks)packages/request/package.json
(1 hunks)packages/signers/bitcoin/package.json
(1 hunks)packages/signers/ethereum/package.json
(1 hunks)packages/signers/kadena/package.json
(1 hunks)packages/signers/polkadot/package.json
(1 hunks)packages/storage/package.json
(1 hunks)packages/swap/package.json
(1 hunks)packages/types/package.json
(1 hunks)packages/utils/package.json
(1 hunks)
💤 Files with no reviewable changes (1)
- packages/extension/src/libs/networks-state/index.ts
✅ Files skipped from review due to trivial changes (3)
- packages/extension/src/ui/action/main.ts
- packages/extension/configs/vite/transform-manifest.ts
- packages/extension-bridge/package.json
🔇 Additional comments (92)
packages/extension/tsconfig.node.json (1)
24-28
: Enhanced Compiler Options with Types and Path Aliases
Adding"types": ["node"]
explicitly ensures Node-specific globals are recognized. Additionally, introducing the"paths"
mapping for"@/*": ["./src/*"]
and"@action/*": ["./src/ui/action/*"]
improves module resolution and simplifies import statements across the codebase. Confirm that the relative paths are correct with respect to the location of thistsconfig.node.json
file.packages/extension/src/ui/action/App.vue (2)
351-355
: LGTM! Good simplification of the network order update logic.The removal of the unnecessary conditional check makes the code more straightforward and maintainable.
369-371
:❓ Verification inconclusive
Verify the safety of non-null assertion on selectedAccount.
The use of the non-null assertion operator (
!
) assumesselectedAccount
can never be null. Please verify this assumption or consider adding a null check.
🏁 Script executed:
#!/bin/bash # Description: Check if selectedAccount can be null when generating buy link # Search for all places where selectedAccount is set rg -A 5 "selectedAccount\s*=" packages/extension/src/ui/action/Length of output: 1169
Non-null assertion on selectedAccount: Confirm it's always defined
The buy link code uses the non-null assertion (
selectedAccount!
) to access the account's address. Our search shows thatselectedAccount
is assigned fromactiveAccounts[0]
(and sometimes updated) without an explicit null check. This could lead to a runtime error ifactiveAccounts
is ever empty or the expected account isn't available. Please verify that the state management guarantees a definedselectedAccount
in all cases, or consider adding a null check to handle potential undefined values safely.packages/extension/src/ui/action/utils/browser.ts (1)
53-53
: LGTM! Good addition of cache control.Adding
{ cache: "no-store" }
ensures fresh version information is always retrieved, preventing stale cache from affecting version checks.packages/extension/src/ui/action/views/import-account/views/import-account-password.vue (1)
40-40
: LGTM! Good package upgrade and method improvement.
- Updated to official
@ethereumjs/wallet
package- Switched to more idiomatic
getAddressString()
methodAlso applies to: 116-116
packages/extension/src/ui/action/views/import-account/views/import-account-private-key.vue (1)
39-39
: LGTM! Consistent implementation with import-account-password.vue.The changes mirror those in import-account-password.vue, maintaining codebase consistency:
- Updated to
@ethereumjs/wallet
package- Switched to
getAddressString()
methodAlso applies to: 96-96
packages/types/package.json (1)
27-41
:❓ Verification inconclusive
LGTM! Good maintenance updates.
Dependencies have been updated to their latest minor/patch versions.
Please ensure these updates are compatible by running the test suite:
🏁 Script executed:
#!/bin/bash # Verify package compatibility npm install npm testLength of output: 4487
Action Required: Verify Compatibility Using Yarn Workspaces
The dependency updates look good, but the automated test commands using npm failed due to workspace-specific configuration (e.g., "Unsupported URL Type 'workspace:'" and missing node_modules state file). Since this project leverages Yarn workspaces, please ensure compatibility by manually running the tests with the appropriate commands:
- Run installation with Yarn:
yarn install- Run the test suite with Yarn:
yarn test
Once these commands complete successfully, we can be confident the dependency updates are fully compatible.
packages/storage/package.json (7)
30-30
: Update @types/node Version
The version of@types/node
has been bumped from an earlier version to^22.13.1
. This update should help with improved type definitions and compatibility with newer Node.js features.
33-33
: Bump eslint Version
Theeslint
version is updated to^9.20.0
. Please double-check that the new ESLint rules and parser settings are compatible with your existing configuration.
39-39
: Upgrade Prettier
The new version ofprettier
is now^3.4.2
. This should provide additional formatting improvements. A quick re-run of the formatter is recommended to ensure consistency.
42-42
: Update tsup Version
Thetsup
dependency has been updated to^8.3.6
for potential build performance enhancements. Verify that the build output still meets expectations.
43-43
: Update TypeScript Version
The TypeScript dependency is now at^5.7.3
. Make sure to run a full type-check as newer versions might introduce stricter checks.
44-44
: Upgrade typescript-eslint
The packagetypescript-eslint
is updated to version8.23.0
. Please confirm that no new linting issues are introduced after this update.
45-45
: Upgrade vitest Version
The testing frameworkvitest
now uses version^3.0.5
. It is advisable to run the test suite to ensure that all tests pass under the updated version.packages/name-resolution/package.json (7)
25-25
: Update @types/node Version
The@types/node
dependency is updated to^22.13.1
. Verify that this does not conflict with any other type definitions in the project.
28-28
: Bump eslint Version
eslint
has been bumped to^9.20.0
. Ensure that your linting configuration remains compatible and that no unexpected linting errors are introduced.
34-34
: Update Prettier
Theprettier
version has been updated to^3.4.2
. Re-run the formatter to confirm that the formatting style remains consistent across the codebase.
37-37
: Upgrade tsup
The version oftsup
is updated to^8.3.6
. Confirm that the build process completes as expected with the new version.
38-38
: Update TypeScript
TypeScript is now at^5.7.3
. A full recompile is recommended to catch any type-related issues that might arise from the update.
39-39
: Upgrade typescript-eslint
Thetypescript-eslint
dependency is updated to8.23.0
. Make sure that your ESLint rules and TypeScript settings integrate well with this new version.
40-40
: Bump vitest Version
The testing frameworkvitest
has been updated to^3.0.5
. It’s a good idea to run the test suite as a whole, as some configurations might need adjustments.packages/signers/kadena/package.json (8)
31-31
: Update @polkadot/util-crypto Version
The dependency@polkadot/util-crypto
is updated from^13.2.3
to^13.3.1
. This ensures consistency with other packages using the same dependency.
33-33
: Update @types/node Version
The version of@types/node
is bumped to^22.13.1
, aligning with the updates across other packages. Ensure integrated type checks remain valid.
36-36
: Bump eslint Version
eslint
is now at^9.20.0
. Please verify that the ESLint configuration and any overridden rules work correctly with this update.
42-42
: Upgrade Prettier
Theprettier
package has been upgraded to^3.4.2
. Running a formatting check after this update is recommended.
45-45
: Update tsup Version
tsup
is updated to^8.3.6
. Confirm that the build pipeline executes without issues and that the bundle output is as expected.
46-46
: Upgrade TypeScript
The TypeScript version is updated to^5.7.3
. A full recompile is advisable to ensure that the update does not introduce new type errors.
47-47
: Upgrade typescript-eslint Dependency
The new version oftypescript-eslint
is8.23.0
. Verify that this update maintains the expected linting behavior without introducing breaking changes.
48-48
: Bump vitest Version
vitest
has been upgraded to^3.0.5
. Running the complete test suite will confirm that tests are compatible with the new version.packages/utils/package.json (8)
27-27
: Update @polkadot/util-crypto Version
The dependency@polkadot/util-crypto
has been bumped to^13.3.1
, keeping it consistent with other packages.
33-33
: Bump @types/node Version
The version of@types/node
is updated to^22.13.1
. Check that the new definitions integrate well with existing code.
36-36
: Upgrade eslint
The ESLint version is updated to^9.20.0
. Ensure that the linting process and any custom rules still operate correctly.
42-42
: Update Prettier Version
prettier
is updated to^3.4.2
. It would be beneficial to run the formatter to ensure that all code remains consistently styled.
45-45
: Upgrade tsup
tsup
has been updated to^8.3.6
, providing potential build improvements. Validate the build output post-update.
46-46
: Bump TypeScript
The TypeScript version is now^5.7.3
. A full type check is recommended to catch any issues introduced by the new version.
47-47
: Upgrade typescript-eslint
typescript-eslint
has been updated to8.23.0
. Ensure that linting works as expected with this version.
48-48
: Bump vitest Version
The testing frameworkvitest
is now^3.0.5
. Running the test suite after this update is recommended to verify test stability.packages/request/package.json (8)
30-30
: Upgrade uuid Dependency
The version ofuuid
has been updated from^10.0.0
to^11.0.5
. This update may bring performance improvements or bug fixes—please verify its usage in your code.
34-34
: Bump @types/node Version
The@types/node
dependency is updated to^22.13.1
. Confirm compatibility across all modules using Node.js types.
37-37
: Update eslint Version
eslint
is now updated to^9.20.0
. It is important to ensure that linting remains error-free under the new version.
43-43
: Upgrade Prettier
Theprettier
version is now^3.4.2
. Confirm that formatting across the codebase remains consistent after this bump.
46-46
: Update tsup Version
The build tooltsup
is updated to^8.3.6
. Make sure that the build artifacts are generated correctly with the new version.
47-47
: Bump TypeScript Version
The dependency TypeScript is updated to^5.7.3
. A comprehensive build and type-check is recommended as newer TypeScript versions can introduce stricter type rules.
48-48
: Upgrade typescript-eslint
Thetypescript-eslint
package is now at version8.23.0
. Please ensure that it continues to integrate smoothly with your ESLint configuration.
49-49
: Bump vitest Version
Thevitest
testing framework has been updated to^3.0.5
. Running the entire test suite after this change will help verify that there are no regressions.packages/signers/bitcoin/package.json (4)
35-35
: Dependency Update: @types/node
The update to"@types/node": "^22.13.1"
helps ensure that you have the most recent type definitions available. Confirm that this version is compatible with any other packages relying on Node types.
38-38
: Dependency Update: ESLint
The ESLint dependency has been bumped to"^9.20.0"
. This update should improve linting features and maintain compatibility with your configuration. Please verify that the ESLint config remains valid.
44-44
: Dependency Update: Prettier
Upgrading Prettier to"^3.4.2"
standardizes code formatting across the project. Ensure that any project-specific formatting overrides are still correctly applied.
47-50
: Dev Tools Update: tsup, TypeScript, TypeScript-ESLint, Vitest
The updates to"tsup": "^8.3.6"
,"typescript": "^5.7.3"
,"typescript-eslint": "8.23.0"
, and"vitest": "^3.0.5"
align this package’s toolchain with the latest compatible versions. Please run a full build and test suite to ensure these upgrades do not introduce any unforeseen issues.packages/signers/ethereum/package.json (4)
35-35
: Dependency Update: @types/node
The change to"@types/node": "^22.13.1"
updates the Node.js type definitions. Ensure that this version works seamlessly with any dependent modules.
38-38
: Dependency Update: ESLint
Bumping ESLint to"^9.20.0"
is consistent with broader dependency updates. Verify that all ESLint rules and plugins continue to function correctly.
44-44
: Dependency Update: Prettier
Updating Prettier to"^3.4.2"
brings improvements in code formatting. Confirm that this update does not conflict with any existing formatting configurations.
47-50
: Dev Tools Update: tsup, TypeScript, TypeScript-ESLint, Vitest
The upgrades"tsup": "^8.3.6"
,"typescript": "^5.7.3"
,"typescript-eslint": "8.23.0"
, and"vitest": "^3.0.5"
help keep the build, type-checking, and testing tools up to date. Ensure comprehensive testing to catch any issues arising from these version bumps.packages/signers/polkadot/package.json (6)
25-25
: Dependency Update: @commitlint/cli
Upgrading"@commitlint/cli"
to"^19.7.1"
will improve commit linting consistency. Please confirm that this version works with your commit hook configurations.
27-28
: Dependency Update: Polkadot Utilities
The updates for"@polkadot/util": "^13.3.1"
and"@polkadot/util-crypto": "^13.3.1"
ensure that your Polkadot-related utilities are current. Ensure compatibility with any code that depends on these modules.
34-34
: Dependency Update: @types/node (dev)
The change to"@types/node": "^22.13.1"
in devDependencies brings the Node.js type definitions up to date.
37-37
: Dependency Update: ESLint (dev)
ESLint has been updated to"^9.20.0"
in the devDependencies section. Confirm that the linting process behaves as expected.
43-43
: Dependency Update: Prettier (dev)
Updating Prettier to"^3.4.2"
should provide improved formatting consistency. Test this change to prevent any unexpected formatting issues.
46-49
: Dev Tools Update: tsup, TypeScript, TypeScript-ESLint, Vitest (dev)
The upgrade to"tsup": "^8.3.6"
,"typescript": "^5.7.3"
,"typescript-eslint": "8.23.0"
, and"vitest": "^3.0.5"
helps ensure that your development tooling remains modern and efficient. Run your build and test workflows to validate these changes.packages/keyring/package.json (4)
32-32
: Dependency Update: @polkadot/util
Updating"@polkadot/util": "^13.3.1"
helps keep the cryptographic utilities current and consistent with other packages in the project.
37-37
: Dependency Update: @types/node (dev)
The update to"@types/node": "^22.13.1"
in devDependencies ensures that type information is current.
40-40
: Dependency Update: ESLint (dev)
ESLint is now set to"^9.20.0"
, and this should be validated against your current linting rules and configurations.
46-52
: Dev Tools Update: Prettier, tsup, TypeScript, TypeScript-ESLint, Vitest (dev)
The upgrades to"prettier": "^3.4.2"
,"tsup": "^8.3.6"
,"typescript": "^5.7.3"
,"typescript-eslint": "8.23.0"
, and"vitest": "^3.0.5"
are consistent with updates in other packages. Please perform a complete build and run tests to ensure smooth integration.packages/swap/package.json (8)
27-27
: Dependency Update: @solana/spl-token
The update to"@solana/spl-token": "^0.4.12"
advances the token handling library to include recent improvements and fixes. Validate its usage in your swap logic.
28-28
: Dependency Update: @solana/web3.js
Bumping"@solana/web3.js"
to"^1.98.0"
ensures that blockchain connectivity is maintained with current standards. Confirm that no breaking changes affect your integration.
34-34
: Dependency Update: rango-sdk-basic
The change to"rango-sdk-basic": "^0.1.62"
should incorporate the latest enhancements. Ensure that the API or functionality provided by the SDK is still used as intended.
36-36
: Dependency Update: uuid
Upgrading"uuid": "^11.0.5"
brings new robustness and potential performance improvements to your unique identifier generation. Test thoroughly for any side effects.
42-42
: Dependency Update: @types/node (dev)
The version update to"@types/node": "^22.13.1"
in devDependencies keeps the type system current.
45-45
: Dependency Update: ESLint (dev)
Updating ESLint to"^9.20.0"
helps standardize linting rules across the project. Verify that it integrates with your existing setup.
51-51
: Dependency Update: Prettier (dev)
The bump to"^3.4.2"
for Prettier ensures consistency in code formatting. Validate that no format configuration is inadvertently overridden.
54-57
: Dev Tools Update: tsup, TypeScript, TypeScript-ESLint, Vitest (dev)
The upgrades to"tsup": "^8.3.6"
,"typescript": "^5.7.3"
,"typescript-eslint": "8.23.0"
, and"vitest": "^3.0.5"
are in line with recent updates across the project. Ensure that your build, type-checking, and testing processes run without issues after these changes.package.json (4)
35-36
: Upgrade Commitlint Packages
The updates for@commitlint/cli
and@commitlint/config-conventional
to version^19.7.1
ensure you receive the latest linting rules and bug fixes for commit messages. Please verify that your commit hook configuration remains compatible with these changes.
37-37
: Upgrade @swc/core for Improved Build Performance
Bumping@swc/core
to^1.10.14
incorporates recent optimizations and bug fixes. It is recommended to run a full build/test cycle to ensure that the transpilation output is as expected.
38-39
: Update Concurrently and Husky
The upgrade ofconcurrently
to^9.1.2
andhusky
to^9.1.7
should improve task-running and Git hook reliability. Confirm that your scripts leveraging these tools (for example, file watching and pre-commit hooks) behave correctly after the update.
41-41
: Upgrade Nodemon for Enhanced Developer Workflow
Updatingnodemon
to^3.1.9
will likely provide improvements in reliability and performance during development. Please test your watch mode processes to ensure they function as expected.packages/hw-wallets/package.json (6)
25-25
: Upgrade @types/node Dependency
The update to@types/node
version^22.13.1
offers improved and more up-to-date type definitions. Verify that none of your type checks are affected by any API changes in Node.js.
28-28
: Upgrade ESLint Version
Bumpingeslint
to^9.20.0
provides access to enhanced linting rules and bug fixes. Ensure that your ESLint configuration is still valid and that custom rules (if any) continue to work as expected.
34-34
: Upgrade Prettier for Consistent Code Formatting
The change toprettier
version^3.4.2
should help maintain consistent code formatting across the project. It is advisable to re-run your formatter to catch any minor differences introduced by the new version.
37-40
: Upgrade Build Tools and Testing Frameworks
Upgradingtsup
(^8.3.6
),typescript
(^5.7.3
),typescript-eslint
(8.23.0
), andvitest
(^3.0.5
) collectively strengthens the build, type-checking, and testing processes. Please ensure that your build scripts and test suites execute successfully after these updates.
55-56
: Update Ledger Hardware Wallet Dependencies
Updating@ledgerhq/hw-app-btc
to^10.5.0
and@ledgerhq/hw-app-eth
to^6.42.5
improves support for Ledger devices. It’s important to run hardware integration tests to ensure that wallet interactions remain stable.
60-66
: Upgrade Ledger, Polkadot, Trezor and Bitcoin Libraries
The following upgrades have been performed:
@ledgerhq/live-common
→^34.20.0
@polkadot/types
→^15.5.2
@polkadot/util
→^13.3.1
@trezor/connect
&@trezor/connect-webextension
→^9.4.7
@zondax/ledger-substrate
→^1.0.1
bitcoinjs-lib
→^6.1.7
These changes should enhance compatibility, performance, and security. Please verify that all wallet and blockchain transaction flows are operating correctly after these upgrades.packages/extension/package.json (7)
26-26
: Update Amplitude Analytics Dependency
Upgrading@amplitude/analytics-browser
to^2.11.11
ensures the latest analytics tracking improvements and bug fixes are in place. Verify that analytics events and data collection function as expected.
38-40
: Integrate EthereumJS Wallet and Update Kadena Packages
- The addition of
@ethereumjs/wallet
at version^2.0.4
introduces enhanced wallet functionality.- Upgrading
@kadena/client
and@kadena/pactjs-cli
to^1.16.0
aligns your codebase with the latest Kadena features and fixes.
Ensure that components relying on these dependencies are tested thoroughly for any integration issues.
42-44
: Upgrade Ethereum and Metaplex Packages
Upgrading@metamask/eth-sig-util
to^8.2.0
and@metaplex-foundation/mpl-bubblegum
to^4.3.1
, along with updating@metaplex-foundation/umi
to^1.0.0
, provides better security and improved functionality. Please validate that your blockchain transaction workflows and related UIs continue to operate seamlessly.
45-53
: Enhance Polkadot and Metaplex Bundled Dependencies
The updates include:
- Adding
@metaplex-foundation/umi-bundle-defaults
at^1.0.0
.- Upgrading several Polkadot packages (
@polkadot/api
,@polkadot/extension-inject
,@polkadot/keyring
,@polkadot/rpc-provider
,@polkadot/types
,@polkadot/types-known
,@polkadot/ui-shared
, and@polkadot/util
) to their respective newer versions.
These enhancements are designed to improve performance and compatibility. Ensure that any features relying on Polkadot functionality are validated with integration tests.
55-59
: Update Solana Ecosystem Dependencies
The Solana-related libraries have been updated:
@solana-developers/helpers
→^2.7.0
@solana/spl-token
→^0.4.12
@solana/wallet-standard-features
→^1.3.0
@solana/web3.js
→^1.98.0
@wallet-standard/base
→^1.1.0
These updates should ensure better stability and feature support for Solana interactions. Please test Solana functionality to confirm compatibility.
63-66
: Update UI and Utility Dependencies
Several frontend libraries have been upgraded:
bitcoinjs-lib
→^6.1.7
concurrently
→^9.1.2
echarts
→^5.6.0
pinia
→^2.3.1
uuid
→^11.0.5
vue
→^3.5.13
vue-router
→^4.5.0
These changes are expected to improve performance, security, and feature enhancements in the UI. Please verify that your user interfaces and state management logic work smoothly following these updates.Also applies to: 75-75, 79-80, 82-82
91-92
: Comprehensive Update of Build, Testing, and Linting Tools
The devDependencies have been extensively updated to include new versions of:
- Vite plugins and Rollup-related packages (e.g.,
@crxjs/vite-plugin
,@rollup/plugin-commonjs
,@rollup/plugin-node-resolve
,@rollup/plugin-replace
,@rollup/plugin-typescript
).- Type definitions for various packages (e.g.,
@types/chrome
,@types/less
,@types/lodash
,@types/node
).- Linting and formatting utilities (e.g.,
eslint
,@vue/eslint-config-prettier
,prettier
).- Build tools and testing frameworks (e.g.,
tsup
,typescript
,vitest
,vue-tsc
).
These upgrades should lead to improved build performance, enhanced type-checking, and more robust testing. It is advisable to run your complete build and test suite after these updates to catch any regressions.Also applies to: 95-96, 98-99, 101-107, 113-117, 119-123, 125-126, 128-130, 132-133, 135-139
packages/extension/vite.config.ts (4)
73-73
: LGTM!The addition of the 'os' module to the polyfills is consistent with other Node.js core modules being polyfilled.
123-123
: LGTM!The alias for the fs module correctly points to the empty implementation, which is consistent with the mock implementation approach.
35-37
:❓ Verification inconclusive
Verify if this workaround is still necessary.
The
skipWebSocketTokenCheck
option in the legacy configuration appears to be a workaround. Please verify if this is still necessary or if there's a more permanent solution available.
🌐 Web query:
What is the purpose of skipWebSocketTokenCheck in Vite legacy configuration?
💡 Result:
The
skipWebSocketTokenCheck
option in Vite addresses a security vulnerability introduced in earlier versions by allowing developers to bypass WebSocket connection validation at their own risk. Here's what you need to know:Security Context
Vite 6.0.9+ added mandatory token validation for WebSocket connections after discovering malicious websites could hijack HMR WebSockets through Cross-Site WebSocket Hijacking (CSWSH) attacks[1][2]. This vulnerability allowed:
- Reading HMR file change notifications
- Accessing error details
- Potential exposure of plugin-specific sensitive data[2]
Functionality
When enabled (
skipWebSocketTokenCheck: true
), this option:
- Disables security token checks for WebSocket connections
- Reverts to pre-6.0.9 behavior where any origin could connect
- Maintains compatibility with older plugins/frameworks that manually connect to Vite's WebSocket server[1][7]
Recommended Usage
Only enable temporarily if:
- Using incompatible plugins that directly manage WebSocket connections
- Framework integrations break after upgrading Vite
- Development workflows require immediate fixes before plugin updates
Security teams strongly advise against production use due to reintroducing CVE-2024-XXXX vulnerabilities[2][7]. The official documentation warns this option should only be used when fully understanding the associated risks[1].
For long-term solutions:
- Update affected plugins/frameworks
- Use
import.meta.hot
instead of direct WebSocket access- File issues with plugin maintainers for compatibility fixes[1][2]
Citations:
- 1: https://fossies.org/linux/vite/packages/vite/src/node/config.ts
- 2: GHSA-vg6x-rcgg-rjx6
- 3: @vitejs/plugin-legacy: polyfills vs modernPolyfills vitejs/vite#16082
- 4: https://github.com/alloc/vite-plugin-legacy
- 5: https://www.npmjs.com/package/vite-plugin-legacy
- 6: https://www.jsdocs.io/package/vite
- 7: https://security.snyk.io/package/npm/vite/5.1.5
- 8: https://www.npmjs.com/package/@vitejs/plugin-legacy
- 9: https://security.snyk.io/package/npm/vite/4.2.0
- 10: https://npmjs.com/package/@vitejs/plugin-legacy/v/1.1.0
Security Review: Verify Temporary Workaround for WebSocket Token Check
The legacy configuration at
packages/extension/vite.config.ts
(lines 35–37) setsskipWebSocketTokenCheck: true
, which disables the security token validation for WebSocket connections. According to the latest information, using this option bypasses a mandatory security check introduced in Vite 6.0.9+, and while it maintains compatibility with legacy plugins or frameworks, it reverts to less secure pre-6.0.9 behavior and may expose the system to CSWSH attacks.Please verify the following:
- Necessity: Is this workaround still required for your current development environment or legacy dependencies?
- Security: Can the risks be mitigated by using updated plugins,
import.meta.hot
improvements, or other permanent solutions?- Scope: Ensure this configuration is confined to development settings and not inadvertently enabled in production builds.
If the workaround remains unavoidable, consider documenting the rationale and a timeline for revisiting a more secure, long-term fix.
104-104
:❓ Verification inconclusive
Verify the impact on bundle size.
Setting
external: []
means no dependencies will be treated as external during bundling. This could significantly increase the bundle size.
🏁 Script executed:
#!/bin/bash # Description: Compare bundle sizes before and after the change. # Build the project and analyze bundle sizes npm run build npm run analyzeLength of output: 479
Manual Verification of Bundle Size Impact Required
The attempted automation did not produce usable output because the npm scripts for "build" and "analyze" are missing. This means we cannot automatically verify the impact of setting
external: []
on the bundle size. Please manually assess whether this configuration is causing an unintended increase in bundle size and consider adding or updating the relevant build and analysis scripts in your package configuration for future verifications.
const readFileSync = () => {}; | ||
const writeFileSync = () => {}; | ||
|
||
export { readFileSync, writeFileSync }; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🛠️ Refactor suggestion
Throw errors in mock implementations to prevent silent failures.
Empty mock implementations could lead to silent failures. Consider throwing errors to make it clear that these functions are not meant to be called.
Apply this diff to throw errors:
-const readFileSync = () => {};
-const writeFileSync = () => {};
+const readFileSync = () => {
+ throw new Error('readFileSync is not implemented in this environment');
+};
+const writeFileSync = () => {
+ throw new Error('writeFileSync is not implemented in this environment');
+};
📝 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. Thoroughly test & benchmark the code to ensure it meets the requirements.
const readFileSync = () => {}; | |
const writeFileSync = () => {}; | |
export { readFileSync, writeFileSync }; | |
const readFileSync = () => { | |
throw new Error('readFileSync is not implemented in this environment'); | |
}; | |
const writeFileSync = () => { | |
throw new Error('writeFileSync is not implemented in this environment'); | |
}; | |
export { readFileSync, writeFileSync }; |
…into feat/backup-detected
fix: identicon mismatch on activity
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (2)
packages/extension/src/ui/action/views/network-activity/components/network-activity-transaction.vue (2)
13-13
: Add error handling for network and activity objects.The chained method calls could throw if
network
oractivity
objects are undefined/null, or if their methods are undefined.Consider adding null checks and providing a fallback:
- :src="network.identicon(network.displayAddress((activity.isIncoming ? activity.from : activity.to)))" + :src="network?.identicon?.(network?.displayAddress?.((activity?.isIncoming ? activity?.from : activity?.to)) ?? '')"
341-341
: Address the TODO comment for dropped transaction styling.The dropped transaction status lacks distinct styling, which could affect user experience.
Would you like me to suggest a color scheme for dropped transactions that aligns with your design system? For example, we could use a muted variant of the error color or a distinct color that indicates a neutral but final state.
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
packages/extension/src/ui/action/views/network-activity/components/network-activity-transaction.vue
(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: buildAll
- GitHub Check: test
devop: update zerox api
Fix/paste window
Fix/UI freezing
…into feat/backup-detected
feat: add backup page
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 5
🔭 Outside diff range comments (3)
packages/extension/src/ui/onboard/create-wallet/wallet-ready.vue (1)
9-20
:⚠️ Potential issueAdd security attributes to external links.
External links opening in new tabs should include
rel="noopener noreferrer"
to prevent potential security vulnerabilities.Apply this diff to add the security attributes:
- <a href="https://github.com/myetherwallet" target="_blank"> + <a href="https://github.com/myetherwallet" target="_blank" rel="noopener noreferrer"> - <a href="https://www.instagram.com/myetherwallet/" target="_blank"> + <a href="https://www.instagram.com/myetherwallet/" target="_blank" rel="noopener noreferrer"> - <a href="https://www.reddit.com/r/MyEtherWallet/" target="_blank"> + <a href="https://www.reddit.com/r/MyEtherWallet/" target="_blank" rel="noopener noreferrer"> - <a href="https://twitter.com/myetherwallet" target="_blank"> + <a href="https://twitter.com/myetherwallet" target="_blank" rel="noopener noreferrer">packages/extension/src/ui/action/views/network-assets/index.vue (1)
112-132
: 🛠️ Refactor suggestionEnhance error handling and prevent rapid retries.
The error handling could be improved with error type information and debouncing.
Consider these improvements:
+const updateAssetsDebounced = useDebounceFn(async () => { + try { + isFetchError.value = false; + isLoading.value = true; + assets.value = []; + const currentNetwork = selectedNetworkName.value; + if (!props.accountInfo.selectedAccount?.address) return; + + const _assets = await props.network.getAllTokenInfo( + props.accountInfo.selectedAccount.address + ); + + if (selectedNetworkName.value !== currentNetwork) return; + assets.value = _assets; + } catch (error) { + if (error instanceof NetworkError) { + console.error('Network error:', error); + } else { + console.error('Unknown error:', error); + } + isFetchError.value = true; + assets.value = []; + } finally { + isLoading.value = false; + } +}, 1000); + -const updateAssets = () => { - isFetchError.value = false; - isLoading.value = true; - assets.value = []; - const currentNetwork = selectedNetworkName.value; - if (props.accountInfo.selectedAccount?.address) { - props.network - .getAllTokenInfo(props.accountInfo.selectedAccount?.address || '') - .then(_assets => { - if (selectedNetworkName.value !== currentNetwork) return; - assets.value = _assets; - isLoading.value = false; - }) - .catch(() => { - if (selectedNetworkName.value !== currentNetwork) return; - isFetchError.value = true; - isLoading.value = false; - assets.value = [];; - }); - } -}; +const updateAssets = () => { + updateAssetsDebounced(); +};Don't forget to add the necessary imports:
import { useDebounceFn } from '@vueuse/core'; import { NetworkError } from '@/types/errors';packages/extension/src/ui/onboard/create-wallet/routes.ts (1)
43-49
: 🛠️ Refactor suggestionAvoid mutating route objects and enhance type safety.
The function correctly transforms routes but has some potential issues:
- Direct mutation of route objects
- Unsafe type assertion on route.name
export default (): RouteRecordRaw[] => { - return Object.values(routes).map(route => { - route.path = `/${namespace}/${route.path}`; - route.name = `${namespace}-${String(route.name)}`; - return route; + return Object.values(routes).map(route => ({ + ...route, + path: `/${namespace}/${route.path}`, + name: `${namespace}-${route.name as string}`, + component: route.component, + })); }); };
🧹 Nitpick comments (39)
packages/extension/src/ui/action/views/network-assets/components/network-assets-error.vue (6)
6-7
: Fix typo in class name.The class name contains a typo: "network-assetss__error-button" has an extra 's'.
- class="network-assetss__error-button" + class="network-assets__error-button"
16-18
: Add type validation for updateAssets prop.The
updateAssets
prop should have proper type validation to ensure it's a required function.-defineProps({ - updateAssets: Function, -}); +defineProps({ + updateAssets: { + type: Function as PropType<() => void>, + required: true + } +});
40-42
: Remove unused 'a' selector in styles.The styles contain an unused 'a' selector. The component uses a button, not an anchor tag.
- a { - width: 150px; - }
48-61
: Consider using a composable for error handling logic.The timer-based error detection logic could be reused across components. Consider extracting it into a composable function.
Example implementation:
// useLoadingError.ts import { ref, watchEffect, onBeforeMount } from 'vue'; export function useLoadingError( condition: () => boolean, timeout: number = 30000 ) { let timer: NodeJS.Timeout | null = null; const assumedError = ref(false); watchEffect(() => { if (timer) { clearTimeout(timer); } if (condition()) { timer = setTimeout(() => { assumedError.value = true; }, timeout); } }); onBeforeMount(() => { if (timer) { clearTimeout(timer); } }); return { assumedError }; }Usage in component:
-let timer: NodeJS.Timeout | null = null; -const assumedError = ref(false); - -watchEffect(() => { - if (timer) { - clearTimeout(timer); - } - if (props.cryptoAmount == '~') { - timer = setTimeout(() => { - assumedError.value = true; - }, 30000); - } -}); - -onBeforeMount(() => { - if (timer) { - clearTimeout(timer); - } -}); +const { assumedError } = useLoadingError( + () => props.cryptoAmount === '~' +);
125-130
: Enhance error handling with specific error types.The catch block could provide more specific error handling based on the error type, and potentially retry the request for certain error types.
}) - .catch(() => { + .catch((error: Error) => { if (selectedNetworkName.value !== currentNetwork) return; + console.error('Failed to fetch assets:', error); + // Retry for network errors + if (error.name === 'NetworkError' && !error.message.includes('unauthorized')) { + setTimeout(updateAssets, 5000); + return; + } isFetchError.value = true; isLoading.value = false; assets.value = [];
112-132
: Consider using async/await for better readability.The promise chain could be refactored to use async/await for improved readability and error handling.
-const updateAssets = () => { +const updateAssets = async () => { isFetchError.value = false; isLoading.value = true; assets.value = []; const currentNetwork = selectedNetworkName.value; - if (props.accountInfo.selectedAccount?.address) { - props.network - .getAllTokenInfo(props.accountInfo.selectedAccount?.address || '') - .then(_assets => { - if (selectedNetworkName.value !== currentNetwork) return; - assets.value = _assets; - isLoading.value = false; - }) - .catch(() => { - if (selectedNetworkName.value !== currentNetwork) return; - isFetchError.value = true; - isLoading.value = false; - assets.value = []; - }); + try { + if (!props.accountInfo.selectedAccount?.address) return; + + const _assets = await props.network.getAllTokenInfo( + props.accountInfo.selectedAccount.address + ); + + if (selectedNetworkName.value !== currentNetwork) return; + + assets.value = _assets; + } catch (error) { + if (selectedNetworkName.value !== currentNetwork) return; + console.error('Failed to fetch assets:', error); + isFetchError.value = true; + assets.value = []; + } finally { + isLoading.value = false; } };packages/utils/src/nacl-encrypt-decrypt.ts (4)
13-14
: Consider adding input validation or error handling.
naclDecodeHex
relies onhexToBuffer(msgHex)
and subsequent base64 decoding. IfmsgHex
is malformed or empty, this could throw an unhandled error. You might want to wrap this operation in try/catch or validate input length upfront to improve robustness.
26-59
: Handle null return in decryption more explicitly.
IfnaclBox.open
fails, it returnsnull
, which causesencodeUTF8(decryptedMessage)
to throw. While it's currently caught and rethrown as "Decryption failed.", consider explicitly checking for anull
result before encoding to clarify the error path and potentially log additional context.
61-111
: Secure ephemeral key usage and memory cleanup.
naclEncrypt
appropriately incorporatesrandomBytes(24)
for the nonce and ephemeral key pair generation. However, for a fully robust implementation, consider securely cleaning (zeroing) the ephemeral secret key from memory once encryption is complete. This helps reduce the likelihood of sensitive key material lingering in memory longer than necessary.
113-119
: Ensure usage constraints are documented.
ExposingnaclDecrypt
andnaclEncrypt
to the broader codebase can encourage flexible use but also raises potential misuse concerns (e.g., storing private keys insecurely). Consider emphasizing best practices in documentation or using typed patterns that better guide correct usage.packages/utils/src/random-names.ts (3)
6-100
: Extensive adjective list.
Yourleft
array provides a wide range of adjectives that effectively diversify generated names. No issues found, though you might consider a brief note on how these terms were selected to maintain consistency or style if these are used broadly across your product.
586-592
: Support for non-ASCII strings.
sumAscii
adds the char codes. IfseedStr
includes extended Unicode characters, those code points could exceed single-byte ranges. Suggest clarifying or limiting the expected character set to avoid unexpected collisions or expanding to handle full Unicode.
594-602
: Non-cryptographic randomness.
generateRandomNameWithSeed
uses a sine-based pseudo-random formula suitable for reproducible naming but not for security-sensitive operations. Consider explicitly documenting this limitation to avoid confusion with cryptographically secure RNG usage.packages/swap/src/providers/zerox/index.ts (1)
193-195
: Adopt defensive checks for transaction fields.
The new approach of usingresponse.transaction.to/value/data
is appropriate; just confirm thatresponse.transaction
is always present in the API response, or add optional chaining or conditionals to future-proof against missing fields.packages/extension/src/libs/backup-state/index.ts (4)
35-50
: Consider alternative error handling strategy.
The#getSignature
method relies on console errors. For better resiliency, consider throwing a custom error or returning a structured error object. This prevents potential silent failures if external consumers ignore console output.
224-225
: Remove the unnecessary continue statement.
Static analysis flags this as redundant since there’s no logic following this path in the loop iteration. You can safely remove it with no functional impact.Apply this diff to remove the unnecessary statement:
await kr.renameAccount(existingAccount.address, newAccount.name); - continue; } else if (newAccount) {
🧰 Tools
🪛 Biome (1.9.4)
[error] 224-224: Unnecessary continue statement
Unsafe fix: Delete the unnecessary continue statement
(lint/correctness/noUnnecessaryContinue)
246-319
: Validate successful backups before updating state.
While this block properly handles backup encryption and uploads, it updates the backup state even if the server responds with a non-2xx status (only checksmessage === 'Ok'
). Ensure you handle unsuccessful HTTP status codes or unexpected response structures, e.g., if.json()
fails or a network error occurs.
321-360
: Enhance fallback or default state handling.
When no stored backup info exists, the code creates a new default state. Consider logging or informing the user about generated user IDs or forcibly returning a well-defined object. This ensures clarity in the UX and debugging process.packages/extension/src/libs/backup-state/types.ts (3)
7-11
: Add JSDoc comments to document the interface properties.While the property names are descriptive, adding JSDoc comments would help clarify their purpose and any constraints.
export interface IState { + /** Timestamp of the last successful backup */ lastBackupTime: number; + /** Unique identifier of the user */ userId: string; + /** Whether backup functionality is enabled */ enabled: boolean; }
13-20
: Consider using number type for timestamps consistently.For consistency with
lastBackupTime
inIState
, consider usingnumber
type forupdatedAt
to represent timestamps uniformly.export interface ListBackupType { userId: string; - updatedAt: string; + updatedAt: number; }
26-29
: Document security implications of excluded fields.Please add a comment explaining why
address
andpublicKey
are excluded from the backup data for security purposes.+/** + * Backup data structure that excludes sensitive account information (address and publicKey) + * for security purposes. + */ export interface BackupData { accounts: Omit<EnkryptAccount, 'address' | 'publicKey'>[]; uuid: string; }packages/extension/src/ui/action/views/settings/views/settings-backups/backup-identicon.vue (1)
18-34
: Optimize SVG positioning using transform.Replace negative margins with transform for better performance and maintainability.
.jdenticon-container { border-radius: 50%; overflow: hidden; height: 32px; width: 32px; position: relative; svg { width: 40px; height: 40px; position: absolute; - top: -4px; - left: -4px; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); } }packages/extension/src/ui/action/views/settings/components/settings-switch.vue (1)
45-46
: Remove duplicatebox-sizing
property.The
box-sizing
property is declared twice on consecutive lines.box-sizing: border-box; - box-sizing: border-box;
packages/extension/src/ui/onboard/restore-wallet/type-password.vue (1)
45-61
: Consider enhancing error feedback for users.While the error handling is good, consider showing a user-friendly error message instead of just logging to console.
.catch(error => { isInitializing.value = false; console.error('Wallet initialization failed:', error); + // Show user-friendly error message + store.setError('Failed to initialize wallet. Please try again.'); });packages/extension/src/libs/utils/initialize-wallet.ts (1)
62-91
: Consider adding error type information and improving error handling.While the backup state implementation is good, the error handling could be enhanced:
- The catch block silently logs errors
- The error type in the catch block is not specified
- } catch (e) { + } catch (e: unknown) { console.error(e); + if (e instanceof Error) { + console.error('Backup initialization failed:', e.message); + } return { backupsFound: false }; }packages/extension/src/ui/action/views/settings/index.vue (1)
60-60
: Consider adding state persistence for settings view.The backup settings state is managed in memory but not persisted. Consider saving the last active settings view to improve user experience when reopening settings.
+const SETTINGS_VIEW_KEY = 'last_settings_view'; + +const loadLastView = async () => { + const lastView = await browser.storage.local.get(SETTINGS_VIEW_KEY); + if (lastView[SETTINGS_VIEW_KEY]) { + setAllToFalse(); + switch (lastView[SETTINGS_VIEW_KEY]) { + case 'backups': + isBackups.value = true; + break; + // ... other cases + } + } +}; + const backupsAction = () => { setAllToFalse(); isBackups.value = true; + browser.storage.local.set({ [SETTINGS_VIEW_KEY]: 'backups' }); };Also applies to: 68-68, 117-120
packages/extension/src/ui/action/views/accounts/components/add-account-form.vue (1)
124-127
: Consider enhancing error handling for backup failures.While the backup operation is properly implemented as a non-blocking operation, consider enhancing the error handling to provide user feedback when backup fails, rather than just logging to console.
const backupState = new BackupState(); -backupState.backup(false).catch(() => { - console.error('Failed to backup'); -}); +backupState.backup(false).catch((error) => { + console.error('Failed to backup:', error); + // Show a non-blocking notification to the user + showNotification({ + type: 'error', + message: 'Account created successfully, but backup failed. You can retry backup in settings.', + }); +});packages/extension/src/types/provider.ts (1)
134-134
: Remove unnecessary constructor.The constructor can be safely removed as it doesn't add any functionality beyond what the default constructor would provide.
- constructor(node: string, options?: unknown) {}
🧰 Tools
🪛 Biome (1.9.4)
[error] 134-134: This constructor is unnecessary.
Unsafe fix: Remove the unnecessary constructor.
(lint/complexity/noUselessConstructor)
packages/extension/src/ui/onboard/restore-wallet/backup-detected.vue (3)
11-25
: Enhance accessibility for backup selection.The backup selection uses anchor tags (
<a>
) for clickable items without proper ARIA attributes or keyboard navigation support.<a v-for="backup in backups" :key="backup.userId" @click="selectBackup(backup)" + role="button" + tabindex="0" + :aria-selected="selectedBackup === backup" + @keyup.enter="selectBackup(backup)" + @keyup.space="selectBackup(backup)" :class="[ { selected: selectedBackup === backup }, 'backup-detected__backup-item', ]" >
84-108
: Consider implementing retry logic for backup loading.The component attempts to create a new account if loading the main wallet fails, but doesn't retry loading backups if that fails.
onBeforeMount(async () => { await kr.unlock(unref(password)); - await backupState.getMainWallet().catch(async () => { + await backupState.getMainWallet().catch(async (error) => { + console.error('Failed to get main wallet:', error); await kr.saveNewAccount({ basePath: EthereumNetworks.ethereum.basePath, name: 'EVM Account 1', signerType: EthereumNetworks.ethereum.signer[0], walletType: WalletType.mnemonic, }); }); - const mainWallet = await backupState.getMainWallet(); + let retries = 3; + let mainWallet; + while (retries > 0) { + try { + mainWallet = await backupState.getMainWallet(); + break; + } catch (error) { + console.error(`Failed to get main wallet (${retries} retries left):`, error); + retries--; + if (retries === 0) throw error; + await new Promise(resolve => setTimeout(resolve, 1000)); + } + }
113-130
: Enhance error handling in backup restoration.The error handling in
useBackup
could provide more specific error feedback to users.const useBackup = async () => { if (selectedBackup.value) { backupBtnText.value = 'Restoring backup...'; processing.value = true; await backupState .restoreBackup(selectedBackup.value.userId, unref(password)) .then(() => { router.push({ name: routes.walletReady.name, }); }) - .catch(() => { - backupBtnText.value = 'Failed to restore backup'; + .catch((error) => { + console.error('Backup restoration failed:', error); + backupBtnText.value = `Failed to restore backup: ${error.message || 'Unknown error'}`; processing.value = false; selectedBackup.value = undefined; }); } };packages/extension/src/ui/action/views/settings/views/settings-backups/index.vue (2)
19-20
: Consider adding aria-labels for better accessibility.The loading states and empty states could benefit from proper aria-labels to improve screen reader support.
- <div class="settings-container__backup"> + <div class="settings-container__backup" role="status" aria-label="Fetching backups"> - <div class="settings-container__backup-header">Fetching backups</div> + <div class="settings-container__backup-header" aria-live="polite">Fetching backups</div> - v-else-if="backups.length === 0" - class="settings-container__backup" + v-else-if="backups.length === 0" + class="settings-container__backup" + role="status" + aria-label="No backups found"Also applies to: 26-27, 36-40
68-74
: Add keyboard navigation support for delete button.The delete button should be keyboard accessible and have proper aria-label.
- class="settings-container__backup-status-button" - @click="showDeleteBackup(entity)" + class="settings-container__backup-status-button" + role="button" + tabindex="0" + aria-label="Delete backup" + @click="showDeleteBackup(entity)" + @keyup.enter="showDeleteBackup(entity)"packages/extension/src/ui/action/views/swap/libs/send-transactions.ts (2)
243-243
: Remove Unnecessary Labeled Break in Legacy Branch
Static analysis flags the label used in thebreak update_block_hash;
statement as unnecessary. Consider replacing it with a plainbreak;
for a cleaner control flow.- break update_block_hash; + break;🧰 Tools
🪛 Biome (1.9.4)
[error] 243-243: Unnecessary label.
Safe fix: Remove the unnecessary label.
You can achieve the same result without the label.(lint/complexity/noUselessLabel)
354-354
: Remove Unnecessary Labeled Break in Versioned Branch
The break statement using the labelupdate_block_hash
is superfluous. Simplify the control flow by removing the label and using a plainbreak;
.- break update_block_hash; + break;🧰 Tools
🪛 Biome (1.9.4)
[error] 354-354: Unnecessary label.
Safe fix: Remove the unnecessary label.
You can achieve the same result without the label.(lint/complexity/noUselessLabel)
packages/extension/src/ui/action/views/network-activity/components/network-activity-total.vue (2)
2-13
: Enhance error message for better user experience.The error message could be more user-friendly and provide clearer next steps.
Consider this improvement:
- <span>Loading balance error. Please try again later</span> + <span>Unable to load balance. Please check your connection and try refreshing the page.</span>
74-82
: Enhance error state visibility.Consider adding more visual cues to make the error state more noticeable.
Consider these style improvements:
&__total-error { padding: 0 20px 12px 20px; h3 { + display: flex; + align-items: center; + gap: 8px; + + &::before { + content: '!'; + width: 20px; + height: 20px; + border-radius: 50%; + background: @error; + color: @white; + display: flex; + align-items: center; + justify-content: center; + font-size: 14px; + } + span { color: @error; } } }packages/extension/src/ui/action/views/network-assets/index.vue (1)
18-21
: Consider repositioning the error component.The error component's position in the template could be improved for better user experience.
Consider moving it before the assets list to ensure users see the error message immediately:
- <network-assets-header v-if="!isLoading && assets.length > 0" /> <network-assets-error v-if="isFetchError" :update-assets="updateAssets" /> + <network-assets-header v-if="!isLoading && assets.length > 0" />packages/extension/src/ui/onboard/create-wallet/routes.ts (1)
9-41
: Consider enhancing type safety for route paths and names.The routes object is well-structured and covers the complete wallet creation flow. Consider these improvements:
+// Define path constants for type safety +const ROUTES_PATH = { + PICK_PASSWORD: 'pick-password', + TYPE_PASSWORD: 'type-password', + RECOVERY_PHRASE: 'recovery-phrase', + CHECK_PHRASE: 'check-phrase', + USER_ANALYTICS: 'user-analytics', + WALLET_READY: 'wallet-ready', +} as const; + +// Define route names enum for type safety +enum ROUTES_NAME { + PICK_PASSWORD = 'pick-password', + TYPE_PASSWORD = 'type-password', + RECOVERY_PHRASE = 'recovery-phrase', + CHECK_PHRASE = 'check-phrase', + USER_ANALYTICS = 'user-analytics', + WALLET_READY = 'wallet-ready', +} + export const routes = { pickPassword: { - path: 'pick-password', - name: 'pick-password', + path: ROUTES_PATH.PICK_PASSWORD, + name: ROUTES_NAME.PICK_PASSWORD, component: PickPassword, }, // Apply similar changes to other routes... };
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
yarn.lock
is excluded by!**/yarn.lock
,!**/*.lock
📒 Files selected for processing (39)
packages/extension/package.json
(3 hunks)packages/extension/src/libs/backup-state/configs.ts
(1 hunks)packages/extension/src/libs/backup-state/index.ts
(1 hunks)packages/extension/src/libs/backup-state/types.ts
(1 hunks)packages/extension/src/libs/keyring/public-keyring.ts
(8 hunks)packages/extension/src/libs/utils/initialize-wallet.ts
(2 hunks)packages/extension/src/providers/common/ui/send-transaction/send-address-item.vue
(1 hunks)packages/extension/src/providers/common/ui/send-transaction/send-contacts-list.vue
(4 hunks)packages/extension/src/providers/ethereum/ui/send-transaction/index.vue
(1 hunks)packages/extension/src/types/provider.ts
(2 hunks)packages/extension/src/ui/action/App.vue
(5 hunks)packages/extension/src/ui/action/components/switch/index.vue
(1 hunks)packages/extension/src/ui/action/views/accounts/components/add-account-form.vue
(2 hunks)packages/extension/src/ui/action/views/network-activity/components/network-activity-total.vue
(3 hunks)packages/extension/src/ui/action/views/network-assets/components/network-assets-error.vue
(1 hunks)packages/extension/src/ui/action/views/network-assets/index.vue
(5 hunks)packages/extension/src/ui/action/views/settings/components/settings-inner-header.vue
(2 hunks)packages/extension/src/ui/action/views/settings/components/settings-switch.vue
(4 hunks)packages/extension/src/ui/action/views/settings/index.vue
(5 hunks)packages/extension/src/ui/action/views/settings/views/settings-backups/backup-identicon.vue
(1 hunks)packages/extension/src/ui/action/views/settings/views/settings-backups/index.vue
(1 hunks)packages/extension/src/ui/action/views/settings/views/settings-general/index.vue
(3 hunks)packages/extension/src/ui/action/views/swap/libs/send-transactions.ts
(15 hunks)packages/extension/src/ui/onboard/App.vue
(6 hunks)packages/extension/src/ui/onboard/create-wallet/routes.ts
(1 hunks)packages/extension/src/ui/onboard/create-wallet/store.ts
(1 hunks)packages/extension/src/ui/onboard/create-wallet/wallet-ready.vue
(1 hunks)packages/extension/src/ui/onboard/restore-wallet/backup-detected.vue
(1 hunks)packages/extension/src/ui/onboard/restore-wallet/routes.ts
(2 hunks)packages/extension/src/ui/onboard/restore-wallet/type-password.vue
(2 hunks)packages/signers/ethereum/src/index.ts
(1 hunks)packages/signers/ethereum/src/utils.ts
(0 hunks)packages/swap/src/providers/zerox/index.ts
(4 hunks)packages/swap/src/providers/zerox/types.ts
(1 hunks)packages/types/src/index.ts
(1 hunks)packages/utils/package.json
(1 hunks)packages/utils/src/index.ts
(2 hunks)packages/utils/src/nacl-encrypt-decrypt.ts
(1 hunks)packages/utils/src/random-names.ts
(1 hunks)
💤 Files with no reviewable changes (1)
- packages/signers/ethereum/src/utils.ts
✅ Files skipped from review due to trivial changes (4)
- packages/extension/src/libs/backup-state/configs.ts
- packages/extension/src/providers/common/ui/send-transaction/send-address-item.vue
- packages/signers/ethereum/src/index.ts
- packages/extension/src/ui/onboard/create-wallet/store.ts
🚧 Files skipped from review as they are similar to previous changes (4)
- packages/extension/src/ui/onboard/App.vue
- packages/extension/src/ui/action/App.vue
- packages/utils/package.json
- packages/extension/package.json
🧰 Additional context used
🪛 Biome (1.9.4)
packages/extension/src/types/provider.ts
[error] 134-134: This constructor is unnecessary.
Unsafe fix: Remove the unnecessary constructor.
(lint/complexity/noUselessConstructor)
packages/extension/src/libs/backup-state/index.ts
[error] 224-224: Unnecessary continue statement
Unsafe fix: Delete the unnecessary continue statement
(lint/correctness/noUnnecessaryContinue)
packages/extension/src/ui/action/views/swap/libs/send-transactions.ts
[error] 243-243: Unnecessary label.
Safe fix: Remove the unnecessary label.
You can achieve the same result without the label.
(lint/complexity/noUselessLabel)
[error] 354-354: Unnecessary label.
Safe fix: Remove the unnecessary label.
You can achieve the same result without the label.
(lint/complexity/noUselessLabel)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: buildAll
- GitHub Check: test
🔇 Additional comments (38)
packages/utils/src/nacl-encrypt-decrypt.ts (1)
16-19
: Validate JSON parsing.
When parsing the return ofhexToBuffer(strData)
, an invalid or corrupted hex string could raise aSyntaxError
with no user-friendly fallback. Consider a try/catch block to return a clear message or fallback.packages/utils/src/index.ts (2)
14-20
: Centralized import improvement.
Bringing all NaCl encryption utilities into the main export file helps keep the utility layer cohesive and discoverable. Great addition.
53-58
: Check for potential naming collisions.
All newly exported symbols (naclEncrypt
,naclDecrypt
, etc.) appear unique. However, be mindful as the codebase grows that these cryptographic utility exports might eventually clash with similarly named functions or constants. Consider a naming pattern (e.g., prefixing) if you foresee expansions.packages/utils/src/random-names.ts (1)
102-584
: Comprehensive name list.
Theright
array is quite thorough, referencing many historical figures. Just be mindful of potential trademark/copyright concerns with certain names in specialized contexts.packages/swap/src/providers/zerox/index.ts (3)
73-73
: Verify the updated API endpoint rigorously.
The change tohttps://partners.mewapi.io/zeroxv2
looks fine for a versioned migration, but please confirm all downstream services and integrations are compatible with the new endpoint.
157-157
: Confirm renaming the parameter to match API specs.
Ensure the newtaker
parameter (changed from the previously usedtakerAddress
) matches exactly what the endpoint expects.
168-169
: Validate the construction of the query parameters.
Appending the chain ID as a query parameter instead of the path is likely correct given the new API structure. However, please verify that the endpoint consistently expectschainId
in this manner.packages/extension/src/libs/backup-state/index.ts (1)
91-94
: Check for missing or invalid signatures.
When!signature
, the code logs an error and returns an empty array. Double-check that this behavior is desired or consider throwing an error to inform upstream processes.packages/swap/src/providers/zerox/types.ts (1)
4-10
: Good structuring of the transaction fields.
Consolidating related properties intoZeroXResponseTransactionType
and referencing it viatransaction
inZeroXResponseType
is a cleaner approach. Moving away from flat fields reduces confusion and simplifies usage.Also applies to: 17-17
packages/extension/src/libs/backup-state/types.ts (2)
3-5
: LGTM!The enum follows TypeScript naming conventions and uses a descriptive key name.
22-24
: LGTM!The interface follows a common pattern for API responses and TypeScript naming conventions.
packages/extension/src/ui/action/views/settings/views/settings-backups/backup-identicon.vue (1)
1-3
: LGTM!The template is minimal and follows Vue best practices.
packages/extension/src/ui/onboard/restore-wallet/routes.ts (1)
8-8
: LGTM!The new backup detection route follows the established naming conventions and routing patterns.
Also applies to: 41-45
packages/extension/src/ui/action/views/settings/components/settings-switch.vue (1)
2-66
: LGTM! The border customization enhances component flexibility.The new
hasBorder
prop with conditional styling allows for better component customization while maintaining backward compatibility through the default value.packages/extension/src/ui/action/components/switch/index.vue (1)
3-3
: LGTM! Excellent refactor to use Vue's v-model pattern.The changes improve the component by:
- Using Vue's built-in v-model directive for better reactivity
- Simplifying state management with a computed property
- Following Vue 3 best practices for two-way binding
Also applies to: 18-23
packages/extension/src/ui/action/views/settings/components/settings-inner-header.vue (1)
11-11
: LGTM! Clean addition of backup settings section.The implementation maintains consistency with existing patterns and properly integrates the new backup settings section.
Also applies to: 47-50
packages/extension/src/ui/onboard/restore-wallet/type-password.vue (1)
30-30
: LGTM! Improved reactive state handling and error management.The changes enhance the component by:
- Properly handling reactive references with
unref
- Adding error handling for wallet initialization
- Supporting the new backup detection feature
Also applies to: 45-66
packages/extension/src/libs/utils/initialize-wallet.ts (1)
11-25
: LGTM! Filtering test wallets enhances account management.The addition of test wallet filtering improves account management by ensuring only production wallets are considered during initialization.
packages/extension/src/ui/action/views/settings/index.vue (1)
42-47
: LGTM! Clean integration of backup settings component.The backup settings component is well-integrated with consistent event handling patterns.
packages/types/src/index.ts (1)
72-76
: LGTM! Well-typed interface extension.The optional isTestWallet property is appropriately typed and maintains backward compatibility.
packages/extension/src/ui/action/views/settings/views/settings-general/index.vue (2)
52-58
: LGTM! Clear and informative backup settings UI.The backup button and description provide clear information about the backup functionality.
76-76
: LGTM! Clean event handling implementation.The event emission is well-typed and follows Vue 3 best practices.
Also applies to: 88-90
packages/extension/src/libs/keyring/public-keyring.ts (1)
26-26
: LGTM! Test wallet identification added.The
isTestWallet
property is consistently added to all test wallet accounts, properly scoped within the development environment.Also applies to: 37-37, 48-48, 59-59, 70-70, 84-84, 95-95, 106-106
packages/extension/src/types/provider.ts (1)
56-56
: LGTM! Storage namespace added for backup state.The
backupState
enum value is properly added to support the new backup functionality.packages/extension/src/providers/common/ui/send-transaction/send-contacts-list.vue (2)
120-131
: Good error handling in address comparison.The
isChecked
method properly handles potential errors during address comparison and provides a safe fallback.
42-42
: Consistent usage of isChecked method.The
isChecked
method is consistently used across all instances where address comparison is needed, improving maintainability.Also applies to: 54-54, 72-72
packages/extension/src/providers/ethereum/ui/send-transaction/index.vue (1)
45-50
: Improved UX by closing contact selection after paste.The modification enhances user experience by automatically closing the contact selection interface after pasting an address.
packages/extension/src/ui/action/views/swap/libs/send-transactions.ts (10)
76-78
: Type Annotation Update forexecuteSwap
Signature
The return type now uses semicolons ({ hash: string; sentAt: number }
) instead of commas. This change improves clarity and consistency in your type definitions.
176-177
: Consistent Return Value in Substrate Branch
The Substrate branch now returns an object matching the updated type ({ hash: string; sentAt: number }
). Ensure that any consuming code reflects this updated structure.
181-181
: Updated Type Annotation forsolTxs
The declaration ofsolTxs
now uses semicolon separators in its type definition, which brings it in line with the overall TypeScript style used elsewhere in the codebase.
220-223
: Consistent Error Message Formatting in Legacy Branch
The warning log for fee retrieval now uses a consistent template literal format. This small refinement improves readability in error reporting.
332-334
: Consistent Error Message Formatting in Versioned Branch
The error message for checking the fee in the versioned transaction branch now follows a consistent format. This enhances clarity when logging issues.
341-343
: Enhanced Warning Log for Outdated Block Hash in Versioned Branch
The warning log notifying that the unsigned versioned transaction may have an out-of-date block hash has been updated for clarity and consistency.
369-372
: Improved Logging for Blockhash Retrieval Attempts in Versioned Branch
The warning message for a failed attempt to fetch the latest blockhash now clearly includes the attempt number, which makes debugging easier.
507-507
: Updated Type Annotation fortxPromises
The variabletxPromises
is now defined with the type{ hash:
0x${string}; sentAt: number }[]
, using semicolons for separation. This aligns the annotation with the overall style used in the code.
569-569
: Consistent Structure for EVM Transaction Promises
When pushing totxPromises
, the transaction object now adheres to the updated type structure. This ensures consistency across transaction types and improves type safety.
478-478
: Consistent Appending tosolTxs
Array
The object{ hash: txHash, sentAt: Date.now() }
pushed intosolTxs
properly conforms to the updated type definition, maintaining uniformity in the Solana branch.packages/extension/src/ui/onboard/create-wallet/routes.ts (1)
1-8
: LGTM!The imports are well-organized, with local components grouped together followed by external dependencies. The empty line provides good visual separation.
onMounted(() => { | ||
onboardStore.setPassword(''); | ||
onboardStore.setMnemonic(''); | ||
restoreStore.setMnemonic(''); | ||
restoreStore.setPassword(''); | ||
}); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🛠️ Refactor suggestion
Enhance security when clearing sensitive data.
Using empty strings to clear sensitive data might leave traces in memory. Consider using a more secure approach to clear sensitive information.
Here's a suggested implementation using a secure clear function:
+const secureClear = (value: string) => {
+ // Overwrite the string with random data before setting to empty
+ const array = new Uint8Array(value.length);
+ crypto.getRandomValues(array);
+ const random = String.fromCharCode(...array);
+ value = random;
+ value = '';
+ return value;
+};
+
onMounted(() => {
- onboardStore.setPassword('');
- onboardStore.setMnemonic('');
- restoreStore.setMnemonic('');
- restoreStore.setPassword('');
+ onboardStore.setPassword(secureClear(onboardStore.password));
+ onboardStore.setMnemonic(secureClear(onboardStore.mnemonic));
+ restoreStore.setMnemonic(secureClear(restoreStore.mnemonic));
+ restoreStore.setPassword(secureClear(restoreStore.password));
});
📝 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. Thoroughly test & benchmark the code to ensure it meets the requirements.
onMounted(() => { | |
onboardStore.setPassword(''); | |
onboardStore.setMnemonic(''); | |
restoreStore.setMnemonic(''); | |
restoreStore.setPassword(''); | |
}); | |
const secureClear = (value: string) => { | |
// Overwrite the string with random data before setting to empty | |
const array = new Uint8Array(value.length); | |
crypto.getRandomValues(array); | |
const random = String.fromCharCode(...array); | |
value = random; | |
value = ''; | |
return value; | |
}; | |
onMounted(() => { | |
onboardStore.setPassword(secureClear(onboardStore.password)); | |
onboardStore.setMnemonic(secureClear(onboardStore.mnemonic)); | |
restoreStore.setMnemonic(secureClear(restoreStore.mnemonic)); | |
restoreStore.setPassword(secureClear(restoreStore.password)); | |
}); |
<script setup lang="ts"> | ||
import { useTemplateRef, onMounted, Ref } from 'vue'; | ||
import * as jdenticon from 'jdenticon'; | ||
|
||
const props = defineProps<{ | ||
hash: string; | ||
}>(); | ||
const element: Ref<HTMLElement> = useTemplateRef('jdenticonHolder'); | ||
onMounted(() => { | ||
element.value.innerHTML = jdenticon.toSvg(props.hash, 200); | ||
}); | ||
</script> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Add input validation and sanitize SVG output.
The current implementation has potential security concerns:
- No validation of the hash prop
- Direct innerHTML manipulation with unsanitized SVG
Consider adding input validation and using a sanitizer library for the SVG output.
import { useTemplateRef, onMounted, Ref } from 'vue';
import * as jdenticon from 'jdenticon';
+import DOMPurify from 'dompurify';
const props = defineProps<{
hash: string;
}>();
+
+const validateHash = (hash: string) => {
+ return /^[a-f0-9]{32,}$/i.test(hash);
+};
+
const element: Ref<HTMLElement> = useTemplateRef('jdenticonHolder');
onMounted(() => {
- element.value.innerHTML = jdenticon.toSvg(props.hash, 200);
+ if (!validateHash(props.hash)) {
+ console.error('Invalid hash provided to backup-identicon');
+ return;
+ }
+ const svg = jdenticon.toSvg(props.hash, 200);
+ element.value.innerHTML = DOMPurify.sanitize(svg);
});
📝 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. Thoroughly test & benchmark the code to ensure it meets the requirements.
<script setup lang="ts"> | |
import { useTemplateRef, onMounted, Ref } from 'vue'; | |
import * as jdenticon from 'jdenticon'; | |
const props = defineProps<{ | |
hash: string; | |
}>(); | |
const element: Ref<HTMLElement> = useTemplateRef('jdenticonHolder'); | |
onMounted(() => { | |
element.value.innerHTML = jdenticon.toSvg(props.hash, 200); | |
}); | |
</script> | |
<script setup lang="ts"> | |
import { useTemplateRef, onMounted, Ref } from 'vue'; | |
import * as jdenticon from 'jdenticon'; | |
import DOMPurify from 'dompurify'; | |
const props = defineProps<{ | |
hash: string; | |
}>(); | |
const validateHash = (hash: string) => { | |
return /^[a-f0-9]{32,}$/i.test(hash); | |
}; | |
const element: Ref<HTMLElement> = useTemplateRef('jdenticonHolder'); | |
onMounted(() => { | |
if (!validateHash(props.hash)) { | |
console.error('Invalid hash provided to backup-identicon'); | |
return; | |
} | |
const svg = jdenticon.toSvg(props.hash, 200); | |
element.value.innerHTML = DOMPurify.sanitize(svg); | |
}); | |
</script> |
const deleteBackup = async (userId: string) => { | ||
loading.value = true; | ||
await backupState.deleteBackup(userId); | ||
backups.value = await backupState.listBackups(); | ||
loading.value = false; | ||
isDelete.value = false; | ||
}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🛠️ Refactor suggestion
Add error handling for delete operation.
The deleteBackup
method should handle potential errors during deletion.
const deleteBackup = async (userId: string) => {
+ try {
loading.value = true;
await backupState.deleteBackup(userId);
backups.value = await backupState.listBackups();
+ } catch (error) {
+ console.error('Error deleting backup:', error);
+ // TODO: Show error to user
+ } finally {
loading.value = false;
isDelete.value = false;
+ }
};
📝 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. Thoroughly test & benchmark the code to ensure it meets the requirements.
const deleteBackup = async (userId: string) => { | |
loading.value = true; | |
await backupState.deleteBackup(userId); | |
backups.value = await backupState.listBackups(); | |
loading.value = false; | |
isDelete.value = false; | |
}; | |
const deleteBackup = async (userId: string) => { | |
try { | |
loading.value = true; | |
await backupState.deleteBackup(userId); | |
backups.value = await backupState.listBackups(); | |
} catch (error) { | |
console.error('Error deleting backup:', error); | |
// TODO: Show error to user | |
} finally { | |
loading.value = false; | |
isDelete.value = false; | |
} | |
}; |
const toggleBackups = async (checked: boolean) => { | ||
isBackupsEnabled.value = checked; | ||
loading.value = true; | ||
if (isBackupsEnabled.value) { | ||
await backupState.enableBackups(); | ||
await backupState.backup(false); | ||
backups.value = await backupState.listBackups(); | ||
} else { | ||
await backupState.disableBackups(); | ||
} | ||
loading.value = false; | ||
}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🛠️ Refactor suggestion
Add error handling for backup operations.
The toggleBackups
method should handle potential errors during backup operations.
const toggleBackups = async (checked: boolean) => {
+ try {
isBackupsEnabled.value = checked;
loading.value = true;
if (isBackupsEnabled.value) {
await backupState.enableBackups();
await backupState.backup(false);
backups.value = await backupState.listBackups();
} else {
await backupState.disableBackups();
}
+ } catch (error) {
+ console.error('Error toggling backups:', error);
+ // TODO: Show error to user
+ isBackupsEnabled.value = !checked; // Revert the toggle
+ } finally {
loading.value = false;
+ }
};
📝 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. Thoroughly test & benchmark the code to ensure it meets the requirements.
const toggleBackups = async (checked: boolean) => { | |
isBackupsEnabled.value = checked; | |
loading.value = true; | |
if (isBackupsEnabled.value) { | |
await backupState.enableBackups(); | |
await backupState.backup(false); | |
backups.value = await backupState.listBackups(); | |
} else { | |
await backupState.disableBackups(); | |
} | |
loading.value = false; | |
}; | |
const toggleBackups = async (checked: boolean) => { | |
try { | |
isBackupsEnabled.value = checked; | |
loading.value = true; | |
if (isBackupsEnabled.value) { | |
await backupState.enableBackups(); | |
await backupState.backup(false); | |
backups.value = await backupState.listBackups(); | |
} else { | |
await backupState.disableBackups(); | |
} | |
} catch (error) { | |
console.error('Error toggling backups:', error); | |
// TODO: Show error to user | |
isBackupsEnabled.value = !checked; // Revert the toggle | |
} finally { | |
loading.value = false; | |
} | |
}; |
let timer: NodeJS.Timeout | null = null; | ||
const assumedError = ref(false); | ||
|
||
watchEffect(() => { | ||
if (timer) { | ||
clearTimeout(timer); | ||
} | ||
// set the timer on initial change to blank | ||
if (props.cryptoAmount == '~') { | ||
timer = setTimeout(() => { | ||
assumedError.value = true; | ||
}, 30000); | ||
} | ||
}); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🛠️ Refactor suggestion
Consider adjusting timeout duration and adding error state reset.
The current implementation has two potential issues:
- 30-second timeout might be too long for users to wait.
- Error state doesn't reset when valid data is received.
Consider these improvements:
watchEffect(() => {
if (timer) {
clearTimeout(timer);
}
- // set the timer on initial change to blank
if (props.cryptoAmount == '~') {
timer = setTimeout(() => {
assumedError.value = true;
- }, 30000);
+ }, 15000); // Consider reducing timeout to 15 seconds
+ } else {
+ assumedError.value = false; // Reset error state when valid data is received
}
});
📝 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. Thoroughly test & benchmark the code to ensure it meets the requirements.
let timer: NodeJS.Timeout | null = null; | |
const assumedError = ref(false); | |
watchEffect(() => { | |
if (timer) { | |
clearTimeout(timer); | |
} | |
// set the timer on initial change to blank | |
if (props.cryptoAmount == '~') { | |
timer = setTimeout(() => { | |
assumedError.value = true; | |
}, 30000); | |
} | |
}); | |
let timer: NodeJS.Timeout | null = null; | |
const assumedError = ref(false); | |
watchEffect(() => { | |
if (timer) { | |
clearTimeout(timer); | |
} | |
if (props.cryptoAmount == '~') { | |
timer = setTimeout(() => { | |
assumedError.value = true; | |
}, 15000); // Consider reducing timeout to 15 seconds | |
} else { | |
assumedError.value = false; // Reset error state when valid data is received | |
} | |
}); |
devop: token 2022 support
There was a problem hiding this 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
🧹 Nitpick comments (4)
packages/extension/src/providers/ethereum/libs/assets-handlers/solanachain.ts (1)
20-31
: Consider adding error handling for token account fetching.While the concurrent fetching is efficient, there's no explicit error handling if one of the requests fails.
- ]).then(([tokenAccounts, tokenAccounts2022]) => { + ]).then(([tokenAccounts, tokenAccounts2022]) => { + if (!tokenAccounts || !tokenAccounts2022) { + throw new Error('Failed to fetch token accounts'); + }packages/swap/src/providers/jupiter/index.ts (1)
351-351
: Consider adding a comment explaining TOKEN_2022 referral fee exclusion.While the logic is correct, it would be helpful to document why TOKEN_2022 tokens are excluded from referral fee handling.
- } else if (!referrerATAExists && !isSrcToken2022) { + } else if (!referrerATAExists && !isSrcToken2022) { + // Skip referral fee handling for TOKEN_2022 tokens as they use a different fee mechanismpackages/extension/src/providers/solana/ui/send-transaction/index.vue (2)
529-540
: Consider caching the program ID.The program ID is used multiple times in the function. Consider storing it in a variable to avoid potential inconsistencies and improve readability.
+ const tokenProgramId = programId!.owner; const associatedTokenTo = getAssociatedTokenAddressSync( contract, to, undefined, - programId!.owner, + tokenProgramId, ); const associatedTokenFrom = getAssociatedTokenAddressSync( contract, from, undefined, - programId!.owner, + tokenProgramId, );
550-559
: Consider extracting token transfer logic.The token transfer logic is duplicated between the cases where the associated token account exists and when it needs to be created. Consider extracting this into a helper function to reduce code duplication.
+ const createTransferInst = (from: PublicKey, to: PublicKey, owner: PublicKey) => + createTransferInstruction( + from, + to, + owner, + toBN(TxInfo.value.value).toNumber(), + [], + tokenProgramId, + ); if (validATA) { - transaction.add( - createTransferInstruction( - associatedTokenFrom, - associatedTokenTo, - from, - toBN(TxInfo.value.value).toNumber(), - [], - programId!.owner, - ), - ); + transaction.add(createTransferInst(associatedTokenFrom, associatedTokenTo, from)); } else { transaction.add( createAssociatedTokenAccountInstruction( from, associatedTokenTo, to, contract, - programId!.owner, + tokenProgramId, ), ); - transaction.add( - createTransferInstruction( - associatedTokenFrom, - associatedTokenTo, - from, - toBN(TxInfo.value.value).toNumber(), - [], - programId!.owner, - ), - ); + transaction.add(createTransferInst(associatedTokenFrom, associatedTokenTo, from));Also applies to: 561-579
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (5)
packages/extension/src/providers/ethereum/libs/assets-handlers/solanachain.ts
(1 hunks)packages/extension/src/providers/solana/ui/libs/decode-tx.ts
(2 hunks)packages/extension/src/providers/solana/ui/send-transaction/index.vue
(4 hunks)packages/extension/src/providers/solana/ui/sol-verify-transaction.vue
(1 hunks)packages/swap/src/providers/jupiter/index.ts
(3 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: buildAll
- GitHub Check: test
🔇 Additional comments (7)
packages/extension/src/providers/ethereum/libs/assets-handlers/solanachain.ts (2)
5-6
: LGTM! Good addition of TOKEN_2022_PROGRAM_ID support.The imports are correctly structured to support the new token program functionality.
12-19
: Efficient concurrent fetching of token accounts.The use of Promise.all for concurrent fetching from both TOKEN_PROGRAM_ID and TOKEN_2022_PROGRAM_ID is a good optimization.
packages/extension/src/providers/solana/ui/libs/decode-tx.ts (1)
81-84
: Good enhancement of account filtering logic.The changes correctly:
- Include TOKEN_2022_PROGRAM_ID in account filtering
- Use >= for data length check, which is more flexible and future-proof
packages/extension/src/providers/solana/ui/sol-verify-transaction.vue (1)
282-293
: Improved blockhash handling with safety checks.The changes add proper checks to prevent overwriting existing blockhash values for both legacy and versioned transactions.
packages/swap/src/providers/jupiter/index.ts (2)
321-324
: Good addition of TOKEN_2022 program detection.The code correctly identifies tokens from the TOKEN_2022 program.
330-330
: Proper handling of referral fees for TOKEN_2022 tokens.Setting referrerATAPubkey to undefined for TOKEN_2022 tokens is the correct approach to skip referral fee handling.
packages/extension/src/providers/solana/ui/send-transaction/index.vue (1)
541-546
:❓ Verification inconclusive
Verify the account existence check.
The
getAccount
call is used to check if the associated token account exists, but it might throw errors for reasons other than non-existence. Consider using a more specific error check.
🏁 Script executed:
#!/bin/bash # Description: Check if there are any specific error types we should handle in getAccount # Search for getAccount usage patterns in the codebase rg -A 5 "getAccount.*catch"Length of output: 29
Action Required: Refine Error Handling for
getAccount
In the file
packages/extension/src/providers/solana/ui/send-transaction/index.vue
(lines 541–546), the call togetAccount
is used to verify the existence of the associated token account. However, without a surrounding try/catch or a mechanism to filter specific error cases, any error thrown bygetAccount
—whether due to a missing account or another issue (e.g., network issues, misconfiguration)—could lead to ambiguous behavior. Please verify thatgetAccount
distinguishes between expected “account not found” errors and other failures. Depending on the findings, consider adding a try/catch block with refined error checks to ensure that only the intended error case (i.e., a missing account) triggers the specific handling logic.
const programId = await solConnection.value!.web3.getAccountInfo(contract); | ||
const associatedTokenTo = getAssociatedTokenAddressSync( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Add error handling for getAccountInfo call.
The getAccountInfo
call could fail if the contract account doesn't exist, but there's no error handling in place. This could lead to runtime errors when trying to access programId!.owner
.
Add error handling:
- const programId = await solConnection.value!.web3.getAccountInfo(contract);
+ const programId = await solConnection.value!.web3.getAccountInfo(contract);
+ if (!programId) {
+ throw new Error('Contract account not 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. Thoroughly test & benchmark the code to ensure it meets the requirements.
const programId = await solConnection.value!.web3.getAccountInfo(contract); | |
const associatedTokenTo = getAssociatedTokenAddressSync( | |
const programId = await solConnection.value!.web3.getAccountInfo(contract); | |
if (!programId) { | |
throw new Error('Contract account not found'); | |
} | |
const associatedTokenTo = getAssociatedTokenAddressSync( |
Summary by CodeRabbit
Style
New Features