(Used for reference) Refactor pipelines table to use GlTable
What does this MR do?
Code changes
This MR moves over the the pipelines table to utilize GlTable. Basically we are moving all the code out of pipelines_table_row.vue into pipelines_table.vue.
While doing this I created three new wrapper components.
- pipelines_commit.vue
- pipeline_manual_actions.vue
- pipelines_status_badge.vue
These three components were created to do validation in and pass the validated data down to the existing components. When using GlTable you loop over all the pipelines and we needed to validate some data in the script before passing to lower level components. So now we pass the entire pipeline to lower level components and let them do the validation work.
While reviewing this please pull down the branch and test the table out locally
UX changes
- Added duration heading
- Using
GlTablechanges heading font weight and padding a bit on the table - Left align duration cell text
Related to: #321257 (closed)
Screenshots (strongly suggested)
| BEFORE | AFTER |
|---|---|
 |
 |
Does this MR meet the acceptance criteria?
Conformity
-
Changelog entry -
Documentation (if required) -
Code review guidelines -
Merge request performance guidelines -
Style guides -
Database guides -
Separation of EE specific content
Availability and Testing
-
Review and add/update tests for this feature/bug. Consider all test levels. See the Test Planning Process. -
Tested in all supported browsers -
Informed Infrastructure department of a default or new setting change, if applicable per definition of done
Security
If this MR contains changes to processing or storing of credentials or tokens, authorization and authentication methods and other items described in the security review guidelines:
-
Label as security and @ mention @gitlab-com/gl-security/appsec -
The MR includes necessary changes to maintain consistency between UI, API, email, or other methods -
Security reports checked/validated by a reviewer from the AppSec team