MR: Pending <!-- NOTE: For context on MR heading, see: https://handbook.gitlab.com/handbook/engineering/devops/dev/create/remote-development/index.html#relationship-of-issues-to-mrs --> ## Description As part of our [new designs for Workspaces](https://gitlab.com/groups/gitlab-org/-/epics/18674), 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 https://gitlab.com/gitlab-org/gitlab/-/issues/562352+s 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 | {width=1259 height=70} | | After |  | ## Acceptance criteria - [ ] The workspace card has an expand button - [ ] This expand button opens up the card body - [x] ~~Display devfile.yaml external link~~ (See: https://gitlab.com/gitlab-org/gitlab/-/issues/565009+s) - [x] ~~Display related merge request details~~ (See: https://gitlab.com/gitlab-org/gitlab/-/issues/565013+s) - [x] ~~Display changed files with expandable file details~~ (See: https://gitlab.com/gitlab-org/gitlab/-/issues/565018+s) - [x] ~~Show open ports with multiple port numbers and links~~ (See: https://gitlab.com/gitlab-org/gitlab/-/issues/565025+s) - [x] ~~Add URL field with external link icons for workspace URLs~~ (See: https://gitlab.com/gitlab-org/gitlab/-/issues/565026+s) - [x] ~~Include workspace description with an edit link~~ (See: https://gitlab.com/gitlab-org/gitlab/-/issues/565047+s & https://gitlab.com/gitlab-org/gitlab/-/issues/565054+s) - [x] ~~Display created/terminated timestamps in user-friendly format~~ (See https://gitlab.com/gitlab-org/gitlab/-/issues/565055+s) - [x] ~~Show uptime information for running workspaces~~ (See https://gitlab.com/gitlab-org/gitlab/-/issues/565058+s) - [x] ~~Include health status with error counts and expandable error details~~ (See https://gitlab.com/gitlab-org/gitlab/-/issues/565062+s) ## TODO: Implementation plan - Add a clickable expand button - Expand the workspace [gl-card](https://design.gitlab.com/components/card#glcard) with a `bodyContent` prop