Skip to content

Commit

Permalink
feat: Support CAIP-10 addresses in Snaps (#26799)
Browse files Browse the repository at this point in the history
<!--
Please submit this PR as a draft initially.
Do not mark it as "Ready for review" until the template has been
completely filled out, and PR status checks have passed at least once.
-->

Add support for showing CAIP-10 addresses in Snaps by introducing
`SnapUIAddress`. This component mimics the original implementation of
`ConfirmInfoRowAddress` but also adds parsing logic for CAIP-10
addresses.

CAIP-10 addresses are parsed in the component and the address part is
passed to the jazzicon or blockie implementation to render an avatar.
The blockie implementation supports arbitrary strings and did not need
to be altered. For jazzicons, this PR implements seed generation that is
compatible with any address string by seeding the PRNG used for
jazzicons with the normalized byte array of the address. Plain Ethereum
addresses are still supported and will use the regular jazzicon seed
generation logic.

This PR will also need a release of the Snaps packages to update the JSX
validation to allow passing CAIP-10 addresses.

[![Open in GitHub
Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/26799?quickstart=1)

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

<img width="385" alt="Screenshot 2024-09-02 at 14 35 33"
src="https://github.com/user-attachments/assets/344d849b-9121-4bcb-bf58-8cb0b1286112">

<img width="384" alt="Screenshot 2024-09-02 at 14 45 30"
src="https://github.com/user-attachments/assets/158e3421-4f9f-46e1-a4cf-93daec45db66">
  • Loading branch information
FrederikBolding authored and Mrtenz committed Sep 19, 2024
1 parent 090bf2c commit 8e6ea93
Show file tree
Hide file tree
Showing 10 changed files with 819 additions and 8 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ import { SnapUIRadioGroup } from '../snaps/snap-ui-radio-group';
import { SnapUICheckbox } from '../snaps/snap-ui-checkbox';
import { SnapUITooltip } from '../snaps/snap-ui-tooltip';
import { SnapUICard } from '../snaps/snap-ui-card';
import { SnapUIAddress } from '../snaps/snap-ui-address';
import { SnapUISelector } from '../snaps/snap-ui-selector';
import { SnapFooterButton } from '../snaps/snap-footer-button';
///: BEGIN:ONLY_INCLUDE_IF(keyring-snaps)
Expand Down Expand Up @@ -104,6 +105,7 @@ export const safeComponentList = {
SnapUITooltip,
SnapUICard,
SnapUISelector,
SnapUIAddress,
SnapFooterButton,
FormTextField,
///: BEGIN:ONLY_INCLUDE_IF(keyring-snaps)
Expand Down
Loading

0 comments on commit 8e6ea93

Please sign in to comment.