Show Thumbnails in Dataset Table

[fm3]

Description

• Introduces new design for the dashboard dataset list:
  • thumbnails replace the "type" column
  • folders and inactive datasets have icons in place of the thumbnails
  • tags are now rendered beneath the dataset name, no longer in a separate column
• Fixes a backend bug where tags with special characters (" \ ,) would get unexpectedly split

Screenshots

URL of deployed dev instance (used for testing):

• https://datasettablethumbnails.webknossos.xyz

Steps to test:

• Open dashboard dataset list, browse around, should look pretty
• Add and remove tags with and without special characters

TODOs:

• decide how to handle multi-layer datasets (blending? apply mapping? or select a layer?)
• backend
  • include layerNames list in APIDatasetCompact
  • avoid duplicated layer names (e.g. connectome_file_test_dataset) (double left join…)
  • fix parsing sql array literals
  • doublecheck that updating view config clears thumbnail cache for that dataset
• frontend
  • unify tag + name column
  • add thumbnail image
  • user layerNames for thumbnail layer selection
  • styling
    • bigger font? name is more important than tags
    • tweak margins?
    • styling for folders
    • placeholder image for zero-layer datasets
  • remove type column, have folder icon be same size as thumbnails
  • repair dataset to dataset compact function
  • error when entering search query (clearing localstorage helps)
  • have someone who knows how to write frontend code look at it
  • if no tags, add "Add Tag" label to the plus icon
  • less aggressive colors for the tags
  • new placeholder icons

Follow-Up

• Dataset table: make content of main column break if there is no space #7487
• Should thumbnails be black if data loading fails? #7490

Issues:

• fixes Parsing dataset tags with special characters is broken again #7481
• fixes Show thumbnails in dataset list #7482

---

• Updated changelog
• Removed dev-only changes like prints and application.conf edits
• Considered common edge cases

[normanrz]

Sweet!

[philippotto]

very cool stuff 💯 only left smaller feedback.

[philippotto]

Great stuff 👍 I'm wondering whether the thumbnails will be a noticable performance hit. The first page of the dataset table can contain up to 50 datasets. This will incur 50 additional requests (can be cached of course). One could think about deferring the loading of a thumbnail (e.g., by a simple delay or by waiting until it is scrolled into view).
However, on the dev instance it's plenty fast. Let's merge it and see how it behaves in production.