feat(sqllab): giving the query history pane a facelift

[mistercrunch]

Fixing some styling and UI components in the query history pane in SQL Lab

• using label with monospace for timestamps
• set mouse to pointer on clickable icons
• using consistent icon size
• make the View clickable a button instead of label

before

after

[rusackas]

Suggested change

console.log('YOYO', queryEditor);

[rusackas]

"Failed to stop query"?

[kasiazjc]

Looks clean @mistercrunch! Two things from me me:

• icons seems big on comparison to the rest of the items in the row - what size is it?
• I like pill for duration, but I think using it for timestamp might be too much - we have so many different items that it can get overwhelming and in other places we just use text for timestamp

Thoughts?

[mistercrunch]

@kasiazjc -> screenshot based on latest tweaks

Thinking a bit more about it, I'd like to create a standard way to represent timestamps/durations through a reusable react component.

GPT-designer suggested this with a little clock which I think is kind of cute, but will make things more busy ->

My issue with out current CRUD list/table views is that it looks very raw (I mean that as opposed to "rich"), and would love to make it looking richer if that makes sense. Adding clock icons might look more busy, but also richer in some capacity.

[mistercrunch]

/testenv up

[github-actions]

@mistercrunch Processing your ephemeral environment request here.

[github-actions]

@mistercrunch Ephemeral environment spinning up at http://44.243.18.92:8080. Credentials are admin/admin. Please allow several minutes for bootstrapping and startup.

[kasiazjc]

@kasiazjc -> screenshot based on latest tweaks

Thinking a bit more about it, I'd like to create a standard way to represent timestamps/durations through a reusable react component.

GPT-designer suggested this with a little clock which I think is kind of cute, but will make things more busy ->

My issue with out current CRUD list/table views is that it looks very raw (I mean that as opposed to "rich"), and would love to make it looking richer if that makes sense. Adding clock icons might look more busy, but also richer in some capacity.

I think it looks more balanced with smaller icons and the pills for timestamp and duration look better too with it. Looks good for now and let's figure out crud enrichment/details next!

[rusackas]

This progress bar misalignment is nagging at me... I'll see about a PR for that when I come up for air next :D

[mistercrunch]

@rusackas addressed the comments, probably mergeable as net positive

[rusackas]

LGTM!