Skip to content

Introduction of the snippet_header Vue component

Denys Mishunov requested to merge 34820-snippets-header-vue into master

What does this MR do?

MR 3/6 in the plan for #34820 (closed). Hence this should not close original issue (though merging in master should happen) as the development happens behind the feature flag

The MR refactors snippet view's header component into Vue with support for GraphQL and Apollo.

Additionally (beyond the scope of original Issue), a proper modal for when deleting a snippet has been introduced instead of a plain alert.

Screenshots

The component

Before After
Screenshot_2019-12-17_at_09.01.14 Screenshot_2019-12-17_at_08.58.20

Things to note:

  • the snippet's title and description are not part of this MR and will be implemented in a separate component.
  • the icon, showing snippet's visibility is different as it relies on GlIcon instead of Font Awesome now.

The Delete action

Before After
Screenshot_2019-12-17_at_09.11.10 Screenshot_2019-12-17_at_09.10.47

Does this MR meet the acceptance criteria?

Conformity

Availability and Testing

  1. Enable the snippets_vue feature flag in Rails console (rails c):
Feature.enable(:snippets_vue)
  1. Navigate to any snippet. Only the header (the component in question for this MR) will be rendered. The component will be implemented in Vue rather than in HAML

Relates to #34820 (closed)

Edited by 🤖 GitLab Bot 🤖

Merge request reports