feat(UI): Display item updates as a dropdown #669

rouk1 · 2024-11-05T09:06:20Z

project store as been updated to manage updates
updates are stored in session storage to limit memeory footprint
card quick action have been introduced to have one click delete and browse history
on click on an item update an event is emitted, the view listens to it and calls the store to update the list of PresentableItem reactivelly

UI preview:

history.mp4

github-actions · 2024-11-05T09:08:49Z

Coverage Report for ./skore-ui

Status	Category	Percentage	Covered / Total
🔵	Lines	82.46%	2102 / 2549
🔵	Statements	82.46%	2102 / 2549
🔵	Functions	44.64%	50 / 112
🔵	Branches	79.08%	155 / 196

File Coverage

File	Stmts	Branches	Functions	Lines	Uncovered Lines
Changed Files
skore-ui/src/components/DraggableList.vue	100%	100%	100%	100%
skore-ui/src/components/DropdownButton.vue	100%	100%	100%	100%
skore-ui/src/components/DropdownButtonItem.vue	100%	100%	100%	100%
skore-ui/src/components/EditableListItem.vue	100%	100%	100%	100%
skore-ui/src/components/ProjectViewCard.vue	100%	100%	100%	100%
skore-ui/src/components/SimpleButton.vue	91.3%	50%	100%	91.3%	1, 38
skore-ui/src/components/ToastNotification.vue	87.09%	64.28%	100%	87.09%	21, 32-33, 38-42
skore-ui/src/components/TreeAccordion.vue	94.73%	100%	100%	94.73%	29
skore-ui/src/components/TreeAccordionItem.vue	84.52%	85.71%	11.11%	84.52%	18-22, 38-46
skore-ui/src/stores/project.ts	72.93%	84.44%	55%	72.93%	39-42, 52-70, 78-85, 142-143, 229-231, 239-241, 248-253, 260-264, 270-273, 286, 305-314, 345-349, 376-377
skore-ui/src/views/ComponentsView.vue	84.36%	100%	0%	84.36%	38-48, 54-79, 157-186, 190-199, 212-216, 220-226
skore-ui/src/views/project/ProjectView.vue	79.5%	75%	0%	79.5%	32-56, 63, 95-96

Generated in workflow #751 for commit 1498c92 by the Vitest Coverage Report Action

- project store as been updated to manage updates - updates are stored in session storage to limit memeory footprint - card quick action have been introduced to have one click delete and browse history - on click on an item update an event is emitted, the view listens to it and calls the store to update the list of `PresentableItem` reactivelly

sylvaincom · 2024-11-05T09:46:16Z

In the video, the "Updated about 17 hours ago" for a dozen histories of the item does not help the user track them? Maybe write the full log somewhere?

augustebaum · 2024-11-05T11:13:10Z

Awesome stuff!!

augustebaum

I found a small graphical bug:

2024-11-05T12_11_49_screen_record.mp4

To reproduce, open the menu, then quickly move the mouse away and then back

skore-ui/src/components/ProjectViewCard.vue

skore-ui/src/components/DropdownButtonItem.vue

skore-ui/src/components/ProjectViewCard.vue

rouk1 · 2024-11-05T11:56:33Z

I found a small graphical bug:
2024-11-05T12_11_49_screen_record.mp4

To reproduce, open the menu, then quickly move the mouse away and then back

This is (to me ^^) not a bug. You did not close explicitly closed the drop down but moved your mouse outside of the actions which appears only on hovering. Hence actions dim out but there state persists.

What behavior would you expect ?

rouk1 · 2024-11-05T11:59:15Z

In the video, the "Updated about 17 hours ago" for a dozen histories of the item does not help the user track them? Maybe write the full log somewhere?

Indeed it does'nt help but it's only due to my test dataset in which all updates have been generated in the same second. In a real context the dates should be very different.

Would you like to add a number of something ? It was in the initial design but @tuscland said that giving version number to item update maybe confusing.

augustebaum · 2024-11-05T14:09:28Z

This is (to me ^^) not a bug. You did not close explicitly closed the drop down but moved your mouse outside of the actions which appears only on hovering. Hence actions dim out but there state persists.

What behavior would you expect ?

What's strange is that if move my mouse away, the dropdown disappears (so in my mind I think "okay, the dropdown is gone now") and then it's open again even though I haven't clicked anything. I would expect to either keep it open, or keep it closed.

Another way of saying this is: I think moving the mouse far enough away should "explicitely" close the dropdown.

sylvaincom · 2024-11-05T15:42:27Z

In the video, the "Updated about 17 hours ago" for a dozen histories of the item does not help the user track them? Maybe write the full log somewhere?

Indeed it does'nt help but it's only due to my test dataset in which all updates have been generated in the same second. In a real context the dates should be very different.

Would you like to add a number of something ? It was in the initial design but @tuscland said that giving version number to item update maybe confusing.

This "log naming" thing could be transformed into a separate more global issue? We will face the same with historization of cross-validation, we want something to identify the runs, and maybe give some comments about the run name:

for run number 2, I want to add a comment to say that I normalize the data
I would like to be able to "squash" runs 2 to 5 because they are all wrong because they are on outdated versions on the data

WDYT of creating a new separated issue?

tuscland · 2024-11-05T15:55:20Z

Would you like to add a number of something ? It was in the initial design but @tuscland said that giving version number to item update maybe confusing.

Note that naming a version was not in the spec.

Think about managing versions for all items.
You could version your project as a whole, not individual items.

MarieS-WiMLDS

hello!
I categorized my review in three parts:

Things I loved ❤️

I love that the item bin is now easily accessible!
I like the easy switch to latest version, it's helpful

Questions:

about version naming. I see that it's something discussed above. maybe we could call them iteration and just give them increasing numbers?
didn't the plus button of items used to be orange?

cf this screen shot for the plus:

Change requested:

The warning logo, when I'm viewing an old item is way too small. I didn't understand what it was at first.
Same for the icons of the right of items, they are a bit too small imo.
The "tick" in toaster doesn't seem aligned

cf this screenshot for the tick:

MarieS-WiMLDS · 2024-11-06T13:21:23Z

About naming the iterations/versions/whatever instead of having "17 min ago" is important to me because I want to be able to find back which item i've seen the day before. If I find interesting to see iteration number 5, I want to be able to show it again to the rest of my team of whatever the following day, it must be easy to find if back.

…circle around it.

rouk1 · 2024-11-06T15:09:24Z

About naming the iterations/versions/whatever instead of having "17 min ago" is important to me because I want to be able to find back which item i've seen the day before. If I find interesting to see iteration number 5, I want to be able to show it again to the rest of my team of whatever the following day, it must be easy to find if back.

I've added a simple version number counting from 1.
wdyt ?

rouk1 · 2024-11-06T15:11:36Z

didn't the plus button of items used to be orange?

Nope, the idea is that views are orange and items blue.

rouk1 · 2024-11-06T15:21:42Z

Same for the icons of the right of items, they are a bit too small imo.

Accordion item actions are now 1.14rem.

MarieS-WiMLDS · 2024-11-06T16:26:12Z

I would still need all the icons (warning + branches + bin) to be a bit bigger please.

I've added a simple version number counting from 1.

Very good for me! It's not pushed yet, is it? (at least it doesn't display in my navigator)

rouk1 · 2024-11-06T18:42:42Z

I would still need all the icons (warning + branches + bin) to be a bit bigger please.

I've added a simple version number counting from 1.

Very good for me! It's not pushed yet, is it? (at least it doesn't display in my navigator)

Should be good now

MarieS-WiMLDS

Thanks Matthieu, this will enable our next release tomorrow :) !!

- project store as been updated to manage updates - updates are stored in session storage to limit memeory footprint - card quick action have been introduced to have one click delete and browse history - on click on an item update an event is emitted, the view listens to it and calls the store to update the list of `PresentableItem` reactivelly UI preview: https://github.com/user-attachments/assets/e156e38c-ec3f-4cb9-a461-7dbc9d2df61f

rouk1 linked an issue Nov 5, 2024 that may be closed by this pull request

Implement item updates visibility in the frontend #666

Closed

github-actions bot assigned rouk1 Nov 5, 2024

rouk1 force-pushed the 666-implement-the-frontend-update branch from 0452660 to 96046ee Compare November 5, 2024 09:06

thomass-dev self-requested a review November 5, 2024 09:19

rouk1 force-pushed the 666-implement-the-frontend-update branch from 96046ee to 3c0a7a4 Compare November 5, 2024 09:30

This comment was marked as duplicate.

Sign in to view

augustebaum suggested changes Nov 5, 2024

View reviewed changes

skore-ui/src/components/ProjectViewCard.vue Outdated Show resolved Hide resolved

skore-ui/src/components/DropdownButtonItem.vue Outdated Show resolved Hide resolved

skore-ui/src/components/ProjectViewCard.vue Show resolved Hide resolved

thomass-dev removed their request for review November 5, 2024 13:06

MarieS-WiMLDS requested changes Nov 6, 2024

View reviewed changes

rouk1 added 4 commits November 6, 2024 15:27

Merge branch 'main' into 666-implement-the-frontend-update

600269b

new wording "You are viewing an old version" + warinign icon without …

78b52f2

…circle around it.

current version tick is now set correctly

dc899af

add "version number"

b75cfef

accordion actions are now bigger

be360f5

rouk1 requested a review from MarieS-WiMLDS November 6, 2024 15:21

dropdown transition is now instant if the dropdown is invisible

0827f4e

augustebaum previously approved these changes Nov 6, 2024

View reviewed changes

rouk1 dismissed augustebaum’s stale review via 0827f4e November 6, 2024 18:17

bigger action button in item cards

385007e

rouk1 added 2 commits November 6, 2024 19:55

fix toast icons

98e580c

remove compilation warning

eca61da

MarieS-WiMLDS approved these changes Nov 7, 2024

View reviewed changes

Merge branch 'main' into 666-implement-the-frontend-update

1498c92

rouk1 merged commit 81be87e into main Nov 7, 2024
7 checks passed

rouk1 deleted the 666-implement-the-frontend-update branch November 7, 2024 16:25

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(UI): Display item updates as a dropdown #669

feat(UI): Display item updates as a dropdown #669

rouk1 commented Nov 5, 2024 •

edited

Loading

github-actions bot commented Nov 5, 2024 •

edited

Loading

sylvaincom commented Nov 5, 2024

augustebaum commented Nov 5, 2024

This comment was marked as duplicate.

augustebaum left a comment

rouk1 commented Nov 5, 2024

rouk1 commented Nov 5, 2024

augustebaum commented Nov 5, 2024

sylvaincom commented Nov 5, 2024 •

edited

Loading

tuscland commented Nov 5, 2024

MarieS-WiMLDS left a comment •

edited by rouk1

Loading

MarieS-WiMLDS commented Nov 6, 2024

rouk1 commented Nov 6, 2024

rouk1 commented Nov 6, 2024

rouk1 commented Nov 6, 2024

MarieS-WiMLDS commented Nov 6, 2024 •

edited

Loading

rouk1 commented Nov 6, 2024

MarieS-WiMLDS left a comment

feat(UI): Display item updates as a dropdown #669

feat(UI): Display item updates as a dropdown #669

Conversation

rouk1 commented Nov 5, 2024 • edited Loading

github-actions bot commented Nov 5, 2024 • edited Loading

Coverage Report for ./skore-ui

sylvaincom commented Nov 5, 2024

augustebaum commented Nov 5, 2024

This comment was marked as duplicate.

augustebaum left a comment

Choose a reason for hiding this comment

rouk1 commented Nov 5, 2024

rouk1 commented Nov 5, 2024

augustebaum commented Nov 5, 2024

sylvaincom commented Nov 5, 2024 • edited Loading

tuscland commented Nov 5, 2024

MarieS-WiMLDS left a comment • edited by rouk1 Loading

Choose a reason for hiding this comment

MarieS-WiMLDS commented Nov 6, 2024

rouk1 commented Nov 6, 2024

rouk1 commented Nov 6, 2024

rouk1 commented Nov 6, 2024

MarieS-WiMLDS commented Nov 6, 2024 • edited Loading

rouk1 commented Nov 6, 2024

MarieS-WiMLDS left a comment

Choose a reason for hiding this comment

rouk1 commented Nov 5, 2024 •

edited

Loading

github-actions bot commented Nov 5, 2024 •

edited

Loading

sylvaincom commented Nov 5, 2024 •

edited

Loading

MarieS-WiMLDS left a comment •

edited by rouk1

Loading

MarieS-WiMLDS commented Nov 6, 2024 •

edited

Loading