Add task configurations download as csv

[MichaelBuessemeyer]

This PR adds the download one or multiple task configurations as csv to wk. The download is available

• when creating one or multiple tasks
• in the task list view for each individual task
• at the top of of the table in the task list view to download the configurations of all loaded and filtered tasks

URL of deployed dev instance (used for testing):

• https://addtasksettingsascsvdownload.webknossos.xyz

Steps to test:

• Open the single task creation form and create a task. Upon success, a download of a CSV containing the configurations of the created task should be triggered,
• The same goes for the bulk creation. Please test whether the download works correctly for multiple tasks at the same time.
• In the task list view please also check the individual configurations download and the download of all tasks shown in the table.

Issues:

• fixes allow to download taskid-editposition mapping after task creation later #4407

---

• Updated changelog
• [ ] Updated migration guide if applicable
• [ ] Updated documentation if applicable
• [ ] Adapted wk-connect if datastore API changes
• [ ] Needs datastore update after deployment
• Ready for review

[MichaelBuessemeyer]

@normanrz I'll unassign you as @philippotto is available

[MichaelBuessemeyer]

@philippotto Could you please review this PR? I just added the changelog entry and the code should be cleaned up 🧹

[philippotto]

Cool stuff! However, see my few suggestions. Most notably, the format of the CSV should match the existing format which is currently shown in the modal.

Also, I think that constructing a CSV does not make much sense if it contains only one line. To solve this, I'd simply show a modal (as before) with the CSV content (only if tasks.length < 50 or so) and an additional "download as csv" button. If there are more than 50 tasks, the modal should still open and it would say "too many tasks to display in the browser. please download as csv" or something like that.
This has the additional benefit, that the user is in control over the download (i.e., they have to click a download button) and not surprised by it (or even worse he might even miss that something was downloaded).
Sorry for the change of plans, but I hope that it's not too much trouble :)

[MichaelBuessemeyer]

@philippotto Thanks for your feedback 👍

Sorry for the change of plans, but I hope that it's not too much trouble :)

No problem, this does not bother me. My main goal is to have clean code and the best UX. I missed that some browsers are configured to automatically download files without any pop-up. In my case firefox always opens a dialog and asks whether to download a file. That's why I did not see this as a problem :)

Just give me some time to implement this

[MichaelBuessemeyer]

@philippotto The newest version should include all of your feedback. Could you please have a look at the changes again 😄?

[MichaelBuessemeyer]

This file might be useful for testing the bulk creation. It should contain some valid tasks and some broken ones 👍
bulk_creation_test.txt

[philippotto]

Awesome! This will be a pretty nice update for the admins :)

I left some minor remarks, and I also have some suggestions to make the UI a bit nicer:

in summary:

• bold labels
• max-height: 300px and overflow: auto
• right-aligned download buttons
• spacer

Also, the UI for the "too many tasks" case looks a bit unpolished:

I suggest to change it like this (note that I centered the download button, since it's the main content of that section):

[philippotto]

subsequentMethod is quite an unusual name, in my opinion. I'd go with onFinish, onFinishCallback or onFinishFunction instead. Also, the method name can remain at handleFormSubmit, since the method name doesn't need to explain its parameters.

[MichaelBuessemeyer]

As you noticed correctly, I had problems with finding a good naming here. 😕
The reason why I renamed the handleFormSubmit method is, that this name was already used in line 142.

But in my opinion, the naming should be fine now in the newest changes. 👍

[MichaelBuessemeyer]

Thanks a lot for your very detailed feedback and also for the very good suggestions on how to improving the UI 😄

The look of the current version:

@philippotto Could you please review the newest changes / version of this PR? (I hope I did not miss something 🙈 )

[philippotto]

Awesome :) 🕺