diff --git a/src/components/Message.vue b/src/components/Message.vue index 886d31fcf47221acac343a688f8f6c392f57bc85..73a53e31401b79245c5db84cdf46e4e0714ef616 100644 --- a/src/components/Message.vue +++ b/src/components/Message.vue @@ -135,7 +135,7 @@ export default { this.fetchMessage() }, methods: { - fetchMessage() { + async fetchMessage() { this.loading = true this.message = undefined this.errorMessage = '' @@ -145,51 +145,49 @@ export default { const messageUid = this.$route.params.messageUid - this.$store - .dispatch('fetchMessage', messageUid) - .then(message => { - // TODO: add timeout so that message isn't flagged when only viewed - // for a few seconds - if (message.uid !== this.$route.params.messageUid) { - Logger.debug("User navigated away, loaded message won't be shown nor flagged as seen") - return - } - - this.message = message - - if (this.message === undefined) { - Logger.info('message could not be found', {messageUid}) - this.errorMessage = getRandomMessageErrorMessage() - this.loading = false - return - } - - const account = this.$store.getters.getAccount(message.accountId) - this.replyRecipient = buildReplyRecipients(message, { - label: account.name, - email: account.emailAddress, - }) - - this.replySubject = buildReplySubject(message.subject) + try { + const message = await this.$store.dispatch('fetchMessage', messageUid) + // TODO: add timeout so that message isn't flagged when only viewed + // for a few seconds + if (message && message.uid !== this.$route.params.messageUid) { + Logger.debug("User navigated away, loaded message won't be shown nor flagged as seen") + return + } - this.loading = false + this.message = message - this.envelope = this.$store.getters.getEnvelope(message.accountId, message.folderId, message.id) - if (!this.envelope.flags.unseen) { - // Already seen -> no change necessary - return - } + if (this.message === undefined) { + Logger.info('message could not be found', {messageUid}) + this.errorMessage = getRandomMessageErrorMessage() + this.loading = false + return + } - return this.$store.dispatch('toggleEnvelopeSeen', this.envelope) - }) - .catch(error => { - Logger.error('could not load message ', {messageUid, error}) - if (error.isError) { - this.errorMessage = t('mail', 'Could not load your message') - this.error = error - this.loading = false - } + const account = this.$store.getters.getAccount(message.accountId) + this.replyRecipient = buildReplyRecipients(message, { + label: account.name, + email: account.emailAddress, }) + + this.replySubject = buildReplySubject(message.subject) + + this.loading = false + + this.envelope = this.$store.getters.getEnvelope(message.accountId, message.folderId, message.id) + if (!this.envelope.flags.unseen) { + // Already seen -> no change necessary + return + } + + return this.$store.dispatch('toggleEnvelopeSeen', this.envelope) + } catch (error) { + Logger.error('could not load message ', {messageUid, error}) + if (error.isError) { + this.errorMessage = t('mail', 'Could not load your message') + this.error = error + this.loading = false + } + } }, replyMessage() { this.$router.push({