fix: inject $toast into storybook components

webapp/components/LoginForm/LoginForm.story.js

@@ -1,18 +1,57 @@
 import { storiesOf } from '@storybook/vue'
 import { withA11y } from '@storybook/addon-a11y'
-import helpers from '~/storybook/helpers'
+import { action } from '@storybook/addon-actions'
 import Vue from 'vue'
-
+import Vuex from 'vuex'
+import helpers from '~/storybook/helpers'
 import LoginForm from './LoginForm.vue'
 
 helpers.init()
 
+const createStore = ({ loginSuccess }) => {
+  return new Vuex.Store({
+    modules: {
+      auth: {
+        namespaced: true,
+        actions: {
+          async login({ commit, dispatch }, args) {
+            action('Vuex action `auth/login`')(args)
+            if (loginSuccess) {
+              return loginSuccess
+            } else {
+              throw new Error('Login unsuccessful')
+            }
+          },
+        },
+      },
+    },
+  })
+}
+
 storiesOf('LoginForm', module)
   .addDecorator(withA11y)
   .addDecorator(helpers.layout)
-  .add('LoginForm', () => ({
-    components: { LoginForm },
-    data: () => ({}),
-    store: helpers.store,
-    template: `<login-form />`,
-  }))
+  .add('successful login', () => {
+    return {
+      components: { LoginForm },
+      store: createStore({ loginSuccess: true }),
+      methods: {
+        handleSuccess() {
+          action('Login successful!')()
+        },
+      },
+      template: `<login-form @success="handleSuccess"/>`,
+    }
+  })
+  .add('unsuccessful login', () => {
+    return {
+      components: { LoginForm },
+      store: createStore({ loginSuccess: false }),
+      methods: {
+        handleSuccess() {
+          action('Login successful!')()
+        },
+      },
+      template: `<login-form @success="handleSuccess"/>`,
+    }
+  })

webapp/storybook/helpers.js

@@ -3,6 +3,7 @@ import Vuex from 'vuex'
 import vuexI18n from 'vuex-i18n/dist/vuex-i18n.umd.js'
 import Styleguide from '@human-connection/styleguide'
 import Filters from '~/plugins/vue-filters'
+import IziToast from '~/plugins/izi-toast'
 import layout from './layout.vue'
 
 import '~/plugins/v-tooltip'
@@ -12,6 +13,7 @@ const helpers = {
     Vue.use(Vuex)
     Vue.use(Styleguide)
     Vue.use(Filters)
+    Vue.use(IziToast)
 
     Vue.use(vuexI18n.plugin, helpers.store)
     Vue.i18n.add('en', require('~/locales/en.json'))
@@ -35,14 +37,6 @@ const helpers = {
           },
         },
       },
-      editor: {
-        namespaced: true,
-        getters: {
-          placeholder(state) {
-            return 'Leave your inspirational thoughts ...'
-          },
-        },
-      },
     },
   }),
   layout(storyFn) {