Feat: batch any tx

[katspaugh]

Project links

Design: https://www.figma.com/file/FY2LtTxP2Ngj6Ed5dTTDcv/Batching?type=design&node-id=6%3A30859&mode=design&t=svhcdpjFCmNn9yMN-1
Specs: https://www.notion.so/Transaction-batching-9600b8fa53834512ba0c8d1a257de771

Description

• You can now choose to batch any created tx instead of signing
• A new sidebar shows batched txs
• You can add new txs or sign the batch

Todo

• Counter on the Batch icon
• Batch Icon is black in dark mode
• Expand txs to see details
• Mobile version
• Overall design as per figma
• Batching multiSends does not work, we have to flatten multiSends and add all the “inner transactions”, because we cannot / do not want to delegateCall – batching multisend txs is disabled for now
• The option to batch is hidden when executing, which is the default for 1/x Safe

[github-actions]

Branch preview

✅ Deploy successful!

https://batching--walletweb.review-wallet-web.5afe.dev

[github-actions]

ESLint Summary View Full Report

Annotations are provided inline on the Files Changed tab. You can also see all annotations that were generated on the annotations page.

Type	Occurrences	Fixable
Errors	0	0
Warnings	0	0
Ignored	0	N/A

• Result: ✅ success
• Annotations: 0 total

---

^{Report generated by eslint-plus-action}

[github-actions]

ESLint Summary View Full Report

Annotations are provided inline on the Files Changed tab. You can also see all annotations that were generated on the annotations page.

Type	Occurrences	Fixable
Errors	0	0
Warnings	0	0
Ignored	0	N/A

• Result: ✅ success
• Annotations: 0 total

---

^{Report generated by eslint-plus-action}

[schmanu]

Looks and works really great!

I just have some minor suggestions and there are some prettier problems in BatchTxItem.tsx

[iamacook]

There are some Prettier issues, but otherwise looks good!

[francovenica]

I don't think the "Send again" should be in the list of batched txs

[francovenica]

Rejections should not be "batchable".
First you can put the same rejection more than once, which should not be possible in a regular tx.
Second, the only tx you could reject is the batch you are creating itself or a tx that has a nonce -1 of the batch you are creating, therefore you would try to reject a tx that has already being executed or rejected

[katspaugh]

I don't think the "Send again" should be in the list of batched txs

It's difficult to hide it just in that sidebar, so I suggest we keep it, it doesn't hurt. I made it close the batch sidebar when Send again is pressed.

Rejections should not be "batchable".

Fixed! ✅

[francovenica]

The event "Expand batched tx" is being triggered also when you are trying to delete a tx from the batch or reordering it, because the event triggers as soon as you click on a tx and not when the tx details actually display.
EDIT: it triggers when you release the click, but still, it should trigger when the tx details are displayed

[francovenica]

Suggestion: The Add to batch button that is at the bottom of the tx form only shows if you click the "no execution" checkbox. The thing is that if the user have not noticed the icon at the top he will not know about batch tx until someday he clicks in the "no execution". So I'd recomend show that button all the time

[katspaugh]

I’ll consider it for v2. Manu also pointed out that 1/N users who chose to execute txs by default will not see this button.

[francovenica]

Another Nish one: If in the tx builder you only set 1 tx and try to execute it you can batch it (which is fine) but after batching the app shows the modal of "Success".
I'd assume that we should see how apps behave with the batching. Or maybe we can close the app as soon as a tx is batched

[francovenica]

The button is overlapping in mobile viewports

[francovenica]

Also for mobile, the elements are too wide for it. This is emulating a iPhone 12. I tried in a physical iphone13 and is the same.
The numbers and the arrow to display it cannot be seen

[francovenica]

Question. In one of the designs is implied that you can reorder and remove tx from the batch in the form, but in other parts is not. So, should the user be able to do that in the form?

I've seen that, as you reorder/remove items from the batch sidebar they are also being removed/reorder in the form, so that would be fine too, but probably should put some info text saying "You can reorder/remove tx from the sideber" if we are not going to allow it in the form.

[francovenica]

Note:
Although Safe apps and Spending limits can be batched, usually those type of tx are already a batch, so the vast majority of those type of tx will not be batchable, we should see if it's worth having the button there for those

[katspaugh]

I'll disable this feature on mobile for v1.

[katspaugh]

Question. In one of the designs is implied that you can reorder and remove tx from the batch in the form, but in other parts is not. So, should the user be able to do that in the form?

For now they'll be re-orderable/deletable only in the Sidebar view. The designs are a mix of v1 and v2.

[katspaugh]

Delegate/batch txs currently have a disabled "Add to batch" button as per @kirkkonen's request. It shows a tooltip on hover.

I'm going to merge this PR, and we'll address the rest of the feedback in v2. Namely:

• Mobile version
• Post-submit state in Safe Apps
• Batch button in the Execute form