You need to sign in or sign up before continuing.
Prepare common Vue app for Repository and Blob header area
Prepare a sort of scaffolding - a common Vue app that will include all the UI elements and migrate inside it everything in its current shape.
Important: that means the blob will end up having one Vue app and we will move away from the duality in the top part of the page.
I suggest implementing this with one MR per location. We might want to use a short-lived feature flag to make sure we can easily switch back to previous implementation, when we encounter any issues.
Proposed structure
Here's a graphical representation of the header Vue app and its inner components, based on the location. The names of new components are just a suggestions.
Repository
flowchart LR
subgraph LastCommit
direction LR
CommitInfo ~~~ History
end
subgraph ide1 [Repository header]
direction LR
RefSelector ~~~ Search ~~~ Breadcrumbs ~~~ CopyPath
Icon&DirectoryName ~~~ AddNew ~~~ Code ~~~ Actions
end
Blob
flowchart LR
subgraph LastCommit
direction LR
CommitInfo ~~~ History
end
subgraph ide1 [Repository header]
direction LR
RefSelector ~~~ Search ~~~ Breadcrumbs ~~~ CopyPath
Icon&FileName ~~~ Edit ~~~ Actions
end
CodeOwners
Technical breakdown
Spike: Repository Usability Improvements: Propose a Vue app structure for Repository and Blob
Implementation plan
step | status |
---|---|
|
!167906 (merged) |
move code buttons (desktop & mobile) for tree header | !171946 (merged) |
move contents of app/views/projects/blob/_breadcrumb.html.haml | !172515 (merged) |
recreate projects/tree/lock_link in Vue | !174896 (merged) !174967 (merged) !175324 (merged) !175591 (merged) |
|
Edited by Paulina Sedlak-Jakubowska