Code owners block causes layout shift
When you load a project file show page it doesn't immediately show Code owners block. Instead it's lazy loaded and displayed after the page load. This causes layout shift which should be avoided.
Visual demonstration
Screen_Recording_2022-12-23_at_18.28.01
Proposal
We will be displaying the CODEOWNERS well at all times, instead of only when an entry is present for the path. This means we would need to display for the following states:
- Initial
- Loaded with owners
- Expanded
- Empty / not defined for path
The design also assumes that Link to CODEOWNERS file from affected files (#258562 - closed) is complete because this issue does not have the question mark icon next to "Code owners".
| State | Design |
|---|---|
| Initial |  |
| Loaded with owners |  |
| Expanded |  |
| Empty / not defined for path |  |
For the CODEOWNERS file, this issue assumes that the following issues are complete:
- Link to the Code Owners documentation from CODE... (#258569 - closed)
- Link Branch Rules Overview from CODEOWNER file ... (#390137 - closed)
With the removal of the question mark icon, we would need to provide a path to docs from the CODEOWNERS file's well. The result of this change is that if the user wants to view the documentation about CODEOWNERS they would have to navigate to the CODEOWNERS file rather than directly from the well as it is currently.
Why?
The CODEOWNERS file will contain a path to "Manage branch rules" so this would be a centralize spot to link to code owners docs and provide navigation to branch rules for enabling code owners approval.
- Add button "Learn more" to the Codeowners well when there are owners loaded.
- Links to docs https://docs.gitlab.com/ee/user/project/code_owners.html
| Scenario | Design |
|---|---|
| No code owners defined (no change from #390137 (closed)) |  |
| Code owners defined |  |