Explorer: Transaction viewer

[alfetopito]

Description

Implement Transaction viewer page on Gnosis Protocol Explorer

First step towards batch view tool.

For now, we should only list all orders that were settled in a single blockchain transaction

Additional resources

New endpoint from backend returning all orders settled in a given transaction
https://protocol-rinkeby.dev.gnosisdev.com/api/#/default/get_api_v1_transactions__txHash__orders
/api/v1/transactions/{txHash}/orders

Feature breakdown
It includes:

• Added page /tx/<hash> Transaction viewer: Add new page /tx/<hash> #851
• Design new page
• Implement design (mocked, using storybook) Implement design of the Transaction viewer page #852
• Implement new backend API interface Transaction viewer page: Implement new backend API interface #855
• Wire up UI and backend data Transaction viewer page: Wire up UI and backend data  #853
• Search for transaction on search bar Implement search for transaction on search bar #854

Good to have:

• Search transaction on every network Transaction viewer page: Search transaction on every network #856
• Identify when tx is/is not a GPv2 transaction (offer link to blockexplorer) Transaction viewer page: Identify when tx is/is not a GPv2 transaction (offer link to blockexplorer) #857

[alongoni]

Hey @alfetopito. Here is a first approach to the tx viewer:

Should we need to add some relevant information from here?

[alfetopito]

Thanks Agustin!

As I mentioned the other day in the meeting, we don't have right now a "list" of transactions from the contract.
This can be a next step and your UI fits great into that.

For now, a "detailed" transaction view is enough.

By that I mean a view that only shows a list of orders, for a single transaction. Basically the inner content, without search or pagination

And on top similar to orders

(It would say instead of Order -> Transaction details)
Also a link to etherscan to see the transaction there.

And as a next step we can expand and show the list of batches as you have suggested now

@biocom anything you'd like to add?

[alongoni]

Thanks @alfetopito. Design updated.

[alfetopito]

Perfect @alongoni !

Unless anyone on @gnosis/gp-frontend has any comments, it's ready for implementation.

[anxolin]

It looks great, would it make sense to have some header with some basic information. In the future it could have the basic stats of the batch, like traded volume. Right now, it's easy to show the Tx hash, date, block number? (probably not), number of orders, number of different accounts, total fees, and list of involved tokens.

However, probably we want to start without the header and reiterate later. Maybe even give a try to the graph :)

Anyways, nice one! im looking forward for this feature

[alfetopito]

Right now, it's easy to show the Tx hash, date, block number? (probably not), number of orders, number of different accounts, total fees, and list of involved tokens.

All of that seems pretty low effort fetched from the chain and would be great to have!

Still, I'd be happy to have just the simple version right now as it'll be a big plus.

So Agustin, you can work in parallel on Anxo's suggetion but the team is unblocked to start implementing the base version if there are resources available.