diff --git a/app/assets/javascripts/initializers/initializeAllFollowButts.js b/app/assets/javascripts/initializers/initializeAllFollowButts.js index fe113166c..008ef9d19 100644 --- a/app/assets/javascripts/initializers/initializeAllFollowButts.js +++ b/app/assets/javascripts/initializers/initializeAllFollowButts.js @@ -30,7 +30,7 @@ function fetchUserFollowStatuses(idButtonHash) { .then((response) => response.json()) .then((idStatuses) => { Object.keys(idStatuses).forEach(function (id) { - addButtClickHandle(idStatuses[id], idButtonHash[id]); + addButtClickHandles(idStatuses[id], idButtonHash[id]); }); }); } @@ -44,7 +44,11 @@ function initializeUserFollowButtons(buttons) { addModalEventListener(buttons[i]); } else { var userId = JSON.parse(buttons[i].dataset.info).id; - userIds[userId] = buttons[i]; + if (userIds[userId]) { + userIds[userId].push(buttons[i]); + } else { + userIds[userId] = [buttons[i]]; + } } } @@ -55,8 +59,9 @@ function initializeUserFollowButtons(buttons) { } function initializeUserFollowButts() { - var buttons = document.getElementsByClassName( - 'follow-action-button follow-user', + // Get all user follow buttons, avoiding any initialized already + var buttons = document.querySelectorAll( + '.follow-action-button.follow-user:not([data-click-initialized])', ); initializeUserFollowButtons(buttons); } @@ -106,7 +111,7 @@ function fetchButt(butt, buttInfo) { dataRequester.readyState === XMLHttpRequest.DONE && dataRequester.status === 200 ) { - addButtClickHandle(dataRequester.response, butt); + addButtClickHandles(dataRequester.response, [butt]); } }; dataRequester.open( @@ -117,15 +122,16 @@ function fetchButt(butt, buttInfo) { dataRequester.send(); } -function addButtClickHandle(response, butt) { +function addButtClickHandles(response, buttons) { // currently lacking error handling - var buttInfo = JSON.parse(butt.dataset.info); - assignInitialButtResponse(response, butt); - butt.onclick = function (e) { - e.preventDefault(); - handleOptimisticButtRender(butt); - }; - butt.dataset.clickInitialized = 'true'; + buttons.forEach((butt) => { + assignInitialButtResponse(response, butt); + butt.onclick = function (e) { + e.preventDefault(); + handleOptimisticButtRender(butt); + }; + butt.dataset.clickInitialized = 'true'; + }); } function handleTagButtAssignment(user, butt, buttInfo) { @@ -137,7 +143,7 @@ function handleTagButtAssignment(user, butt, buttInfo) { .indexOf(buttInfo.id) !== -1; var buttAssignmentBoolText = buttAssignmentBoolean ? 'true' : 'false'; - addButtClickHandle(buttAssignmentBoolText, butt); + addButtClickHandles(buttAssignmentBoolText, [butt]); } function assignInitialButtResponse(response, butt) { diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index ef9be3135..1ed676843 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -122,6 +122,8 @@ module ApplicationHelper def follow_button(followable, style = "full", classes = "") return if followable == DELETED_USER + user_follow = followable.instance_of?(User) ? "follow-user" : "" + tag.button( "Follow", name: :button, @@ -133,7 +135,7 @@ module ApplicationHelper style: style } }, - class: "crayons-btn follow-action-button whitespace-nowrap #{classes}", + class: "crayons-btn follow-action-button whitespace-nowrap #{classes} #{user_follow}", ) end diff --git a/app/javascript/packs/commentDropdowns.js b/app/javascript/packs/commentDropdowns.js index 130686193..4a93939ad 100644 --- a/app/javascript/packs/commentDropdowns.js +++ b/app/javascript/packs/commentDropdowns.js @@ -1,7 +1,7 @@ import { addSnackbarItem } from '../Snackbar'; import { initializeDropdown } from '@utilities/dropdownUtils'; -/* global Runtime initializeAllFollowButts */ +/* global Runtime initializeUserFollowButts */ const handleCopyPermalink = (closeDropdown) => { return (event) => { @@ -73,7 +73,7 @@ const fetchMissingProfilePreviewCard = async (placeholderElement) => { ); // Make sure the button inside the dropdown is initialized - initializeAllFollowButts(); + initializeUserFollowButts(); }; /** diff --git a/app/views/shared/_profile_card_content.html.erb b/app/views/shared/_profile_card_content.html.erb index b065e81dd..191103739 100644 --- a/app/views/shared/_profile_card_content.html.erb +++ b/app/views/shared/_profile_card_content.html.erb @@ -13,7 +13,7 @@ <% end %> <% if actor.class.name == "User" %>