Match the way Studio displays experiment name information in the table#3723
Match the way Studio displays experiment name information in the table#3723mattseddon merged 3 commits intomainfrom
Conversation
![qlty-cloud-legacy[bot]](https://avatars.githubusercontent.com/in/9403?s=60&v=4){kind=small}
mattseddon
force-pushed
the
match-studio-display
branch
from
8454a14 to
e34f534
Compare
mattseddon
changed the title
sroy3
left a comment
sroy3
left a comment
There was a problem hiding this comment.
Is it normal that the comparison table images changed in Storybook?
| /> | ||
| ) : ( | ||
| <div className={styles.experimentCellText}> | ||
| <span |
There was a problem hiding this comment.
I was staring at the table for like ten minutes, trying to figure out why it looked so off to me when it finally hit me that the commit rows have secondary text second while the experiments have their secondary text first.
I'm assuming most people won't notice 😅, but maybe we should keep secondary text second across all rows? Example of how this would look:
Technically, in design, you can have secondary text first depending on other factors but the main reason that the rows were bothering me is the fact we have a mixture of secondary being first and second. Though again, I'm probably the only person getting bothered :)
There was a problem hiding this comment.
I know that this breaks design principles. The reason that we've arrived here is that previously experiment names were less useful (e.g exp-43234) and the sha was thought of as the primary information identifier. The DVC team tried to solve the problem of not being able to navigate a lot of experiments by making the name easier to read/more memorable. The name as since become the primary identifier. However, the CLI still displays the information in the same way:
Studio have addressed this problem in the following way:
For more context please read #3619 (comment) & #3619 (comment) but the tl;dr is - we display this information in a lot of places, we should be standardising between the products, having the name first is a better option but a much larger change across multiple products.
There was a problem hiding this comment.
Oh, ok, makes sense! I didn't realize we were interested in matching order as well as focus across the extension! Hmmm, in that case, we could make secondary text first across all the rows:
Or just leave as is, up to you!
| .experimentCellText { | ||
| @extend .cellContents; | ||
| display: flex; | ||
| flex-flow: row wrap; |
There was a problem hiding this comment.
If we're going to keep things stacked on top of each other, I think we need to give the rows more height. Things look pretty crowded vertically when they're wrapped:
mattseddon
force-pushed
the
match-studio-display
branch
from
e34f534 to
74546a2
Compare
mattseddon
force-pushed
the
match-studio-display
branch
from
74546a2 to
eedcc53
Compare
|
Merging this as I think it is an improvement. We can iterate on it further as we get more feedback. |
|
Code Climate has analyzed commit d5a851f and detected 0 issues on this pull request. The test coverage on the diff in this pull request is 81.8% (85% is the threshold). This pull request will bring the total coverage in the repository to 94.7% (0.0% change). View more on Code Climate. |
3 participants
First follow-up to this comment #3619 (comment).
For reference, this is how Studio displays an experiment's sha/name:
As you can see the experiment name has been emphasised as this is the human-readable part of the information displayed.
Demo
Screen.Recording.2023-04-20.at.11.56.35.am.mov
See the storybook for further examples.
I think that consolidating between the products is a good idea but you may disagree. Maybe we should actually be swapping the experiment name and short sha's positions.
LMK what you think.