Remove editPending and SET_EDIT_PENDING from the store

webapp/components/Comment.vue

@@ -58,7 +58,7 @@
 </template>
 
 <script>
-import { mapGetters, mapMutations } from 'vuex'
+import { mapGetters } from 'vuex'
 import HcUser from '~/components/User/User'
 import ContentMenu from '~/components/ContentMenu'
 import ContentViewer from '~/components/Editor/ContentViewer'
@@ -126,15 +126,12 @@ export default {
     },
   },
   methods: {
-    ...mapMutations({
-      setEditPending: 'editor/SET_EDIT_PENDING',
-    }),
     isAuthor(id) {
       return this.user.id === id
     },
     editCommentMenu(showMenu) {
+      console.log('editCommentMenu, showMenu: ', showMenu)
       this.openEditCommentMenu = showMenu
-      this.setEditPending(showMenu)
     },
     async deleteCommentCallback() {
       try {

webapp/components/CommentForm/CommentForm.spec.js

@@ -54,7 +54,6 @@ describe('CommentForm.vue', () => {
       'editor/placeholder': () => {
         return 'some cool placeholder'
       },
-      'editor/editPending': () => false,
     }
     const store = new Vuex.Store({
       getters,

webapp/components/CommentForm/CommentForm.vue

@@ -1,5 +1,5 @@
 <template>
-  <ds-form v-show="!editPending" v-model="form" @submit="handleSubmit">
+  <ds-form v-model="form" @submit="handleSubmit">
     <template slot-scope="{ errors }">
       <ds-card>
         <hc-editor
@@ -30,7 +30,6 @@
 
 <script>
 import gql from 'graphql-tag'
-import { mapGetters } from 'vuex'
 import HcEditor from '~/components/Editor/Editor'
 import PostQuery from '~/graphql/PostQuery'
 import CommentMutations from '~/graphql/CommentMutations'
@@ -52,11 +51,6 @@ export default {
       users: [],
     }
   },
-  computed: {
-    ...mapGetters({
-      editPending: 'editor/editPending',
-    }),
-  },
   methods: {
     updateEditorContent(value) {
       const content = value.replace(/<(?:.|\n)*?>/gm, '').trim()

webapp/components/EditCommentForm/EditCommentForm.vue

@@ -8,14 +8,19 @@
         <ds-flex :gutter="{ base: 'small', md: 'small', sm: 'x-large', xs: 'x-large' }">
           <ds-flex-item :width="{ base: '0%', md: '50%', sm: '0%', xs: '0%' }" />
           <ds-flex-item :width="{ base: '40%', md: '20%', sm: '30%', xs: '30%' }">
-            <ds-button ghost class="cancelBtn" @click.prevent="closeEditWindow">
+            <ds-button
-              {{ $t('actions.cancel') }}
+              ghost
-            </ds-button>
+              class="cancelBtn"
+              @click.prevent="closeEditWindow"
+            >{{ $t('actions.cancel') }}</ds-button>
           </ds-flex-item>
           <ds-flex-item :width="{ base: '40%', md: '20%', sm: '40%', xs: '40%' }">
-            <ds-button type="submit" :loading="loading" :disabled="disabled || errors" primary>
+            <ds-button
-              {{ $t('post.comment.submit') }}
+              type="submit"
-            </ds-button>
+              :loading="loading"
+              :disabled="disabled || errors"
+              primary
+            >{{ $t('post.comment.submit') }}</ds-button>
           </ds-flex-item>
         </ds-flex>
       </ds-card>
@@ -26,7 +31,6 @@
 <script>
 import gql from 'graphql-tag'
 import HcEditor from '~/components/Editor/Editor'
-import { mapMutations } from 'vuex'
 import CommentMutations from '~/graphql/CommentMutations.js'
 
 export default {
@@ -52,9 +56,6 @@ export default {
     }
   },
   methods: {
-    ...mapMutations({
-      setEditPending: 'editor/SET_EDIT_PENDING',
-    }),
     updateEditorContent(value) {
       const sanitizedContent = value.replace(/<(?:.|\n)*?>/gm, '').trim()
       this.disabled = value === this.comment.content || sanitizedContent.length < 1
@@ -79,8 +80,7 @@ export default {
 
           this.$toast.success(this.$t('post.comment.updated'))
           this.disabled = false
-          this.$emit('showEditCommentMenu', false)
+          this.closeEditWindow()
-          this.setEditPending(false)
         })
         .catch(err => {
           this.$toast.error(err.message)

webapp/store/editor.js

@@ -1,7 +1,6 @@
 export const state = () => {
   return {
     placeholder: null,
-    editPending: false,
   }
 }
 
@@ -9,16 +8,10 @@ export const getters = {
   placeholder(state) {
     return state.placeholder
   },
-  editPending(state) {
-    return state.editPending
-  },
 }
 
 export const mutations = {
   SET_PLACEHOLDER_TEXT(state, text) {
     state.placeholder = text
   },
-  SET_EDIT_PENDING(state, boolean) {
-    state.editPending = boolean
-  },
 }