Clearly show when a transaction is gassless

[anxolin]

Description Show clearly when transactions are gasless, or if the transaction is not gassless, show an estimation on the cost on gas

Details Cowswap is a gasless exchange, but in order to be gasless, you need to first enable tokens for trading.

Enabling token requires a regular Ethereum transaction, which needs ETH for gas. Same applies for ETH. Since it cannot be sold directly, you have to wrap it first, which requires an Ethereum transaction.

Describe the solution you'd like I would love to see clearly in every transaction details, when if is a:

• Gassless transaction
• Ethereum transaction

If it's an ethereum transaction, I would like to know, how much ETH should it cost, and what's the USD at current prices.

Additional context Feedback:

[W3stside]

haha exactly what i expected.

imo a less intensive solution rn would be to use what we have:

normal tx =

1. approve ERC20 token before swapping
2. wrap ETH into WETH for either direct wrap or ETH/ERC20 swap

both options here use a hook (respectively)

1. useApproveCallback
2. useWrapCallback

we could adjust these to return a summary and/or var indicating isEthereumTransaction to flag a warning to be shown, else show gasless message

[anxolin]

Thanks @W3stside for adding that input for the technical implementation. Returning the flags in the hooks sound initially good, although implies changing the signature of these hooks. Probably there's also other simpler alternatives, since we know exactly when we invoke the approval/wrapping (ethereum tx) and when we trade (meta-tx), so probably it can be solved just by editing how we preview the information.

I would suggest that first we do some wireframes with a proposal, so we can agree on the best way to display this information.

[annamsgeorge]

For me the main issue here seems to be that the user is not clear how much gas they are paying for the swapping transaction --> meaning they didn't read the tool tip that shows the fee breakdown. Leading us back to the topic if there's a better way to display the fee in the UI. I think we should use the previous wireframes Michel made for user testing and take it from there. For the mean time I would suggest that we change the colour of the "?" tooltip. If the "?" stands out better, more users might click on it.

[annamsgeorge]

In my view this should be part of this research task: UX research on better display of fees #676

[anxolin]

In my view this should be part of this research task: UX research on better display of fees #676

Agree. This issue is meant also as a research task, I agree it should be considered together with #676, although they are not necessarily the same thing. I don't want to add proposals because we should iterate in figma, but for giving an example just for ilustration, this issue could be for example addressed by making a few changes:

• Make button to say: "Sign Ethereum transaction" or "Sign gassless transaction"
• Add a cow icon with a comic bubble saying: "Please sign this gasless transaction. You don't need to pay any ETH for this, all the costs are already included in the receiving amounts" or "Please sign this regular Ethereum Tx. (... and continue with a short explanation).
• Link a read more taking you to the FAQ with the table.

However #676 in my eyes, could be more like:

• Exploring if we did the right call showing amounts after fees
• Exploring if simple solutions would make it more clear that the fee is included (it's possible that this will be slighly improved when we do #590 )
• Exploring further the DEX aggregator option we started early in this project and we abandon just to go for the simpler approach. As we progress in the DEX aggregation route

By the way, and in this line, although I don't like exactly what the show here and how this works, this how Mistx gives the user a one time heads up. I like that they show it one time, and that they give a heads up on what the user might see. A bit tailored to Metamask only.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. If you think it shouldn't be closed, speak now or forever hold your peace.