WS Listener: QOL changes proposal

[ceifa]

I've been using the WS listener a lot lately, and I would like to suggest some improvements to it, mostly based on the view chrome has on network tab. If more people agree with me, I may some PRs later, with the changes.

• Add a column on the messages that show when it was arrived.
• When I click on a message to expand, I can't shrink it back again later.
• When I expand a message, the screen moves, it would be better if it expands where it already is
• Add some filters (regex, sent/received selector)

[pimterry]

Yep, I'm definitely keen to improve this, it's still a bit rough.

Fixing row expansion seems like a relatively easy quick win, sounds great if you have improvements there.

Extra column might be tricky for space, but I'm open to experimenting. What about if it was an overlay on hover or something? Or shown only when there's enough space, or only in the expanded view?

Another useful improvement would be properly virtualizing the rows, as we do in the main list with react-window, which would be a significant perf boost when you have thousands of messages here.

Where possible it would be nice for this to share design (and preferably implementation) with the the main list view as much as possible. We can probably reuse the filtering structure & UI at least. I'd previously even considered showing websocket messages there in the left pane - maybe via a toggle that showed them within the rest of the HTTP traffic, and then they could be filtered and individually selected as part of that? Could be useful in some cases especially if you have multiple websocket - you'd be able to see them in one place, and compare timing between messages there.