diff --git a/app/soapbox/components/scrollable_list.tsx b/app/soapbox/components/scrollable_list.tsx index 92cf79348..0e2708dd8 100644 --- a/app/soapbox/components/scrollable_list.tsx +++ b/app/soapbox/components/scrollable_list.tsx @@ -3,7 +3,6 @@ import React, { useEffect, useRef, useMemo, useCallback } from 'react'; import { useHistory } from 'react-router-dom'; import { Virtuoso, Components, VirtuosoProps, VirtuosoHandle, ListRange, IndexLocationWithAlign } from 'react-virtuoso'; -import PullToRefresh from 'soapbox/components/pull-to-refresh'; import { useSettings } from 'soapbox/hooks'; import LoadMore from './load_more'; @@ -63,7 +62,10 @@ interface IScrollableList extends VirtuosoProps { placeholderComponent?: React.ComponentType | React.NamedExoticComponent, /** Number of placeholders to render while loading. */ placeholderCount?: number, - /** Pull to refresh callback. */ + /** + * Pull to refresh callback. + * @deprecated Put a PTR around the component instead. + */ onRefresh?: () => Promise, /** Extra class names on the Virtuoso element. */ className?: string, @@ -244,20 +246,12 @@ const ScrollableList = React.forwardRef(({ /> ); - /** Conditionally render inner elements. */ - const renderBody = (): JSX.Element => { - if (isEmpty) { - return renderEmpty(); - } else { - return renderFeed(); - } - }; - - return ( - - {renderBody()} - - ); + // Conditionally render inner elements. + if (isEmpty) { + return renderEmpty(); + } else { + return renderFeed(); + } }); export default ScrollableList; diff --git a/app/soapbox/features/bookmarks/index.tsx b/app/soapbox/features/bookmarks/index.tsx index c9e3e5de3..269aa8d1f 100644 --- a/app/soapbox/features/bookmarks/index.tsx +++ b/app/soapbox/features/bookmarks/index.tsx @@ -3,6 +3,7 @@ import React from 'react'; import { defineMessages, FormattedMessage, useIntl } from 'react-intl'; import { fetchBookmarkedStatuses, expandBookmarkedStatuses } from 'soapbox/actions/bookmarks'; +import PullToRefresh from 'soapbox/components/pull-to-refresh'; import StatusList from 'soapbox/components/status_list'; import SubNavigation from 'soapbox/components/sub_navigation'; import { Column } from 'soapbox/components/ui'; @@ -39,16 +40,17 @@ const Bookmarks: React.FC = () => {
- handleLoadMore(dispatch)} - onRefresh={handleRefresh} - emptyMessage={emptyMessage} - divideType='space' - /> + + handleLoadMore(dispatch)} + emptyMessage={emptyMessage} + divideType='space' + /> + ); }; diff --git a/app/soapbox/features/community_timeline/index.tsx b/app/soapbox/features/community_timeline/index.tsx index 4cc9ad65e..60670a160 100644 --- a/app/soapbox/features/community_timeline/index.tsx +++ b/app/soapbox/features/community_timeline/index.tsx @@ -3,6 +3,7 @@ import { defineMessages, FormattedMessage, useIntl } from 'react-intl'; import { connectCommunityStream } from 'soapbox/actions/streaming'; import { expandCommunityTimeline } from 'soapbox/actions/timelines'; +import PullToRefresh from 'soapbox/components/pull-to-refresh'; import SubNavigation from 'soapbox/components/sub_navigation'; import { Column } from 'soapbox/components/ui'; import { useAppDispatch, useSettings } from 'soapbox/hooks'; @@ -44,14 +45,15 @@ const CommunityTimeline = () => { return ( - } - divideType='space' - /> + + } + divideType='space' + /> + ); }; diff --git a/app/soapbox/features/home_timeline/index.tsx b/app/soapbox/features/home_timeline/index.tsx index 3e9fa5346..62b343c9e 100644 --- a/app/soapbox/features/home_timeline/index.tsx +++ b/app/soapbox/features/home_timeline/index.tsx @@ -3,6 +3,7 @@ import { defineMessages, useIntl, FormattedMessage } from 'react-intl'; import { Link } from 'react-router-dom'; import { expandHomeTimeline } from 'soapbox/actions/timelines'; +import PullToRefresh from 'soapbox/components/pull-to-refresh'; import { Column, Stack, Text } from 'soapbox/components/ui'; import Timeline from 'soapbox/features/ui/components/timeline'; import { useAppSelector, useAppDispatch, useFeatures } from 'soapbox/hooks'; @@ -59,47 +60,48 @@ const HomeTimeline: React.FC = () => { return ( - - - - - - - - + + + + + - {features.federating && ( - - - ), - }} + id='empty_column.home.subtitle' + defaultMessage='{siteTitle} gets more interesting once you follow other users.' + values={{ siteTitle }} /> - )} - - } - /> + + {features.federating && ( + + + + + ), + }} + /> + + )} + + } + /> + ); }; diff --git a/app/soapbox/features/notifications/index.tsx b/app/soapbox/features/notifications/index.tsx index 7b0848365..62e67fdb5 100644 --- a/app/soapbox/features/notifications/index.tsx +++ b/app/soapbox/features/notifications/index.tsx @@ -11,6 +11,7 @@ import { dequeueNotifications, } from 'soapbox/actions/notifications'; import { getSettings } from 'soapbox/actions/settings'; +import PullToRefresh from 'soapbox/components/pull-to-refresh'; import ScrollTopButton from 'soapbox/components/scroll-top-button'; import ScrollableList from 'soapbox/components/scrollable_list'; import { Column } from 'soapbox/components/ui'; @@ -161,7 +162,6 @@ const Notifications = () => { placeholderComponent={PlaceholderNotification} placeholderCount={20} onLoadMore={handleLoadOlder} - onRefresh={handleRefresh} onScrollToTop={handleScrollToTop} onScroll={handleScroll} className={classNames({ @@ -181,7 +181,9 @@ const Notifications = () => { count={totalQueuedNotificationsCount} message={messages.queue} /> - {scrollContainer} + + {scrollContainer} + ); }; diff --git a/app/soapbox/features/public_timeline/index.tsx b/app/soapbox/features/public_timeline/index.tsx index 948c19b6a..8c435173b 100644 --- a/app/soapbox/features/public_timeline/index.tsx +++ b/app/soapbox/features/public_timeline/index.tsx @@ -5,6 +5,7 @@ import { Link } from 'react-router-dom'; import { changeSetting } from 'soapbox/actions/settings'; import { connectPublicStream } from 'soapbox/actions/streaming'; import { expandPublicTimeline } from 'soapbox/actions/timelines'; +import PullToRefresh from 'soapbox/components/pull-to-refresh'; import SubNavigation from 'soapbox/components/sub_navigation'; import { Column } from 'soapbox/components/ui'; import Accordion from 'soapbox/features/ui/components/accordion'; @@ -91,14 +92,15 @@ const CommunityTimeline = () => { /> } - } - divideType='space' - /> + + } + divideType='space' + /> + ); }; diff --git a/app/soapbox/features/status/index.tsx b/app/soapbox/features/status/index.tsx index cc0ce6fcc..ca8f6928d 100644 --- a/app/soapbox/features/status/index.tsx +++ b/app/soapbox/features/status/index.tsx @@ -49,6 +49,7 @@ import { fetchNext, } from 'soapbox/actions/statuses'; import MissingIndicator from 'soapbox/components/missing_indicator'; +import PullToRefresh from 'soapbox/components/pull-to-refresh'; import ScrollableList from 'soapbox/components/scrollable_list'; import { textForScreenReader } from 'soapbox/components/status'; import SubNavigation from 'soapbox/components/sub_navigation'; @@ -796,23 +797,24 @@ class Status extends ImmutablePureComponent { - -
- } - initialTopMostItemIndex={ancestorsIds.size} - > - {children} - -
- - {!me && } -
+ + +
+ } + initialTopMostItemIndex={ancestorsIds.size} + > + {children} + +
+ + {!me && } +
+
); }