Resolve "repository name bug"
What does this MR do and why?
- fixes the collapse of the breadcrumb - it only collapses when there is not enough space and uncollapses where there's more space
- uses
GlBreadcrumbbuilt-in copy-to-clipboard button - uses
GlBreadcrumbin the correct CSS flexbox context, which gets rid of the flickering collapse button
References
- repository name bug (#571470 - closed)
- [BUG] File breadcrumbs unnecessarily and random... (#570241)
- Add a slot to GlBreadcrumbs last item to popula... (gitlab-org/gitlab-services/design.gitlab.com#2918 - closed)
- Follow-up from "fix(GlBreadcrumb): Include clip... (gitlab-org/gitlab-services/design.gitlab.com#3170)
Screenshots or screen recordings
| Before | After |
|---|---|
| Screen_Recording_2025-11-12_at_16.09.39 | Screen_Recording_2025-11-12_at_16.07.15 |
How to set up and validate locally
Warning
Make sure you GDK is running with https enabled! Otherwise navigator.clipboard is undefined and clipboard button will throw an error!
- Go to a project
- Navigate inside a folder, make sure you have a couple of items in your repository breadcrumb. I recommend this GDK project:
http://gdk.test:8080/gitlab-org/iglu/-/tree/master/src/test/java/com/example/demo - Adjust the width of the browser's window. Make sure the breadcrumbs collapse, when there's not enough space and expand when you go back to a wide window. The first item shouldn't flicker, when the breadcrumbs are in a collapsed state.
MR acceptance checklist
Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Related to #571470 (closed) #570241
Edited by Paulina Sedlak-Jakubowska