Merge branch 'feature/post-status-errors' into 'develop'

Add error message in post status form when failing to post

Closes #24

See merge request !97
This commit is contained in:
lambadalambda 2017-08-20 08:14:27 -04:00
commit 47ab2b51cf
3 changed files with 33 additions and 13 deletions

View File

@ -39,6 +39,7 @@ const PostStatusForm = {
return { return {
dropFiles: [], dropFiles: [],
submitDisabled: false, submitDisabled: false,
error: null,
newStatus: { newStatus: {
status: statusText, status: statusText,
files: [] files: []
@ -90,7 +91,8 @@ const PostStatusForm = {
media: newStatus.files, media: newStatus.files,
store: this.$store, store: this.$store,
inReplyToStatusId: this.replyTo inReplyToStatusId: this.replyTo
}) }).then((data) => {
if (!data.error) {
this.newStatus = { this.newStatus = {
status: '', status: '',
files: [] files: []
@ -98,6 +100,11 @@ const PostStatusForm = {
this.$emit('posted') this.$emit('posted')
let el = this.$el.querySelector('textarea') let el = this.$el.querySelector('textarea')
el.style.height = '16px' el.style.height = '16px'
this.error = null
} else {
this.error = data.error
}
})
}, },
addMediaFile (fileInfo) { addMediaFile (fileInfo) {
this.newStatus.files.push(fileInfo) this.newStatus.files.push(fileInfo)

View File

@ -19,6 +19,9 @@
<media-upload @uploading="disableSubmit" @uploaded="addMediaFile" @upload-failed="enableSubmit" :drop-files="dropFiles"></media-upload> <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 :disabled="submitDisabled" type="submit" class="btn btn-default base05 base01-background">Submit</button>
</div> </div>
<div class='error' v-if="error">
Error: {{ error }}
</div>
<div class="attachments"> <div class="attachments">
<div class="attachment" v-for="file in newStatus.files"> <div class="attachment" v-for="file in newStatus.files">
<i class="fa icon-cancel" @click="removeMediaFile(file)"></i> <i class="fa icon-cancel" @click="removeMediaFile(file)"></i>
@ -61,6 +64,13 @@
width: 10em; width: 10em;
} }
} }
.error {
border-radius: 5px;
text-align: center;
background-color: rgba(255, 48, 16, 0.65);
padding: 0.25em;
margin: 0.35em;
}
.attachments { .attachments {
padding: 0 0.5em; padding: 0 0.5em;

View File

@ -7,12 +7,15 @@ const postStatus = ({ store, status, media = [], inReplyToStatusId = undefined }
return apiService.postStatus({credentials: store.state.users.currentUser.credentials, status, mediaIds, inReplyToStatusId}) return apiService.postStatus({credentials: store.state.users.currentUser.credentials, status, mediaIds, inReplyToStatusId})
.then((data) => data.json()) .then((data) => data.json())
.then((data) => { .then((data) => {
if (!data.error) {
store.dispatch('addNewStatuses', { store.dispatch('addNewStatuses', {
statuses: [data], statuses: [data],
timeline: 'friends', timeline: 'friends',
showImmediately: true, showImmediately: true,
noIdUpdate: true // To prevent missing notices on next pull. noIdUpdate: true // To prevent missing notices on next pull.
}) })
}
return data
}) })
} }