Define design pattern to use when using toast notifications within a VueX App
Everyone can contribute. Help move this issue forward while earning points, leveling up and collecting rewards.
Background
We currently use vue-toasted which is a plugin that allows us to fire toast messages. Since we rely on changes to vuex state to communicate across components, invoking it directly from the vue component can get a bit convoluted. We use gl-toasted from gitlab-ui with vue-toasted as the foundation.
Reason for issue: https://gitlab.com/gitlab-org/gitlab-ee/merge_requests/15015#note_206999469
We wanted to show a toast notification as a result of a successful ajax request.
Things to keep in mind
-
If we move away from the vue toasted plugin to the toast component in bootstrap-vue, this may change our approach. See: gitlab-ui#246 (closed)
-
Should work with multiple vue apps on the page.