WhoReacted: fix scroll jumping when rendering users (#2271)

Co-authored-by: V <vendicated@riseup.net>

src/plugins/whoReacted/index.tsx

@@ -29,7 +29,7 @@ import { Message, ReactionEmoji, User } from "discord-types/general";
 
 const UserSummaryItem = findComponentByCodeLazy("defaultRenderUser", "showDefaultAvatarsForNullUsers");
 const AvatarStyles = findByPropsLazy("moreUsers", "emptyUser", "avatarContainer", "clickableAvatar");
-
+let Scroll: any = null;
 const queue = new Queue();
 let reactions: Record<string, ReactionCacheEntry>;
 
@@ -91,7 +91,7 @@ function handleClickAvatar(event: React.MouseEvent<HTMLElement, MouseEvent>) {
 export default definePlugin({
     name: "WhoReacted",
     description: "Renders the avatars of users who reacted to a message",
-    authors: [Devs.Ven, Devs.KannaDev],
+    authors: [Devs.Ven, Devs.KannaDev, Devs.newwares],
 
     patches: [{
         find: ",reactionRef:",
@@ -105,7 +105,19 @@ export default definePlugin({
             match: /(?<=CONNECTION_OPEN:function\(\){)(\i)={}/,
             replace: "$&;$self.reactions=$1"
         }
-    }],
+    },
+    {
+
+        find: "cleanAutomaticAnchor(){",
+        replacement: {
+            match: /this\.automaticAnchor=null,this\.messageFetchAnchor=null,/,
+            replace: "$&$self.setScrollObj(this),"
+        }
+    }
+    ],
+    setScrollObj(scroll: any) {
+        Scroll = scroll;
+    },
 
     renderUsers(props: RootObject) {
         return props.message.reactions.length > 10 ? null : (
@@ -114,9 +126,13 @@ export default definePlugin({
             </ErrorBoundary>
         );
     },
-
     _renderUsers({ message, emoji, type }: RootObject) {
         const forceUpdate = useForceUpdater();
+        React.useLayoutEffect(() => { // bc need to prevent autoscrolling
+            if (Scroll?.scrollCounter > 0) {
+                Scroll.setAutomaticAnchor(null);
+            }
+        });
         React.useEffect(() => {
             const cb = (e: any) => {
                 if (e.messageId === message.id)

src/utils/constants.ts

@@ -413,6 +413,10 @@ export const Devs = /* #__PURE__*/ Object.freeze({
     Elvyra: {
         name: "Elvyra",
         id: 708275751816003615n,
+    },
+    newwares: {
+        name: "newwares",
+        id: 421405303951851520n
     }
 } satisfies Record<string, Dev>);