Developer tools

[iamacook]

Description

A basic implementation of Safe-related developer tools are now visible in the sidebar when not in the production envrionment.

These include links to:

• Transaction queue
• Transaction history
• Safe status (courtest of Richard's personal tool)

Macros for:

• Creating a queued transaction
• Creeating and immediately executing a transaction (where possible)

These can, of course, be improved and expanded upon in the future.

Screenshots

[github-actions]

CLA Assistant Lite All Contributors have signed the CLA.

[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}

[coveralls]

Pull Request Test Coverage Report for Build 1717393349

• 1 of 60 (1.67%) changed or added relevant lines in 4 files are covered.
• 499 unchanged lines in 30 files lost coverage.
• Overall coverage decreased (-0.2%) to 32.275%

---

Changes Missing Coverage	Covered Lines	Changed/Added Lines	%
src/routes/safe/components/Balances/SendModal/screens/SendFunds/TokenSelectField/index.tsx	0	1	0.0%
src/components/AppLayout/Sidebar/index.tsx	0	3	0.0%
src/logic/safe/store/selectors/gatewayTransactions.ts	1	4	25.0%
src/components/AppLayout/Sidebar/DevTools/index.tsx	0	52	0.0%

Files with Coverage Reduction	New Missed Lines	%
src/components/AppLayout/Sidebar/index.tsx	1	0%
src/routes/routes.ts	1	93.33%
src/components/ReviewInfoText/index.tsx	2	84.44%
src/components/TransactionsFees/index.tsx	2	83.33%
src/logic/wallets/store/actions/removeProvider.ts	2	33.33%
src/routes/safe/components/Transactions/TxList/modals/ApproveTxModal.tsx	2	2.76%
src/routes/safe/components/Transactions/TxList/MethodDetails.tsx	3	33.33%
src/routes/safe/components/Balances/SendModal/screens/ContractInteraction/ReviewCustomTx/index.tsx	9	0%
src/routes/safe/components/Settings/UpdateSafeModal/index.tsx	10	0%
src/routes/safe/components/Transactions/TxList/modals/RejectTxModal.tsx	10	3.45%

Totals
Change from base Build 1698136921:	-0.2%
Covered Lines:	3164
Relevant Lines:	8759

---

💛 - Coveralls

[github-actions]

Deployment links

🟠 Safe Rinkeby	⚪ Safe Mainnet	🟣 Safe Polygon	🟡 Safe BSC	⚫ Safe Arbitrum	🟢 Safe xDai

[github-actions]

E2E Tests Failed
Check the results here: https://github.com/gnosis/safe-react-e2e-tests/actions/runs/1717432812

Failed tests:

• ❌ Safe Apps List Safe Apps List
• ❌ Read-only transaction creation and review Read-only transaction creation and review

[katspaugh]

On my screen, it makes the sidebar quite cramped. I would place these tools in a new menubar on top (or bottom) of the app. Along with the CGW toggle.

[katspaugh]

I would also lazy import it if possible, so that it's not imported on prod.

[iamacook]

On my screen, it makes the sidebar quite cramped. I would place these tools in a new menubar on top (or bottom) of the app. Along with the CGW toggle

I think we'll quickly run out of space with extra features regardless of if we use the sidebar of an appbar. I feel like there's more wasted space in the sidebar (on my resolution at least).

I'd like to look into moving the devtools into a hideable popup, much like this.

[francovenica]

The way it is looks fine, and is really helpful.
I like the idea of the hideable pop up, not for the cramp buttons, but because I still want to be able to see the page as users would do in prod (the full menu).

Also, If you allow me to be greedy, I'd love to have the endpoint in the "safe status" page that shows you the tx list, like this one:
https://safe-transaction.rinkeby.gnosis.io/api/v1/safes/0x9913B9180C20C6b0F21B6480c84422F6ebc4B808/multisig-transactions/

[iamacook]

Also, If you allow me to be greedy, I'd love to have the endpoint in the "safe status" page that shows you the tx list

I'm glad to hear you like it. The status page is not actually made by us but by Richard. Do you use the transaction endpoint often? We can simply add a link to it as part of the developer tools.

[francovenica]

I get this the first time I try to enter the PR
https://pr3306--safereact.review-safe.gnosisdev.com/app/rin:0x9913B9180C20C6b0F21B6480c84422F6ebc4B808/balances

[iamacook]

It is working fine for me @francovenica. Can someone else test this please? @gnosis/safe-web

[katspaugh]

Works fine for me

[francovenica]

Now I can barely see the menu on the sidebar ( I think the CGW switch was added right? ).
Also, I see the sidebar refreshing every 15/20 secs or so (you can see the sidebar flicker)

[iamacook]

@francovenica, let's leave this for the time being. I'll come back to it on Friday seeing at there are more important tasks.

[katspaugh]

@iamacook please feel free to merge it, as it will be immediately useful.

[iamacook]

@iamacook please feel free to merge it, as it will be immediately useful.

It seems that there are a couple bugs. I enountered the issue @francovenica described. I'll look into this tomorrow morning and see if I can sort it.

[iamacook]

I found the issue and pushed a fix. @francovenica, please confirm if you are having any further issues. Hopefully we can get this merged today.

[github-actions]

Deployment links

🟠 Rinkeby	⚪ Mainnet	🟣 Polygon	🟡 BSC	⚫ Arbitrum	🟢 Gnosis Chain

[francovenica]

It works. Merge it