As an author, I want to be able to easily identify content within the Tree view mode, so that I can find my relevant content faster.

Assets app tree view table updates

• Table header UI updates (check dev mode on Figma for styling details)
  • The header is now white instead of grey
  • The option to filter got removed
  • The text styling changed
  • Enabled 'Select all' (only selects what is rendered on the screen)
  • The 'Indeterminate' checkbox state gets added
• Table grid UI updates (check dev mode on Figma for styling details)
  • The row height increased
  • The text styling changed
  • The 'Name' and 'Title' information get merged in the same column
    • The 'Name' becomes the hero information of each item in the assets app (which currently is taken from the 'Assets Name field')
    • The 'title' information gets incorporated together with the page path (e.g.: /stories-demo/authors/author-food-pexels-photo-270308)
    • If the Name/Path info happens to be longer than the column, 'ellipses...' should be added at the end of the visible part of the content - the full information can be uncovered by expanding the column as it works currently
  • 'Modified' column to read 'Last updated'
  • Remove 'Type' column (e.g.: image/jpg) and replace with 'Format' (e.g.: jpg)
  • Add 'Size' (MB) and 'Dimension' (pixels) columns after 'Format'.
  • Remove the icon before the Asset name but keep the image thumbnail
    • Have image thumbnail preview when supported (current supported formats here, but it could add great user value to preview all other assets types, documents included).
    • When not supported or image not available: should behave as currently (e.g.: for a PDF document, show PDF icon rather than preview)
    • The image thumbnail size is bigger (52px width - 35px height)
  • Enlarged image preview when hovering the image thumbnail (more details about the thumbnail behaviour in MGNLDAM-1264)

Designs

• Screen Mockups
• Table rows components
• Table header component