Review and update the overall UI of dataset-page #176

Closed
opened 2026-08-25 12:53:07 +00:00 by AnnikaSonnek · 3 comments
AnnikaSonnek commented 2026-08-25 12:53:07 +00:00 (Migrated from github.com)

Please describe the feature

As a user, I want to be able to navigate, filter and download the files I want from the dataset-page in and easy way so that I can do my research work.

Detailed description

This issue mostly focuses on /datasets/{datasetId} but also /datasets.

This is the suggested design: https://www.figma.com/design/O2MSoTNSjhooKfLuYeLFNf/sdad-download-ui?node-id=0-1&t=fY4N4VkBsiwBIihW-1

AC

  • Make the design changes as suggested in figma. They have been turned into sub-issues:
  • #207
    • the "Filter files" bar should be grey instead of green
    • on /datasets/{datasetId}: the "Filter files" bar should have the full width of the page (like in /datasets)
  • #206
    • make "Download full dataset" button primary blue
    • group the download / export option into a "Download options" button
    • change "Select visible files" button to be primary outline
  • #205
    • turn "Items per page" component into a dropdown
  • #208
    • move "items per page" dropdown next to pagination component (on /datasets/{datasetId})
    • move "items per page "dropdown next to pagination component (on /datasets)
    • on /datasets/{datasetId} add headings "Full dataset overview" and "File selection"
## Please describe the feature As a user, I want to be able to navigate, filter and download the files I want from the dataset-page in and easy way so that I can do my research work. ## Detailed description This issue mostly focuses on `/datasets/{datasetId}` but also `/datasets`. This is the suggested design: https://www.figma.com/design/O2MSoTNSjhooKfLuYeLFNf/sdad-download-ui?node-id=0-1&t=fY4N4VkBsiwBIihW-1 ## AC - Make the design changes as suggested in figma. They have been turned into sub-issues: - #207 - the "Filter files" bar should be grey instead of green - on `/datasets/{datasetId}`: the "Filter files" bar should have the full width of the page (like in `/datasets`) - #206 - make "Download full dataset" button primary blue - group the download / export option into a "Download options" button - change "Select visible files" button to be primary outline - #205 - turn "Items per page" component into a dropdown - #208 - move "items per page" dropdown next to pagination component (on `/datasets/{datasetId}`) - move "items per page "dropdown next to pagination component (on `/datasets`) - on `/datasets/{datasetId}` add headings "Full dataset overview" and "File selection"
HenrikeW commented 2026-08-26 14:25:49 +00:00 (Migrated from github.com)

Great issue! A detail that I noticed while reviewing PR #133:
In the current design of the dataset details page, the outline buttons for downloading TAR and Export options are hard to identify as disabled when they are disabled. The difference to the other outline button "Download dataset" that is enabled is very subtle. One of the things we should consider when re-thinking the design choices for the buttons.

Great issue! A detail that I noticed while reviewing PR #133: In the current design of the dataset details page, the outline buttons for downloading TAR and Export options are hard to identify as disabled when they are disabled. The difference to the other outline button "Download dataset" that is enabled is very subtle. One of the things we should consider when re-thinking the design choices for the buttons.
AnnikaSonnek commented 2026-08-26 14:50:12 +00:00 (Migrated from github.com)

Great issue! A detail that I noticed while reviewing PR #133: In the current design of the dataset details page, the outline buttons for downloading TAR and Export options are hard to identify as disabled when they are disabled. The difference to the other outline button "Download dataset" that is enabled is very subtle. One of the things we should consider when re-thinking the design choices for the buttons.

I agree! I'll add this to the list. 👍

> Great issue! A detail that I noticed while reviewing PR [#133](https://github.com/NBISweden/sda-download-ui/issues/133): In the current design of the dataset details page, the outline buttons for downloading TAR and Export options are hard to identify as disabled when they are disabled. The difference to the other outline button "Download dataset" that is enabled is very subtle. One of the things we should consider when re-thinking the design choices for the buttons. I agree! I'll add this to the list. 👍
KattisLej commented 2026-09-07 13:55:28 +00:00 (Migrated from github.com)

I have taken a look to the suggestion and I think it looks good.

I have taken a look to the suggestion and I think it looks good.
Sign in to join this conversation.
No description provided.