From e3f0b955b8bc47eb4b3a81d2a896fbc473dc3b0c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Patryk=20Rzucid=C5=82o?= <patrykrzucidlo1@gmail.com>
Date: Wed, 30 Apr 2025 14:27:37 +0200
Subject: [PATCH] Fix directory scroll position reset (#34560)

---
 app/javascript/mastodon/components/load_more.tsx     | 12 ++++++++++--
 app/javascript/mastodon/features/directory/index.tsx |  9 +++++++--
 2 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/app/javascript/mastodon/components/load_more.tsx b/app/javascript/mastodon/components/load_more.tsx
index 8b5746ad30..aee235bb09 100644
--- a/app/javascript/mastodon/components/load_more.tsx
+++ b/app/javascript/mastodon/components/load_more.tsx
@@ -1,24 +1,32 @@
 import { FormattedMessage } from 'react-intl';
 
+import { LoadingIndicator } from './loading_indicator';
+
 interface Props {
   onClick: (event: React.MouseEvent) => void;
   disabled?: boolean;
   visible?: boolean;
+  loading?: boolean;
 }
 export const LoadMore: React.FC<Props> = ({
   onClick,
   disabled,
   visible = true,
+  loading = false,
 }) => {
   return (
     <button
       type='button'
       className='load-more'
-      disabled={disabled || !visible}
+      disabled={disabled || loading || !visible}
       style={{ visibility: visible ? 'visible' : 'hidden' }}
       onClick={onClick}
     >
-      <FormattedMessage id='status.load_more' defaultMessage='Load more' />
+      {loading ? (
+        <LoadingIndicator />
+      ) : (
+        <FormattedMessage id='status.load_more' defaultMessage='Load more' />
+      )}
     </button>
   );
 };
diff --git a/app/javascript/mastodon/features/directory/index.tsx b/app/javascript/mastodon/features/directory/index.tsx
index 1374f99235..a29febcd1a 100644
--- a/app/javascript/mastodon/features/directory/index.tsx
+++ b/app/javascript/mastodon/features/directory/index.tsx
@@ -130,6 +130,7 @@ export const Directory: React.FC<{
   }, [dispatch, order, local]);
 
   const pinned = !!columnId;
+  const initialLoad = isLoading && accountIds.size === 0;
 
   const scrollableArea = (
     <div className='scrollable'>
@@ -170,7 +171,7 @@ export const Directory: React.FC<{
       </div>
 
       <div className='directory__list'>
-        {isLoading ? (
+        {initialLoad ? (
           <LoadingIndicator />
         ) : (
           accountIds.map((accountId) => (
@@ -179,7 +180,11 @@ export const Directory: React.FC<{
         )}
       </div>
 
-      <LoadMore onClick={handleLoadMore} visible={!isLoading} />
+      <LoadMore
+        onClick={handleLoadMore}
+        visible={!initialLoad}
+        loading={isLoading}
+      />
     </div>
   );