Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

As a librarian, when I export metadata of records to Excel, I get visual feedback. #598

Closed
2 tasks done
mietcls opened this issue Sep 14, 2022 · 4 comments · May be fixed by #1677
Closed
2 tasks done

As a librarian, when I export metadata of records to Excel, I get visual feedback. #598

mietcls opened this issue Sep 14, 2022 · 4 comments · May be fixed by #1677
Assignees
@verheyenkoen
Labels
enhancement New feature or request good first issue Good for newcomers librarian Work that helps our colleagues Mini Biblio UX crash Not a bug, but a pattern that prevents us from reaching a certain goal.

Comments

@mietcls
Copy link
Member

mietcls commented Sep 14, 2022 •
edited by verheyenkoen
Loading

Story

As a librarian, when I export metadata of records to Excel, I get visual feedback.

Success criteria

  • I get feedback whenever I click the button
  • I get feedback whenever the export is finished

Implementation

Design

Static

Image

On click

Option A: button changes during prep
Image

Option B: Toaster on load
Image

When done

Option A: button changes for 3200 ms
Image

Option B: Toaster on finish that disappears after 3200 ms
Image

Components

Button with icon and text

https://biblio-ugent-prototype-emily-v2.vercel.app/styleguide/b-btn-types.html#component-02-btn-icon-text

Spinner

https://biblio-ugent-prototype-emily-v2.vercel.app/styleguide/b-spinner.html

Toast

https://biblio-ugent-prototype-emily-v2.vercel.app/styleguide/b-toasts.html#component-04-b-toast-simple

Code examples

Code example button spinner

<button class="btn btn-outline-primary" type="button">
  <span class="spinner-border text-primary" role="status"></span>
  <span class="btn-text">Export of csv in progress...</span>
</button>

Code example toast spinner

<div class="toast show" role="alert" aria-live="assertive" aria-atomic="true" data-autohide="false">
  <div class="toast-body">
    <i class="if">
      <span class="spinner-border text-primary" role="status"></span>
    </i>
    <div class="toast-content">
      <p>This is a simple toast.</p>
    </div>
    <button class="close" type="button" data-dismiss="toast" aria-label="Close">
      <i class="if if-close"></i>
    </button>
  </div>
</div>
@mietcls mietcls added enhancement New feature or request draft UX crash Not a bug, but a pattern that prevents us from reaching a certain goal. labels Sep 14, 2022
@mietcls mietcls moved this to Backlog 🪵 in Biblio overview Sep 14, 2022
@mietcls mietcls changed the title As a librarian, I when I export metadata of records to Excel, I get visual feedback. As a librarian, when I export metadata of records to Excel, I get visual feedback. Dec 22, 2022
@mietcls mietcls added the librarian Work that helps our colleagues label Sep 15, 2023
@mietcls mietcls added the good first issue Good for newcomers label Feb 27, 2024
@mietcls mietcls removed the draft label Mar 25, 2024
verheyenkoen added a commit that referenced this issue Jul 30, 2024
@verheyenkoen
Added download progress indicator #598
33c0311
@verheyenkoen
Copy link
Contributor

Implementation details:

  • Implementation is opt-in, by adding the download attribute to any <a>-tag that would download a file (eg <a href="http..." download>click here</a>). I opted-in everywhere else I could find a download link currently, so:
    • export publications
    • export datasets
    • download publication files
    • download candidate record files
  • It's a generic implementation so I didn't mention "CSV" or anything, just "Preparing download..." resp. "Download ready: {filename}".
  • The prepare-toast can not be dismissed. It obviously automatically goes away once the download is complete. For small file downloads you probably won't even see it. For downloads where we know the file size in advance, it may be better to opt-in dynamically based on file size (eg. > 1MB) but I didn't do that yet.
  • The confirm-toast looks like this:
    image
  • Depending on your browser settings, the file will auto-download or present the save-as-folder, which can be cancelled. The link in the toast can also be clicked to save a local cached copy (blob) of the file again. Therefore, the confirmation toast does not auto-hide. Can be easily changed but then probably also best to remove the download link in there.

@verheyenkoen verheyenkoen mentioned this issue Jul 30, 2024
Draft
@mietcls
Copy link
Member Author

mietcls commented Jul 30, 2024 •
edited
Loading

The prepare-toast can not be dismissed.

Perhaps we should replace it with the button download spinner (version A) in the meantime if it cannot be dismissed? It will be in the way of other actions probably.
Screenshot 2024-07-30 at 11 50 38

@verheyenkoen verheyenkoen linked a pull request Jul 30, 2024 that will close this issue
Download progress indicator #598 #1677
Draft
@verheyenkoen verheyenkoen self-assigned this Jul 30, 2024
verheyenkoen added a commit that referenced this issue Jul 30, 2024
@verheyenkoen
Added possibility to define download file name via download-attribute #…
04da661 
…598
@mietcls
Copy link
Member Author

mietcls commented Oct 23, 2024

Stale, might pick up later.

@mietcls
Copy link
Member Author

mietcls commented Oct 23, 2024

Stale, might pick up later.

@mietcls mietcls closed this as not planned Won't fix, can't repro, duplicate, stale Oct 23, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@verheyenkoen verheyenkoen

Labels
enhancement New feature or request good first issue Good for newcomers librarian Work that helps our colleagues Mini Biblio UX crash Not a bug, but a pattern that prevents us from reaching a certain goal.
Projects
Biblio product backlog
Status: Done
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Download progress indicator #598 ugent-library/biblio-backoffice
2 participants
@verheyenkoen @mietcls