diff --git a/webapp/components/LoginForm/LoginForm.story.js b/webapp/components/LoginForm/LoginForm.story.js
index ae422876a..d04481496 100644
--- a/webapp/components/LoginForm/LoginForm.story.js
+++ b/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: ``,
- }))
+ .add('successful login', () => {
+ return {
+ components: { LoginForm },
+ store: createStore({ loginSuccess: true }),
+ methods: {
+ handleSuccess() {
+ action('Login successful!')()
+ },
+ },
+ template: ``,
+ }
+ })
+ .add('unsuccessful login', () => {
+ return {
+ components: { LoginForm },
+ store: createStore({ loginSuccess: false }),
+ methods: {
+ handleSuccess() {
+ action('Login successful!')()
+ },
+ },
+ template: ``,
+ }
+ })
diff --git a/webapp/storybook/helpers.js b/webapp/storybook/helpers.js
index 790a10f78..8793da1e4 100644
--- a/webapp/storybook/helpers.js
+++ b/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) {