diff --git a/src/components/status_action_buttons/action_button.js b/src/components/status_action_buttons/action_button.js
index 4dc5f1bb3..193a96ee9 100644
--- a/src/components/status_action_buttons/action_button.js
+++ b/src/components/status_action_buttons/action_button.js
@@ -62,6 +62,7 @@ export default {
     'extra',
     'status',
     'funcArg',
+    'animationState',
     'getClass',
     'getComponent',
     'doAction',
@@ -72,9 +73,6 @@ export default {
     EmojiPicker,
     Popover
   },
-  data: () => ({
-    animationState: false
-  }),
   computed: {
     buttonClass () {
       return [
@@ -118,11 +116,7 @@ export default {
       if (button.name === 'emoji') {
         this.$refs.picker.showPicker()
       } else {
-        this.animationState = true
         this.getComponent(button) === 'button' && this.doAction(button)
-        setTimeout(() => {
-          this.animationState = false
-        }, 500)
         close()
       }
     }
diff --git a/src/components/status_action_buttons/action_button.vue b/src/components/status_action_buttons/action_button.vue
index 0e409afb8..b9dca8818 100644
--- a/src/components/status_action_buttons/action_button.vue
+++ b/src/components/status_action_buttons/action_button.vue
@@ -19,8 +19,7 @@
         <FAIcon
           class="fa-scale-110"
           :icon="button.icon(funcArg)"
-          :spin="!extra && button.animated?.() && animationState"
-          style="--fa-animation-duration: 750ms;"
+          :spin="!extra && button.animated?.() && animationState[button.name]"
           fixed-width
         />
         <template v-if="!buttonClass.disabled && button.toggleable?.(funcArg) && button.active">
diff --git a/src/components/status_action_buttons/status_action_buttons.js b/src/components/status_action_buttons/status_action_buttons.js
index 8ad0a3fec..a86c6044b 100644
--- a/src/components/status_action_buttons/status_action_buttons.js
+++ b/src/components/status_action_buttons/status_action_buttons.js
@@ -21,6 +21,11 @@ const StatusActionButtons = {
   emits: ['toggleReplying'],
   data () {
     return {
+      Popover,
+      animationState: {
+        retweet: false,
+        favorite: false
+      },
       showPin: false,
       showingConfirmDialog: false,
       currentConfirmTitle: '',
@@ -94,9 +99,11 @@ const StatusActionButtons = {
       }
     },
     doActionReal (button) {
+      this.animationState[button.name] = true
       button.action(this.funcArg)
         .then(() => this.$emit('onSuccess'))
         .catch(err => this.$emit('onError', err.error.error))
+        .finally(() => setTimeout(() => { this.animationState[button.name] = false }))
     },
     onExtraClose () {
       this.showPin = false
diff --git a/src/components/status_action_buttons/status_action_buttons.vue b/src/components/status_action_buttons/status_action_buttons.vue
index 8e6780ecd..81e000e7b 100644
--- a/src/components/status_action_buttons/status_action_buttons.vue
+++ b/src/components/status_action_buttons/status_action_buttons.vue
@@ -15,6 +15,7 @@
           :funcArg="funcArg"
           :get-class="getClass"
           :get-component="getComponent"
+          :animation-state="animationState"
           :close="() => {}"
           :do-action="doAction"
         />
@@ -83,6 +84,7 @@
                 :funcArg="funcArg"
                 :get-class="getClass"
                 :get-component="getComponent"
+                :animation-state="animationState"
                 :close="close"
                 :do-action="doAction"
               />