Fix spurious error and incorrect state change when adding a reaction twice (#12957)

* Fix spurious error and incorrect state change when adding a reaction twice

* Remove superfluous top border for announcements box

2 files changed, 18 insertions, 4 deletions

diff --git a/app/javascript/mastodon/actions/announcements.js b/app/javascript/mastodon/actions/announcements.js
index 64bf5ef91..53b19a6fd 100644
--- a/app/javascript/mastodon/actions/announcements.js
+++ b/app/javascript/mastodon/actions/announcements.js
@@ -56,12 +56,27 @@ export const updateAnnouncements = announcement => ({
 });
 
 export const addReaction = (announcementId, name) => (dispatch, getState) => {
-  dispatch(addReactionRequest(announcementId, name));
+  const announcement = getState().getIn(['announcements', 'items']).find(x => x.get('id') === announcementId);
+
+  let alreadyAdded = false;
+
+  if (announcement) {
+    const reaction = announcement.get('reactions').find(x => x.get('name') === name);
+    if (reaction && reaction.get('me')) {
+      alreadyAdded = true;
+    }
+  }
+
+  if (!alreadyAdded) {
+    dispatch(addReactionRequest(announcementId, name, alreadyAdded));
+  }
 
   api(getState).put(`/api/v1/announcements/${announcementId}/reactions/${name}`).then(() => {
-    dispatch(addReactionSuccess(announcementId, name));
+    dispatch(addReactionSuccess(announcementId, name, alreadyAdded));
   }).catch(err => {
-    dispatch(addReactionFail(announcementId, name, err));
+    if (!alreadyAdded) {
+      dispatch(addReactionFail(announcementId, name, err));
+    }
   });
 };
 
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index e4fafc091..6946971cd 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -6632,7 +6632,6 @@ noscript {
 
 .announcements {
   background: lighten($ui-base-color, 8%);
-  border-top: 1px solid $ui-base-color;
   font-size: 13px;
   display: flex;
   align-items: flex-end;