From 11bd51564898854c652451c9a28d8f73afc6a293 Mon Sep 17 00:00:00 2001
From: diondiondion <mail@diondiondion.com>
Date: Thu, 25 Sep 2025 18:14:49 +0200
Subject: [PATCH] Allow accessing ref of ScrollContainer's child (#36265)

---
 .../mastodon/components/scrollable_list.jsx      |  2 +-
 .../containers/scroll_container/index.tsx        | 16 +++++++++++++++-
 .../mastodon/features/status/index.jsx           |  2 +-
 3 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/app/javascript/mastodon/components/scrollable_list.jsx b/app/javascript/mastodon/components/scrollable_list.jsx
index 47b6235c9e..38c3cd991b 100644
--- a/app/javascript/mastodon/components/scrollable_list.jsx
+++ b/app/javascript/mastodon/components/scrollable_list.jsx
@@ -399,7 +399,7 @@ class ScrollableList extends PureComponent {
 
     if (trackScroll) {
       return (
-        <ScrollContainer scrollKey={scrollKey}>
+        <ScrollContainer scrollKey={scrollKey} childRef={this.setRef}>
           {scrollableArea}
         </ScrollContainer>
       );
diff --git a/app/javascript/mastodon/containers/scroll_container/index.tsx b/app/javascript/mastodon/containers/scroll_container/index.tsx
index e7d2726715..0d0ab364dc 100644
--- a/app/javascript/mastodon/containers/scroll_container/index.tsx
+++ b/app/javascript/mastodon/containers/scroll_container/index.tsx
@@ -1,4 +1,9 @@
-import React, { useContext, useEffect, useRef } from 'react';
+import React, {
+  useContext,
+  useEffect,
+  useImperativeHandle,
+  useRef,
+} from 'react';
 
 import { defaultShouldUpdateScroll } from './default_should_update_scroll';
 import type { ShouldUpdateScrollFn } from './default_should_update_scroll';
@@ -11,6 +16,7 @@ interface ScrollContainerProps {
    */
   scrollKey: string;
   shouldUpdateScroll?: ShouldUpdateScrollFn;
+  childRef?: React.ForwardedRef<HTMLElement | undefined>;
   children: React.ReactElement;
 }
 
@@ -23,12 +29,20 @@ interface ScrollContainerProps {
 export const ScrollContainer: React.FC<ScrollContainerProps> = ({
   children,
   scrollKey,
+  childRef,
   shouldUpdateScroll = defaultShouldUpdateScroll,
 }) => {
   const scrollBehaviorContext = useContext(ScrollBehaviorContext);
 
   const containerRef = useRef<HTMLElement>();
 
+  /**
+   * If a childRef is passed, sync it with the containerRef. This
+   * is necessary because in this component's return statement,
+   * we're overwriting the immediate child component's ref prop.
+   */
+  useImperativeHandle(childRef, () => containerRef.current, []);
+
   /**
    * Register/unregister scrollable element with ScrollBehavior
    */
diff --git a/app/javascript/mastodon/features/status/index.jsx b/app/javascript/mastodon/features/status/index.jsx
index 2ceff2577f..7c38af3277 100644
--- a/app/javascript/mastodon/features/status/index.jsx
+++ b/app/javascript/mastodon/features/status/index.jsx
@@ -602,7 +602,7 @@ class Status extends ImmutablePureComponent {
           )}
         />
 
-        <ScrollContainer scrollKey='thread' shouldUpdateScroll={this.shouldUpdateScroll}>
+        <ScrollContainer scrollKey='thread' shouldUpdateScroll={this.shouldUpdateScroll} childRef={this.setContainerRef}>
           <div className={classNames('scrollable item-list', { fullscreen })} ref={this.setContainerRef}>
             {ancestors}