dotCMS / dotCMS/core

[TASK] Implement dynamic and clickable breadcrumbs for Content Drive folder navigation

Open
#33,803 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

dotCMS: Chrome Redesign Team : Falcon
Dominant language
Java
Stars
970
Forks
486
Avg merge
3d 33m
Merged PRs (30d)
170

Description

Description

The current breadcrumb navigation for the Content Drive is static and only displays Home > Content > Content Drive. It does not reflect the user's navigation deep into the internal folder structure of the Content Drive.

https://github.com/user-attachments/assets/f4cbc0b6-9460-4e53-a42a-eb6e19545151

This task is to enhance the breadcrumb functionality to make it dynamic. As a user navigates the folder tree (e.g., All > Application > apivtl > AI), the main breadcrumb bar should update to reflect the complete, navigable path.

The proposed solution must utilize the query parameters available in the Content Drive (e.g., folder) to manage the navigation state, determine the current path, and trigger the view/tree updates when a breadcrumb link is clicked.

Example of Desired Behavior:

  1. Current Breadcrumb: Home > Content > Content Drive

  2. User Navigates To: The AI folder, which is inside apivtl, which is inside Application, which is inside All.

  3. Desired Breadcrumb: Home > Content > Content Drive > All > Application > apivtl > AI

Clickable Functionality:

  • All segments of the new, dynamic path (e.g., "Content Drive", "All", "Application", "apivtl", "AI") must be clickable.

  • When a user clicks on a segment in the breadcrumb (for example, clicking on "apivtl"):

  • The main content area (the table) should refresh to show the contents of the apivtl folder.

  • The left-hand navigation tree should update to reflect this state: the apivtl folder should be selected and expanded, and any deeper-level folders (like AI) should be closed.

Acceptance Criteria
  • AC1: The main page breadcrumb must dynamically update as the user navigates the Content Drive's folder tree.

  • AC2: The breadcrumb path structure must be: Home > Content > Content Drive > [Path from tree].

  • AC3: The root folder "All" must be included in the breadcrumb path (e.g., ... > Content Drive > All > Application...).

  • AC4: All segments of the generated path (e.g., "Content Drive", "All", "Application") must be clickable links.

  • AC5: Clicking a breadcrumb segment (e.g., "Application") correctly updates the main content table to show the contents of that folder.

  • AC6: Clicking a breadcrumb segment also updates the left-hand navigation tree, collapsing other folders and showing the selected folder as open and active.

Priority

None

Additional Context

No response

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

Start at the Content Drive folder navigation entry point and trace how the folder query parameter drives the table and left-hand tree. Verify the breadcrumb path from Content Drive through nested folders, then confirm that clicking each segment refreshes the table and selects, expands, or collapses the corresponding tree state.

Written by the indexing model from the issue text.

Assessment

Domain
frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.