Skip to content

Refactor components for reusability: Reactions / Emoji (note_awards_list.vue)

Summary

In order to be able to use an Emoji component written in Vue for the upcoming Vue refactor of Snippets, we'd like to reuse the component we're currently using for awards in notes.

Snippets Notes (Comments)
Screen_Shot_2019-12-14_at_02.14.33 Screen_Shot_2019-12-14_at_02.16.22

Note: To truly be reusable, we'll need to add the option of displaying initial emojis even if count is zero, like we do in Snippets (👍 👎)

Improvements

We have several places that could benefit from the component on notes becoming more generic, namely:

  • Snippets
  • Design Management Notes
  • (Potentially more places where we use Vue)

Risks

Creating yet another version of Emoji components.

Beware of existing discussions around exposing awarded Emoji via GraphQL.

Involved components

app/assets/javascripts/notes/components/note_awards_list.vue

Optional: Intended side effects

Easy to use a component that lists the awarded emoji, as well as an up-to-date list of emoji to be selected and awarded to a given object.

Optional: Missing test coverage