WIP: Job's page in Vue to support realtime updates and UI improvements
What does this MR do?
This is the main MR of a series of MR to rewrite jobs show view in vue.js and improve UI. All smaller MR are going to be merged into this one first.
Architecture plan for this vue is: https://docs.google.com/document/d/13-gmGPbdkPZjHynwD44TPYj_6LJED9JW1ec6y_hVe0g/edit
We need to support real-time updates and we need to improve the UI at the same time. The plan is:
-
Create a vue app following the documentation -
Divide the interface into components: -
Header Component -
CI Status Badge Component 1. [x] CI Icon Component - already exists, we can reuse it -
Description -
Author Component -
New issue Button -
Async Button - Retry job
-
-
Trace Log Component -
Truncated information Component -
Scroll Controls -
Sidebar Component -
Artifacts 1. [x] Buttons -
Details 1. [x] Buttons -
Commit -
Tags 1. [x] Tag component -
Stage 1. [x] Dropdown -
Jobs List 1. [x] Arrow 1. [x] CI Icon Component 1. [x] Job Name 1. [x] Job action
-
Include UI improvements -
Remove old code -
Write tests
This will also need changes in the API.
Screenshots
Does this MR meet the acceptance criteria?
-
Changelog entry added, if necessary -
Documentation created/updated -
API support added - Tests
-
Added for this feature/bug -
All builds are passing
-
-
Conform by the merge request performance guides -
Conform by the style guides -
Branch has no merge conflicts with master
(if it does - rebase it please) -
Squashed related commits together
What are the relevant issue numbers?
Closes #24339 (closed) Closes #30117 (closed) Closes #31397 (closed) Closes #30901 (closed) Closes #29948 (closed)
Edited by Filipa Lacerda