
An ETHLisbon Hackathon winner
MetaMask Snaps is the roadmap to making MetaMask the most extensible wallet in the world. As a developer, you can bring your features and APIs to MetaMask in totally new ways. Web3 developers are the core of this growth and this series aims to showcase the novel MetaMask Snaps being built today.
Snap Repo: https://github.com/Tbaut/template-snap-monorepo
Why did you build it?
When it comes to transaction signing on Ethereum, the elephant in the room is that most users have very little clue about what they are signing. Decoding methods and arguments is a good first step, but if users interact with a malicious contract, the visible information can be misleading. To counterbalance this, I thought about showing quantitative data, in a very simple manner, using code colors 🟥 🟧 🟩. The idea is to show a trust score based on data that is easy to verify from multiple sources. I chose to start with 4 criterias:
How many users have interacted with the smart-contract overall.
How often the current account has interacted with this contract.
How old this contract is.
Has this contract code been verified.
Can you walk us through the technical implementation?
The snap is very simple, and is easy to extend. Here is the full code that we will go through.
When the insights tab is clicked on MetaMask, the onTransaction
function is called. Inide it, we call each function diving us the criteria that we decided to take into account.
Those functions generally call an api, and process the results. Let’s dig into one of these to understand.
Let’s dig in the function giving a score based on the total amount of transaction that a contract received. We use the Etherscan api here, but any other api could work to verify the same data.
Now that we have a TrustResult
for each of our criteria, it is time to apply weights. Indeed, not all of our criterias trust score should have the same weight. For instance, the amount of past transactions with the contract has a cost. If a scammer was willing to game it, it would cost them some ETH for gas. As a result, this criteria is considered more costly to game, hence more important, I gave it a weight of 3.
Similarly, the contract’s age cannot be circunvented by an attacker, they would have to deploy it, and then wait before launching their attack if they wanted to have a high trust score. I gave it a weight of 2.
The other criterias are considered weaker and have a weight of 1.
Finally, we now have the trust score of a smart contract, we need to show it in a simple manner. The MetaMask insights api only allows to show key value pairs. The keys are in bold, and the values have a reglar font weight. I figured that by using emojis, I could create an interface that is not intimidating to users, while still showing all the information gathered.
The function transforming the trust score into emojis:
And the return part of the onTransaction
function, with some hacks to show key values, in a nice way:
Finally, I created a very simple interface to call 2 types of contracts, one very well known and used Uniswap contract, and one very recently deployed storage contract, the one presented by default on Remix. I you were to use this snap and interract with the Uniswap router contract you would see the following:
What are the next steps if you would implement this?
This is only scratching the surface of what information could give user confidence, or prevent them from being phished. The obvious first step would be to use more sources for our data. The contract verification already use Sourcify and Etherscan, but it would be better to use multiple sources for each criteria.
Then, we should apply more advanced algorithm to prevent scammers from being able to game the scores easiely. For instance, we should count the amount of unique accounts who transacted with a contract. We could do some anaysis on the accounts that interacted with it in the past as well, to make sure they are not all originating from one source. The down-side is that all this analysis is harder to make using multiple sources of truth.
There are some interesting research as well done on scam detection for smart contract that could be integrated. More info here.
All in all, the overwelming amount of positive reactions I received for this hack shows that users are demending for some more information, and I believe that the fact that it is easy to digest played a key role.
Can you tell us a little bit about yourself?
I am a software engineer at ChainSafe and I worked at Parity in the past. I love to build products with a focus on good UX. Web3 is a great playground for me because everything is so complex, trying to make it understandable to as many ppl as possible is a great challenge. I have been in the space for almost 5 years and although I have attended many hackathons, I am generally a volonteer, a mentor or a judge rather than a hacker. The main reason is that I am a perfectionist and generally don’t like quick and dirty solutions :).
When were you first introduced to MetaMask Snaps and what was your experience like?
Interestingly, my colleagues at ChainSafe have built one of the first ever snap, the one for Filecoin. I probably had a look at the code back then, but did not dig further.
At the time of hacking, the insights api wasn’t actually available to developers. I was talking to the MetaMask team in Lisbon, I did not expect to be able to add a user interface to MetaMask. They told me that it was about to be released, and that I could build on it now. In fact this was only available with a custom build, and the documentation hadn’t been released yet.
What makes MetaMask Snaps different from other wallets?
Having the ability to add custom code in a tab, while making sure that this code is safe to execute opens the doors to a huge range of enhancements. I’m very much looking forward to what will come out of this.
Tell us about what building Snaps with MetaMask is like for you?
The template monorepo made it a breath to get started. The fact that all my code could be written in one repo, with one command to launch both the test dapp and the snap, both with auto-refresh was a great developer experience.
What does Snaps mean to you?
It’s the extension to an extension. No product can fit all users. Adding this composable layer is a great opportunity for anyone asking for some feature to build it themselves.
What opportunities do you see with MetaMask Snaps and the possibilities it unlocks for the Web3 space?
I’ll talk about the insights in particular that is unlocking infinite customability depending on the needs. I bet that many more safety related insights will be developped in the future.
Any advice you would like to share with developers keen to try MetaMask Snaps?
Clone the monorepo, and enjoy a very quick start.
To get started with MetaMask Snaps:
Checkout the developer docs
Install MetaMask Flask
Check out a MetaMask Snaps guide
Stay connected with us on Twitter, GitHub discussions, and Discord
Keep an eye out for our team at the next hackathon in an area near you! Happy BUIDLing ⚒️
Disclaimer: MetaMask Snaps are generally developed by third parties other the Consensys Software. Use of third-party-developed MetaMask Snaps is done at your own discretion and risk and with agreement that you will solely be responsible for any loss or damage that results from such activities. Consensys makes no express or implied warranty, whether oral or written, regarding any third-party-developed MetaMask Snaps and disclaims all liability for third-party developed Snaps. Use of blockchain-related software carries risks, and you assume them in full when using MetaMask Snaps.