Generalize modal display

client/src/App.vue

@@ -1,6 +1,6 @@
 <template>
   <div :class="{'no-scroll': showModal}">
-    <new-content-block-wizard v-if="showModal"></new-content-block-wizard>
+    <component :is="modalComponent" v-if="showModal"></component>
     <component :is="layout"></component>
   </div>
 </template>
@@ -27,6 +27,9 @@
       },
       showModal() {
         return this.$store.state.showModal
+      },
+      modalComponent() {
+        return 'new-content-block-wizard'
       }
     },
 

client/src/store/index.js

@@ -10,6 +10,7 @@ export default new Vuex.Store({
     specialContainerClass: '',
     showFilter: true,
     showModal: false,
+    showNewContentBlockModal: false,
     contentBlockPosition: {},
     scrollPosition: 0,
     moduleSlug: 'mein-neues-umfeld',
@@ -37,11 +38,11 @@ export default new Vuex.Store({
     },
     addContentBlock({commit, dispatch}, payload) {
       commit('setContentBlockPosition', payload);
-      dispatch('showModal');
+      dispatch('showModal', 'new-content-block-wizard');
     },
-    showModal({commit}) {
+    showModal({commit}, payload) {
       document.body.classList.add('no-scroll'); // won't get at the body any other way
-      commit('setModal', true);
+      commit('setModal', payload);
     },
     updateContentBlocks({commit}) {
       commit('updateContentBlocks', true);