Create Blame Info vue component
What does this MR do and why?
Creates a Vue component for blame info as part of rendering Blame file information within the Blob viewer frontend app.
The BlameInfo component will be used alongside the SourceViewer component and is being built in a way that would allow us to render the BlameInfo with minimal performance impact on the SourceViewer.
Note, in this iteration, we're not rendering the blame info in the DOM yet, we're just adding the component.
Since rendering blame information can have a big performance impact on the blob viewer, especially for large files with a long history, we have to try and render it in a performant way. This MR tries to solve this by allowing us to render the blame history alongside the source code without having to add any more markup to the highlighted source code. Furthermore, once we get to the stage where we'll render the blame information (follow-up) the implementation will allow us to render the blame information in chunks.
MR breakdown
| Description | MR |
|---|---|
| Extract Commit Info into vue component | !132101 (merged) |
| Create Blame Info vue component |
|
| Render Blame Info in the Source Viewer | follow-up |
Screenshots or screen recordings
No visual changes are expected, but here's a screenshot of what we're working towards:
| blame collapsed | blame expanded |
|---|---|
 |
 |
How to set up and validate locally
N/A
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Related to #425265 (closed)