Add expanded sections to workspace list cards
MR: Pending
Description
As part of our new designs for Workspaces, we want to display comprehensive workspace information in each card so that users can quickly access all relevant workspace details in one centralised view. This issue will transform the gl-card
added in Update workspace list component from compact li... (#562352) • Unassigned • Backlog to have a bodyContent
prop which will make the gl-card
component expandable.
All the properties displayed in the designs would be added to the UI in future issues under the same parent epic.
Before/After
Before |
![]() |
After | ![]() |
Acceptance criteria
-
The workspace card has an expand button -
This expand button opens up the card body -
Display devfile.yaml external link(See: Add devfile information section to workspace li... (#565009) • Unassigned • Backlog) -
Display related merge request details(See: Display related merge request details in expand... (#565013) • Unassigned • Backlog) -
Display changed files with expandable file details(See: Display workspace local file changes in expande... (#565018) • Unassigned • Backlog) -
Show open ports with multiple port numbers and links(See: Display open ports in expanded workspace list card (#565025) • Unassigned • Backlog) -
Add URL field with external link icons for workspace URLs(See: Add Workspace URL with external link to expande... (#565026) • Unassigned • Backlog) -
Include workspace description with an edit link(See: Add workspace description section to expanded w... (#565047) • Unassigned • Backlog & Implement workspace description editing functio... (#565054) • Unassigned • Backlog) -
Display created/terminated timestamps in user-friendly format(See Display created and termination timestamps in e... (#565055) • Unassigned • Backlog) -
Show uptime information for running workspaces(See Add uptime information for running workspaces i... (#565058) • Unassigned • Backlog) -
Include health status with error counts and expandable error details(See Add workspace health status with error counts a... (#565062) • Unassigned • Backlog)
TODO: Implementation plan
- Add a clickable expand button
- Expand the workspace gl-card with a
bodyContent
prop
Edited by Sahil Sharma