[go: up one dir, main page]
Skip to content

Implement "Permalink" to overflow menu in the Repository view

Summary

Add the permalink item to the repository overflow menu.

Expected Behaviour

Technical Details

  • Reuse the component (app/assets/javascripts/repository/components/header_area/permalink_dropdown_item.vue) added in !181901 (merged)
  • With the new field exposed from backend in #524081 (closed)

Old Summary

Update March 10, 2025

After the discussion on the copied url for repository permalink dropdown item in #452305 (comment 2388170096), we've added #524081 (closed) as dependency. #524081 (closed) will expose the directory path to frontend. The remaining scope left for this issue is to consume that new field by leveraging the new component added in !183897 (closed).

Proposal

✅ On blob page (completed)

Move "Permalink" to the overflow menu and change the behaviour to copy the permalink to the clipboard instead of changing the URL of the page.

Use a patch from #465489 (closed) to drop the double implementation and default to Vue-only solution.

When copied to the clipboard, we should display a toast that says "Permalink copied"

On repository page

Implement "Permalink" to the overflow menu base on the blob's implementation.

Current Proposal
image image

Technical breakdown

Spike: Repository Usability Improvements: Propose a Vue app structure for Repository and Blob

Current structure

"Permalink" control exists only on the blob page.

Blob Vue
  1. BlobControls app in app/assets/javascripts/repository/index.js?ref_type=heads#L131
  2. Rendered with GlButton in BlobControls: app/assets/javascripts/repository/components/blob_controls.vue?ref_type=heads#L183
Blob HAML
  1. Static button in app/views/projects/blob/_breadcrumb.html.haml#L34

Proposed structure

"Permalink" will become an item in more actions dropdown together with "Lock", "Replace" and "Delete" controls that are now inside the BlobButtonGroup component.

Given that we will need only Vue version of "Permalink", despite the blob page version.Remember that this button is bound to a keyboard shortcut. Moving it to Vue completely, should allow us to fix those two issues at the same time:

Edited by Chaoyue Zhao