Skip to content

Setup admin deploy keys Vue application

What does this MR do and why?

Sets up the Vue app needed to convert Admin -> Deploy keys from HAML to Vue. This MR does the following:

  1. Introduces the admin_deploy_keys_vue feature flag
  2. Adds a #js-admin-deploy-keys-table mount element to app/views/admin/deploy_keys/index.html.haml#L20
  3. Creates a table.vue component that:
    • Renders the page title
    • Renders the New deploy key button
    • Renders an empty table
  4. Creates a index.js file that mounts table.vue to the #js-admin-deploy-keys-table mount element

The following will be completed in follow-up MRs:

  1. Populate the table using the deploy_keys API endpoint
  2. Display an empty state if there are no deploy keys
  3. Implement pagination

Screenshots or screen recordings

admin_deploy_keys_vue feature flag enabled

Screen_Shot_2021-11-03_at_12.17.49_PM

admin_deploy_keys_vue feature flag disabled

expected to look the same

Before After
Screen_Shot_2021-11-03_at_12.23.50_PM Screen_Shot_2021-11-03_at_12.23.06_PM

How to set up and validate locally

Numbered steps to set up and validate the change are strongly suggested.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Related to #344927 (closed)

Edited by Peter Hegman

Merge request reports