Skip to content

Grid and list view

Folders and files in one place

Grid view (default)

  • Layout: A single responsive grid shows folders and files together (Google Drive style). Sub-folders of the current folder appear first as folder cards, then media items as media cards. No separate "folders only" or "files only" view. You see both in one place: click a folder card to go into it, or scroll to see the files. Each media card shows a thumbnail, filename/title, and optional details (e.g. date, size). Folder cards show a folder icon (with optional color), name, and item count; clicking one navigates into that folder.

  • Infinite scroll: As you scroll down, the next page of media is loaded automatically (IntersectionObserver near the bottom). So you can browse large libraries without pagination controls.

  • Folder sidebar: Visible (or openable) so you can navigate and drop items onto folders.

  • Empty state: When there are no folders and no media, a short message and icon suggest uploading or adjusting filters.

List view

  • Layout: A table-style list (MediaListView) with columns (e.g. thumbnail, title, type, date, folder). Rows are selectable; double-click opens the detail panel. You can change the folder for an item (e.g. dropdown) and delete from the row.

  • No sidebar: In list view the folder sidebar is hidden so the table can use full width. You still filter by folder via breadcrumb or by changing folder in the list.

  • Single page: List view typically loads one page of results (no infinite scroll in the same way); you can refine with search and filters.

Benefit: Use grid for visual browsing and folders; use list for dense, table-style editing and folder assignment.