refactor: Catch exception and show message when post toots

src/renderer/components/TimelineSpace/Modals/NewToot.vue

@@ -120,6 +120,7 @@ import { mapState, mapGetters } from 'vuex'
 import { clipboard } from 'electron'
 import Visibility from '~/src/constants/visibility'
 import Status from './NewToot/Status'
+import { NewTootTootLength, NewTootAttachLength, NewTootModalOpen, NewTootBlockSubmit } from '@/errors/validations'
 
 export default {
   name: 'new-toot',
@@ -216,15 +217,31 @@ export default {
         spoiler: this.spoiler
       }
 
-      await this.$store.dispatch('TimelineSpace/Modals/NewToot/postToot', form).catch(err => {
+      try {
+        await this.$store.dispatch('TimelineSpace/Modals/NewToot/postToot', form)
+        this.$store.dispatch('TimelineSpace/Modals/NewToot/updateHashtags', status.tags)
+        this.close()
+      } catch (err) {
         console.error(err)
-        this.$message({
-          message: this.$t('message.toot_error'),
-          type: 'error'
-        })
-      })
-      this.$store.dispatch('TimelineSpace/Modals/NewToot/updateHashtags', status.tags)
-      this.close()
+        if (err instanceof NewTootTootLength) {
+          this.$message({
+            message: this.$t('validation.new_toot.toot_length', { min: 1, max: this.tootMax }),
+            type: 'error'
+          })
+        } else if (err instanceof NewTootAttachLength) {
+          this.$message({
+            message: this.$t('validation.new_toot.attach_length', { max: 4 }),
+            type: 'error'
+          })
+        } else if (err instanceof NewTootModalOpen || err instanceof NewTootBlockSubmit) {
+          // Nothing
+        } else {
+          this.$message({
+            message: this.$t('message.toot_error'),
+            type: 'error'
+          })
+        }
+      }
     },
     selectImage() {
       this.$refs.image.click()

src/renderer/errors/validations.js

@@ -1,7 +1,13 @@
 export class NewTootModalOpen extends Error {}
 
+export class NewTootBlockSubmit extends Error {}
+
 export class NewTootTootLength extends Error {}
 
 export class NewTootAttachLength extends Error {}
 
 export class NewTootMediaDescription extends Error {}
+
+export class NewTootUnknownType extends Error {}
+
+export class AuthenticationError extends Error {}

src/renderer/store/TimelineSpace/Modals/NewToot.ts

@@ -5,7 +5,15 @@ import TootStatus, { StatusState } from './NewToot/Status'
 import { Module, MutationTree, ActionTree, GetterTree } from 'vuex'
 import { RootState } from '@/store'
 import AxiosLoading from '@/utils/axiosLoading'
-import { NewTootModalOpen, NewTootTootLength, NewTootAttachLength, NewTootMediaDescription } from '@/errors/validations'
+import {
+  NewTootModalOpen,
+  NewTootBlockSubmit,
+  NewTootTootLength,
+  NewTootAttachLength,
+  NewTootMediaDescription,
+  NewTootUnknownType,
+  AuthenticationError
+} from '@/errors/validations'
 
 type MediaDescription = {
   id: number
@@ -157,7 +165,7 @@ const actions: ActionTree<NewTootState, RootState> = {
       throw err
     })
   },
-  postToot: async ({ state, commit, rootState, dispatch }, { status, spoiler }) => {
+  postToot: async ({ state, commit, rootState, dispatch }, { status, spoiler }): Promise<Status> => {
     if (!state.modalOpen) {
       throw new NewTootModalOpen()
     }
@@ -190,9 +198,8 @@ const actions: ActionTree<NewTootState, RootState> = {
       throw new AuthenticationError()
     }
     if (state.blockSubmit) {
-      return
+      throw new NewTootBlockSubmit()
     }
-    commit(MUTATION_TYPES.CHANGE_BLOCK_SUBMIT, true)
 
     if (state.attachedMedias.length > 0) {
       if (state.attachedMedias.length > 4) {
@@ -209,6 +216,7 @@ const actions: ActionTree<NewTootState, RootState> = {
       })
     }
 
+    commit(MUTATION_TYPES.CHANGE_BLOCK_SUBMIT, true)
     const client = new Mastodon(rootState.TimelineSpace.account.accessToken, rootState.TimelineSpace.account.baseURL + '/api/v1')
     return client
       .post<Status>('/statuses', form)
@@ -268,7 +276,7 @@ const actions: ActionTree<NewTootState, RootState> = {
       .post<Attachment>('/media', formData)
       .then(res => {
         commit(MUTATION_TYPES.CHANGE_BLOCK_SUBMIT, false)
-        if (res.data.type === 'unknown') throw new UnknownTypeError()
+        if (res.data.type === 'unknown') throw new NewTootUnknownType()
         commit(MUTATION_TYPES.APPEND_ATTACHED_MEDIAS, res.data)
         return res.data
       })
@@ -329,6 +337,3 @@ const NewToot: Module<NewTootState, RootState> = {
 }
 
 export default NewToot
-
-class AuthenticationError {}
-class UnknownTypeError {}