Display simple files preview as grid

[exalate-issue-sync]

Description

User Stories

• As an early adopter I'd like to see file previews in a grid view, so that I dont need to read filenames to find the right file.

Value

Acceptance Criteria

1. mimetype Images/video: jpg, png, gif etc. image fits into the preview-container as object-fit: cover
2. preview Documents: if supported, show a preview of the document. document-preview fits into the preview-container as object-fit: scale-down
3. Show Icon: if not-previewable filetype: show only the Icon

• Arrange previews in grid view (not in list)
• Tile-Size: the following width refers to the width of a single tile:
  • Ratio: 10:9 (eg. 192 x 172,5 px)
  • default width: 12 rem
  • hint: later we'll have a configurable width (slider)
• for now we'll accept to have "missing" tiles in the last row of a paginated page
• show the fielname
• click on tile or filename triggers the default file action

Note - not included:
❌ selection
❌ hover
❌ context menu
❌ lazyloading for tiles

Definition of done

• Functional requirements
  [ ] functionality described in the user story works
  [ ] acceptance criteria are fulfilled
• Quality
  [ ] codre review happened
  [ ] CI is green
  [ ] critical code received unit tests by the developer
  [ ] automated tests passed (if automated tests are not available, this test needs to be created and passed
• Non-functional requirements
  [ ] no sonar cloud issues