dotCMS / dotCMS/core

[EPIC] CD: Implement Content Preview Side Panel

Open
#32,354 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
Java
Stars
970
Forks
486
Avg merge
3d 33m
Merged PRs (30d)
170

Description

Feature Title

CD: Implement Content Preview Side Panel

Image

Description

There is currently not a good way to preview the file, folder, content item, video or in general selected object in the list view. While there exists an icon or thumbnail in the list view, it is way too small to provide a decent preview. We need to provide the user with a better preview of the object they have selected to help them decide whether or not to open it, delete it, move it or otherwise perform any actions on it.
Users will be able to preview the selected objects directly from the list view just by selecting them and seeing their preview in the side panel, this will help them identify objects and decide whether or not they want to interact with them to edit them or perform any other operation on them.

Personas

  • Developer teams
  • Content teams
  • DevOps teams
  • Sys Admin

Demo Expectations

  • Demonstrate selecting a file or content item in the content listing and observe the side panel appearing.
  • Verify that the metadata (ID, Type, Created Date, Modified Date, Status, Tags) is displayed correctly in the side panel.
  • Demonstrate image preview for image files.
  • Demonstrate video preview for video files.
  • Demonstrate than Content Page, Blog Post shows a Title and short description.
Success Criteria
  • A side panel displays when a file or content item is selected in the content listing.
  • The side panel displays the following metadata: ID, Type, Created Date, Modified Date, Status, and Tags.
  • Image files display a thumbnail preview.
  • Video files display a video player with a play button.
  • The basic metadata is accurate and relevant to the selected content item.
  • Links to edit the asset in their respective portlets, including UVE

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

No files or tests are named. Start at the content listing entry point and trace how selecting an object can expose a side panel, then review the edit links to the relevant portlets and UVE. Done means the panel shows the specified metadata and previews for images, videos, Content Pages, and Blog Posts.

Written by the indexing model from the issue text.

Assessment

Tech stack
java
Domain
content, frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.