Add search by transaction hash to transactions tab

[PDiTO]

Added search to transactions tab

Added search box above transactions list on transactions tab (copying style from accounts tab).

When user inputs a transaction hash and clicks search, we first verify the hash is valid (viem -> isHash) and then navigate to the transaction path in a similar fashion to clicking on a transaction from the list.

Related issue

https://github.com/paradigmxyz/rivet/issues/45

[PDiTO]

My first open source commit, so please be as open and honest with feedback, I can take it 😊. I tried to match the code style from other areas.

[jxom]

Looking good! My thoughts were that maybe the search input would filter the transactions in the UI instead (so if you search for a transaction hash, it should only populate the list with one item). It might be a bit more snappier, and more of an expected UI, than having a "Search" button. Sorry, I should have clarified this! It's definitely on the right track though!

[PDiTO]

Yea, I totally agreed re: the UI flow. It does feel a bit weird. The thing that threw me off is a bit is the separate item to filter transactions by sender. That feels like a filter, but this feels like a hybrid since the specific transaction may be in the existing transaction list, but may also need to be loaded separately. I wonder if these two items should be grouped together and be the start of a some sort of component that is able to query across any elements and is agnostic to (or intelligent enough to know) whether its just filtering the existing transactions array or actively going out and querying for new data.

[jxom]

Yep! That is what I was thinking. If the item is already in the cache, use that; otherwise, fetch it.

[PDiTO]

@jxom Got it. I've reworked it in latest commit, see what you think. It'll load the searched transaction into the list directly, whether it was already cached or not.

You can actually search by sender address here too using same functionality (and potentially anything else you might wish to add) but in this case, only across cached items (since searching for a full list of transactions by address could end up going back to origin block hypothetically, would certainly hammer the rpc in almost any case).

Due to this, I disabled the loading part of the infinite view when displayed filtered items.

[jxom]

Thanks for the PR, just needed to polish a few things and implemented in 34ea449c81c3f6f7d2c4e49d75848aca67d31606.

Still co-authored you in the commit so you get the credit.