[go: up one dir, main page]

Skip to content

Reimplement Lock button to Blob Header in Vue

This is a follow-up issue to #323210 (closed), where we are rebuilding the Blob header into Vue.

This issue is to cover the "Replace" button

Backend support

Please see this comment:

we do want a GraphQL mutation to lock or unlock a given path (this is an EE-only feature), per this note: !61380 (comment 571707390)

Testing

  • Please run package-and-qa with the refactor_blob_viewer feature flag enabled when the work is complete, but before the flag is enabled on Staging or GitLab.com, to confirm that the QA test of the lock button passes.

Previous information

(Keeping for history puprposes)

Previous Information

In this issue > #323210 (closed), we are converting the Repo header from HAML into Vue and using GraphQL to make queries and mutations. To navigate to this page (Repository > Files > click on a file to see the blob viewer). In order for this to be done, we need some BE help in creating the necessary GraphQL schema for the FE to use.

- Query Mutation
Web IDE
Lock
Replace ?
Delete ?

Web IDE

Similar to the editBlobPath, can we also add a ie. webIdePath

https://docs.gitlab.com/ee/api/graphql/reference/#repositoryblob

Here's an example of the link: /-/ide/project/root/public-project/edit/master/-/app.js

Lock

For the lock button, we will need a Query and Mutation schema.

Mutation:

In the old lock button, we make a call to this endpoint > https://gitlab.com/gitlab-org/gitlab/blob/0d11dfeee18f582c380fcfa9acaade27541079b2/ee/app/assets/javascripts/path_locks.js#L21 (ex. /root/public-project/path_locks/toggle and passing the file as the param readme.md).

Query:

Will also need a field to check if the file has been locked or not. I guess it would be made available as the Web IDE path, so something like isLock field.

Replace and Delete

I'm not sure if these require a Query schema or not, so will need a bit more investigation.

As for mutation, we will need it. In the current way, the buttons trigger a model that submits a form

Replace Delete
image image
image image

replace-delete-sample

Edited by Mark Lapierre