From d3169b057c1b3522930b044df5ee68b808c0da13 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Mon, 21 Aug 2017 15:35:14 +0300
Subject: [PATCH] Visual indicator for when posting is happening, as well as
disabling the button to prevent double-posts.
---
src/components/post_status_form/post_status_form.js | 3 +++
src/components/post_status_form/post_status_form.vue | 3 ++-
src/services/status_poster/status_poster.service.js | 5 +++++
3 files changed, 10 insertions(+), 1 deletion(-)
diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index 6b78b7dd..3313ec3f 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -40,6 +40,7 @@ const PostStatusForm = {
dropFiles: [],
submitDisabled: false,
error: null,
+ posting: false,
newStatus: {
status: statusText,
files: []
@@ -86,6 +87,7 @@ const PostStatusForm = {
this.caret = selectionStart
},
postStatus (newStatus) {
+ this.posting = true
statusPoster.postStatus({
status: newStatus.status,
media: newStatus.files,
@@ -104,6 +106,7 @@ const PostStatusForm = {
} else {
this.error = data.error
}
+ this.posting = false
})
},
addMediaFile (fileInfo) {
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index e1e3e4be..e775c45e 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -17,7 +17,8 @@
</div>
<div class='form-bottom'>
<media-upload @uploading="disableSubmit" @uploaded="addMediaFile" @upload-failed="enableSubmit" :drop-files="dropFiles"></media-upload>
- <button :disabled="submitDisabled" type="submit" class="btn btn-default base05 base01-background">Submit</button>
+ <button v-if="posting" disabled class="btn btn-default base05 base01-background">Posting</button>
+ <button v-else :disabled="submitDisabled" type="submit" class="btn btn-default base05 base01-background">Submit</button>
</div>
<div class='error' v-if="error">
Error: {{ error }}
diff --git a/src/services/status_poster/status_poster.service.js b/src/services/status_poster/status_poster.service.js
index ee8d160a..001ff8a5 100644
--- a/src/services/status_poster/status_poster.service.js
+++ b/src/services/status_poster/status_poster.service.js
@@ -17,6 +17,11 @@ const postStatus = ({ store, status, media = [], inReplyToStatusId = undefined }
}
return data
})
+ .catch((err) => {
+ return {
+ error: err.message
+ }
+ })
}
const uploadMedia = ({ store, formData }) => {