Add dataset tab instead of dropdown

[barryvdh]

Current dropdown has the following issues:

• closes when updates (eg if a dataset is added before choosing)
• Limited info
• Can get long

So the idea is this:

• Create a new tab for datasets, instead of de dropdown
• Show more data on the tabs
• Maybe add some advanced controls, like pausing the auto-refresh (often requested), filtering requests (like open handler) or maybe show some badge indicators (number of queries, mails sent) to jump to that tab directly.

Rough prototype in PR:

Thoughts:

• Maybe separate into new widget file
• Table based would be better instead of dd/dt
• Configurable?

[barryvdh]

Table example, which only renders the row once:

[barryvdh]

@erikn69 @parallels999 any thoughts about this approach?

[erikn69]

It seems fine to me, but it wouldn't be better if the new calls were placed at the beginning, i mean, sorted descendingly(avoid scrolling for the new ones)

One question, some routes use GET and have the query parameters in the url, are those parameters removed from the URL? Or will they be separated and converted to some array(better readability, url decoded)? I always found them annoying, sometimes they grew too big

[barryvdh]

Yeah sorting could be changed but if newer are on top, the list keeps changing while you are browsing it. Maybe we could just toggle it when you click on the header.

Right now it shows the uri value from the meta data. It might be possible to show a bit more description, eg. for livewire a component or something, but not sure what the best way it.

[erikn69]

I mean this, some JS ajax components use GET calls, maybe decodeURIComponent could be used for readability

and could be split as another column, PARAMS

[barryvdh]

Not really sure what's best. For now I've added overflow so it's 1 line, and a filter to clear the entries so far + filter on uri and method:

[barryvdh]

And with autoshow toggle. Maybe we should store it in sessionstorage or something though.

[parallels999]

How would you know which one is selected and active?

Before I saw it in the number and as active item, always visible

Looks easy to confuse with the open modal

[barryvdh]

That is a good question. But we could still show the name in the tab on the right, just like the dropdown

[parallels999]

With dropdown is easier to compare a tab data between requests, with a specific tab you would have to go to the tab, select the request you are looking for and return to the tab with the data

[barryvdh]

Something like this, but we need to restrict the width

Also highlighting the active dataset + showing the badges > 0, with direct clicks to the dataset.

[parallels999]

Looks better, but if i want to look #37?
I think the number should also be in the table.
When there are many ajax calls, sometimes i remember the number of the one that interests me the most to see it later, I wouldn't like to have to count them to search for #37

---

Also, How to know if the calls are ajax or normal calls, previously even the calls coming from the iframe have a label

[barryvdh]

The switching to same tab is a valid point, but mostly handled by the badges, which direct you to the correct tab.

I added the suffix to the tab label, but I think almost always the requests are ajax, except for the first one? (or maybe the first 2 in case of a redirect).
I guess we could add a 'source' label the the table though.

An alternative could be a popup like the open handler, but I kinda like that you can see the incoming requests. (But that add the question again if the order might be reversed)

[parallels999]

I added the suffix to the tab label, but I think almost always the requests are ajax, except for the first one?

Are Iframes considered ajax?

but I kinda like that you can see the incoming requests. (But that add the question again if the order might be reversed)

To me, yes, But for many people that part is confusing.
They always need to be explained that they are new calls that are being added

[barryvdh]

No but I think iframes is a pretty small part, especially since it's only been added like a few weeks ago.

With number and suffix:

[parallels999]

Looks great to me, but I think it would look better with reversed items, so you could always see the last one

[barryvdh]

Clicking on date will reverse the sort + remember it

[barryvdh]

Not really sure about what to do when clicking though. Now it is:

• Click on badge -> open that tab
• Click on row -> Jump to last tab (if available) or first tab

Not sure if there is a case where you would want to keep the tab open after clicking on a dataset though.

[barryvdh]

Feels a bit weird though, think staying on page is better. Gonna try this out somewhere.

[barryvdh]

And made it configurable by now, disabled by default (might set default in the future)