GitLab issueshttps://gitlab.com/gitlab-org/gitlab/-/issues2021-11-08T16:51:16Zhttps://gitlab.com/gitlab-org/gitlab/-/issues/321067Improve the ancestor indicator within epic sidebars2021-11-08T16:51:16ZAlexis GinsbergImprove the ancestor indicator within epic sidebars### Challenge
How might we better display where the currently viewed item falls within a larger hierarchy? For example, a currently viewed epic displays the ancestors/parents of the currently viewed epic in the sidebar:
<img src="/uploa...### Challenge
How might we better display where the currently viewed item falls within a larger hierarchy? For example, a currently viewed epic displays the ancestors/parents of the currently viewed epic in the sidebar:
<img src="/uploads/320e71d5051537e6c8d584e33713ca7b/image.png" width="300">
Is there a way we might better incorporate this into the tree view, so that there are two trees displayed in different ways within one work item?
### Instances for review
- Epic tree
- Epics (sidebar) :star:
### Competitive analysis
To be completed in https://gitlab.com/gitlab-org/gitlab-design/-/issues/1530
### Proposal
`TBD`
### Resources & documentation
* 🔖 **Documentation issue**
* 🔍 **Research issue**:https://gitlab.com/gitlab-org/gitlab/-/issues/12149Implement Pajamas tree component for deploy boards on Environments Page2022-12-06T23:56:00ZTaurie DavisImplement Pajamas tree component for deploy boards on Environments PageThe environments page currently lists all environments used by a project. If deploy boards are enabled, top-level environments (not review apps) will be shown as an accordion. When expanded, the deploy board is shown.
### Problem
Curre...The environments page currently lists all environments used by a project. If deploy boards are enabled, top-level environments (not review apps) will be shown as an accordion. When expanded, the deploy board is shown.
### Problem
Currently, deploy boards are lacking a visual cue that ties them to the environment above. The only indicator is the down arrow.
![Screen_Shot_2019-06-13_at_11.01.55_AM](/uploads/9bf0220d3dafbf89df3364bfde64da83/Screen_Shot_2019-06-13_at_11.01.55_AM.png)
This problem is exacerbated when there is a problem with the deploy board and a warning is shown.
![Screen_Shot_2019-06-13_at_11.01.01_AM](/uploads/e257c6b81d3dd9d73e7f71c58fba05c5/Screen_Shot_2019-06-13_at_11.01.01_AM.png)
When a user is viewing their environments, they should be able to quickly understand which deploy board is associated with which environment. When there is an issue with a board, it should be clear to the user which board is having the issue.
### Proposal
#### Phase 1
Small UI tweaks to aid in creating a visual hierarchy. Such as increasing border size or adding box shadows to create an emphasis that a deploy board belongs to an environment. Adjusting the proximity and placement of UI elements. De-emphasizing less important visual cues. As there is currently no design to go off of, this will require ~UX collaboration.
#### Phase 2
Once the [Pajamas Tree component](https://design.gitlab.com/components/tree/) is complete, revisit this issue and evaluate implementing the Environments Row and Deploy Board as a tree component.
[Design](https://gitlab.com/gitlab-org/gitlab/issues/199097#note_287256331):
![image](/uploads/3cf1dc69be41dc758af057941489cfdd/image.png)Backlog