Skip to content

Add a slot to GlBreadcrumbs last item to populate with "Copy path to clipboard" button

As part of the work on the Repository page header, we implemented GlBreadcrumbs and moved the "Copy path to clipboard" button to be to the right of the breadcrumbs. As it looks the most logical place for that action:

CleanShot 2025-05-29 at 13.23.11.png

This does not allow us to implement the breadcrumbs in the recommended way, where they use gl-grow class to accommodate the available width of the viewport and collapse when needed. This caused an issue, where the breadcrumbs were flickering as they were constantly calculating between being able to fit the space and needing to collapse.

This problem is addressed in Adjust calculating collapsed breadcrumbs for a medium size variant, but we want to continue the conversation about the idea of adding a slot into the breadcrumbs. This way the button will be part of the breadcrumb item. It will help the calculation of the available space and allow to use the component with recommended gl-grow.

Here's the discussion we had so far:

@psjakubowska Also, thinking about that slot for the last breadcrumb item/breadcrumbs in general. I don't see much of the other use cases than having a button to copy the path. I'm wondering if I should just add that copy to clipboard button and have it control with a boolean, rather than a slot that people can put anything into 🤔


@thutterer About the slots topic... I didn't think through that fully, but in general, I'd prefer something generic and reusable over something that only solves one (main) use case. Assuming both approaches would be similar amount of work and complexity 🤷


@ameliabauerly I think the question you were specifically wanting feedback on from me was:

I'm wondering if I should just add that copy to clipboard button and have it control with a boolean, rather than a slot that people can put anything into 🤔

As Thomas points out, having the flexibility to add buttons beyond just copying does future proof this component, allowing for use cases we haven't thought of yet. The downside of this flexibility is that we may be over-engineering this component in ways that are causing additional complications. If 95% of the use cases just need a copy button, the slot is adding unnecessary complexity.

I haven't personally seen any other use cases beyond copying - though, it may be worth double checking that with @jeldergl as he's likely more familiar with recent requests. But, if it's true that we're not seeing many other use cases beyond copying currently, I'd lean toward the dedicated copy button with boolean control. The slot may be optimizing prematurely for flexibility that may never be needed, and we can always add a slot later if genuine use cases emerge.