Visualization: details view #3778
Conversation
|
|
||
| return ( | ||
| <div> | ||
| <table className="table table-bordered details-viz"> |
There was a problem hiding this comment.
@arikfr I assume you're not using Ant Table cause it has no "vertical header" feature.
I think I can implement this feature with CSS only - write-mode: lr; which will allow standard table markup.
Lmk if you see value in this attempt.
There was a problem hiding this comment.
Well, it was this and the fact it felt too much for this use case. But if we can make it work with just CSS, it can go along with my plan of merging this into the table visualization later on.
Not sure it's worth the effort at the moment though.
There was a problem hiding this comment.
Then let's leave it be. I never used this css method before and it might have unforeseen implications. The best way would be to PR Ant with <Table orientation="vertical" />.
|
@arikfr perhaps consider allowing to choose different viz themes:
etc. |
|
I'm not sure when the list one will be useful, but the card grid is interesting when you want to show multiple counters without having the create multiple ones 🤔 |
|
All green ✅ |
|
Our first 100% React viz :) |
* Details visualization * Add PropTypes and guard against no rows
What type of PR is this? (check all applicable)
Description
Details visualization -- shows each row as a table (similar to the expanded view in psql):
Paginator only shows if you return more than one row.
Ideally it would use Table's column renderers (or maybe just be a mode of the table visualization), but this can wait until the Table visualization is rewritten with React.
Todo:
Related Tickets & Documents
https://discuss.redash.io/t/single-row-view/311/6?u=arikfr