Merge branch 'tusooa/react-button-fix' into 'develop'

Fix react button not working if reaction accounts are not loaded

See merge request pleroma/pleroma-fe!1837

3 files changed, 6 insertions, 4 deletions

diff --git a/changelog.d/react-button.fix b/changelog.d/react-button.fix
new file mode 100644
index 00000000..c2222fb6
--- /dev/null
+++ b/changelog.d/react-button.fix
@@ -0,0 +1 @@
+Fix react button not working if reaction accounts are not loaded
diff --git a/src/components/emoji_reactions/emoji_reactions.js b/src/components/emoji_reactions/emoji_reactions.js
index b4936424..4d5c6c5a 100644
--- a/src/components/emoji_reactions/emoji_reactions.js
+++ b/src/components/emoji_reactions/emoji_reactions.js
@@ -57,10 +57,10 @@ const EmojiReactions = {
     reactedWith (emoji) {
       return this.status.emoji_reactions.find(r => r.name === emoji).me
     },
-    fetchEmojiReactionsByIfMissing () {
+    async fetchEmojiReactionsByIfMissing () {
       const hasNoAccounts = this.status.emoji_reactions.find(r => !r.accounts)
       if (hasNoAccounts) {
-        this.$store.dispatch('fetchEmojiReactionsBy', this.status.id)
+        return await this.$store.dispatch('fetchEmojiReactionsBy', this.status.id)
       }
     },
     reactWith (emoji) {
@@ -69,9 +69,10 @@ const EmojiReactions = {
     unreact (emoji) {
       this.$store.dispatch('unreactWithEmoji', { id: this.status.id, emoji })
     },
-    emojiOnClick (emoji, event) {
+    async emojiOnClick (emoji, event) {
       if (!this.loggedIn) return
 
+      await this.fetchEmojiReactionsByIfMissing()
       if (this.reactedWith(emoji)) {
         this.unreact(emoji)
       } else {
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
index 93a4a957..ed21a730 100644
--- a/src/modules/statuses.js
+++ b/src/modules/statuses.js
@@ -757,7 +757,7 @@ const statuses = {
       )
     },
     fetchEmojiReactionsBy ({ rootState, commit }, id) {
-      rootState.api.backendInteractor.fetchEmojiReactions({ id }).then(
+      return rootState.api.backendInteractor.fetchEmojiReactions({ id }).then(
         emojiReactions => {
           commit('addEmojiReactionsBy', { id, emojiReactions, currentUser: rootState.users.currentUser })
         }