Rewrite <LoadPending /> as FC and TS (mastodon#25363)

app/javascript/mastodon/components/load_pending.tsx

@@ -0,0 +1,18 @@
+import { FormattedMessage } from 'react-intl';
+
+interface Props {
+  onClick: (event: React.MouseEvent) => void;
+  count: number;
+}
+
+export const LoadPending: React.FC<Props> = ({ onClick, count }) => {
+  return (
+    <button className='load-more load-gap' onClick={onClick}>
+      <FormattedMessage
+        id='load_pending'
+        defaultMessage='{count, plural, one {# new item} other {# new items}}'
+        values={{ count }}
+      />
+    </button>
+  );
+};

app/javascript/mastodon/components/scrollable_list.jsx

@@ -16,7 +16,7 @@ import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from
 import IntersectionObserverWrapper from '../features/ui/util/intersection_observer_wrapper';
 
 import { LoadMore } from './load_more';
-import LoadPending from './load_pending';
+import { LoadPending } from './load_pending';
 import LoadingIndicator from './loading_indicator';
 
 const MOUSE_IDLE_DELAY = 300;