Refactor Admin Deploy keys table to Vue
Summary
Follow up to #334874 (closed)
Currently the deploy keys table is rendered in HAML. This should be converted to Vue so we can use all of the GitLab UI components and it will be easier to build features in the future.
Improvements
- Can lazy load the deploy keys using the
deploy_keys
API endpoint - Easier to add features to the table in the future
- Adds pagination
- Fixes N+1 issue
Risks
- Missed existing functionality
Involved components
Implementation plan
- Add feature flag check and mount element to app/views/admin/deploy_keys/index.html.haml
- Create a
table.vue
component inapp/assets/javascripts/admin/deploy_keys/components
-
GlTable
will be used to render the table -
GlModal
will be used to confirm if a user wants to delete a key -
GlPagination
will be used for pagination - The data will be fetched via the
deploy_keys
API endpoint API endpoint
-
- Export a function from
app/assets/javascripts/admin/deploy_keys/index.js
that mountstable.vue
to the mount element in app/views/admin/deploy_keys/index.html.haml - Import and call that exported function in
app/assets/javascripts/pages/admin/deploy_keys/index/index.js
- Update feature specs spec/features/admin/admin_deploy_keys_spec.rb
Availability & Testing
Ensure package-and-qa
job is run and the end-to-end tests are green before merging.
Edited by Sanad Liaquat