Support editing

src/components/draft/draft.js

@@ -1,10 +1,12 @@
 import PostStatusForm from 'src/components/post_status_form/post_status_form.vue'
+import EditStatusForm from 'src/components/edit_status_form/edit_status_form.vue'
 import ConfirmModal from 'src/components/confirm_modal/confirm_modal.vue'
 import StatusContent from 'src/components/status_content/status_content.vue'
 
 const Draft = {
   components: {
     PostStatusForm,
+    EditStatusForm,
     ConfirmModal,
     StatusContent
   },

src/components/draft/draft.vue

@@ -46,9 +46,15 @@
     </div>
     <div v-if="editing">
       <PostStatusForm
+        v-if="draft.type !== 'edit'"
         v-bind="postStatusFormProps"
         @posted="handlePosted"
       />
+      <EditStatusForm
+        v-else
+        :params="postStatusFormProps"
+        @posted="handlePosted"
+      />
     </div>
     <teleport to="#modal">
       <confirm-modal

src/components/edit_status_form/edit_status_form.js

@@ -0,0 +1,41 @@
+import PostStatusForm from '../post_status_form/post_status_form.vue'
+import statusPosterService from '../../services/status_poster/status_poster.service.js'
+
+const EditStatusForm = {
+  components: {
+    PostStatusForm
+  },
+  props: {
+    params: {
+      type: Object,
+      required: true
+    }
+  },
+  methods: {
+    doEditStatus ({ status, spoilerText, sensitive, media, contentType, poll }) {
+      const params = {
+        store: this.$store,
+        statusId: this.params.statusId,
+        status,
+        spoilerText,
+        sensitive,
+        poll,
+        media,
+        contentType
+      }
+
+      return statusPosterService.editStatus(params)
+        .then((data) => {
+          return data
+        })
+        .catch((err) => {
+          console.error('Error editing status', err)
+          return {
+            error: err.message
+          }
+        })
+    }
+  }
+}
+
+export default EditStatusForm

src/components/edit_status_form/edit_status_form.vue

@@ -0,0 +1,10 @@
+<template>
+  <PostStatusForm
+    v-bind="params"
+    :post-handler="doEditStatus"
+    :disable-polls="true"
+    :disable-visibility-selector="true"
+  />
+</template>
+
+<script src="./edit_status_form.js"></script>

src/components/edit_status_modal/edit_status_modal.js

@@ -1,11 +1,10 @@
-import PostStatusForm from '../post_status_form/post_status_form.vue'
+import EditStatusForm from '../edit_status_form/edit_status_form.vue'
 import Modal from '../modal/modal.vue'
-import statusPosterService from '../../services/status_poster/status_poster.service.js'
 import get from 'lodash/get'
 
 const EditStatusModal = {
   components: {
-    PostStatusForm,
+    EditStatusForm,
     Modal
   },
   data () {
@@ -43,29 +42,6 @@ const EditStatusModal = {
     }
   },
   methods: {
-    doEditStatus ({ status, spoilerText, sensitive, media, contentType, poll }) {
-      const params = {
-        store: this.$store,
-        statusId: this.$store.state.editStatus.params.statusId,
-        status,
-        spoilerText,
-        sensitive,
-        poll,
-        media,
-        contentType
-      }
-
-      return statusPosterService.editStatus(params)
-        .then((data) => {
-          return data
-        })
-        .catch((err) => {
-          console.error('Error editing status', err)
-          return {
-            error: err.message
-          }
-        })
-    },
     closeModal () {
       this.$store.dispatch('closeEditStatusModal')
     }

src/components/edit_status_modal/edit_status_modal.vue

@@ -8,12 +8,9 @@
       <div class="panel-heading">
         {{ $t('post_status.edit_status') }}
       </div>
-      <PostStatusForm
+      <EditStatusForm
         class="panel-body"
-        v-bind="params"
+        :params="params"
-        :post-handler="doEditStatus"
-        :disable-polls="true"
-        :disable-visibility-selector="true"
         @posted="closeModal"
       />
     </div>