diff options
Diffstat (limited to 'src/view/screens')
-rw-r--r-- | src/view/screens/AppPasswords.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/CustomFeed.tsx | 7 | ||||
-rw-r--r-- | src/view/screens/DiscoverFeeds.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/Feeds.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/Home.tsx | 261 | ||||
-rw-r--r-- | src/view/screens/ModerationBlockedAccounts.tsx | 4 | ||||
-rw-r--r-- | src/view/screens/ModerationMutedAccounts.tsx | 4 | ||||
-rw-r--r-- | src/view/screens/Notifications.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/PreferencesHomeFeed.tsx | 4 | ||||
-rw-r--r-- | src/view/screens/Profile.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/ProfileList.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/SavedFeeds.tsx | 174 | ||||
-rw-r--r-- | src/view/screens/Search.web.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/SearchMobile.tsx | 2 |
14 files changed, 235 insertions, 235 deletions
diff --git a/src/view/screens/AppPasswords.tsx b/src/view/screens/AppPasswords.tsx index 8fac86d34..32f9e13e1 100644 --- a/src/view/screens/AppPasswords.tsx +++ b/src/view/screens/AppPasswords.tsx @@ -19,7 +19,7 @@ import {CenteredView} from 'view/com/util/Views' type Props = NativeStackScreenProps<CommonNavigatorParams, 'AppPasswords'> export const AppPasswords = withAuthRequired( - observer(({}: Props) => { + observer(function AppPasswordsImpl({}: Props) { const pal = usePalette('default') const store = useStores() const {screen} = useAnalytics() diff --git a/src/view/screens/CustomFeed.tsx b/src/view/screens/CustomFeed.tsx index f4e1b0eb7..af4d01843 100644 --- a/src/view/screens/CustomFeed.tsx +++ b/src/view/screens/CustomFeed.tsx @@ -42,7 +42,7 @@ import {NavigationProp} from 'lib/routes/types' type Props = NativeStackScreenProps<CommonNavigatorParams, 'CustomFeed'> export const CustomFeedScreen = withAuthRequired( - observer((props: Props) => { + observer(function CustomFeedScreenImpl(props: Props) { const pal = usePalette('default') const store = useStores() const navigation = useNavigation<NavigationProp>() @@ -119,7 +119,10 @@ export const CustomFeedScreen = withAuthRequired( ) export const CustomFeedScreenInner = observer( - ({route, feedOwnerDid}: Props & {feedOwnerDid: string}) => { + function CustomFeedScreenInnerImpl({ + route, + feedOwnerDid, + }: Props & {feedOwnerDid: string}) { const store = useStores() const pal = usePalette('default') const {isTabletOrDesktop} = useWebMediaQueries() diff --git a/src/view/screens/DiscoverFeeds.tsx b/src/view/screens/DiscoverFeeds.tsx index 11f38c26a..6aa7a9e31 100644 --- a/src/view/screens/DiscoverFeeds.tsx +++ b/src/view/screens/DiscoverFeeds.tsx @@ -19,7 +19,7 @@ import debounce from 'lodash.debounce' type Props = NativeStackScreenProps<CommonNavigatorParams, 'DiscoverFeeds'> export const DiscoverFeedsScreen = withAuthRequired( - observer(({}: Props) => { + observer(function DiscoverFeedsScreenImpl({}: Props) { const store = useStores() const pal = usePalette('default') const feeds = React.useMemo(() => new FeedsDiscoveryModel(store), [store]) diff --git a/src/view/screens/Feeds.tsx b/src/view/screens/Feeds.tsx index 6e0706737..97c6e8672 100644 --- a/src/view/screens/Feeds.tsx +++ b/src/view/screens/Feeds.tsx @@ -25,7 +25,7 @@ const MOBILE_HEADER_OFFSET = 40 type Props = NativeStackScreenProps<FeedsTabNavigatorParams, 'Feeds'> export const FeedsScreen = withAuthRequired( - observer<Props>(({}: Props) => { + observer<Props>(function FeedsScreenImpl({}: Props) { const pal = usePalette('default') const store = useStores() const {isMobile} = useWebMediaQueries() diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx index 795d813d1..33cc2e110 100644 --- a/src/view/screens/Home.tsx +++ b/src/view/screens/Home.tsx @@ -28,7 +28,7 @@ const POLL_FREQ = 30e3 // 30sec type Props = NativeStackScreenProps<HomeTabNavigatorParams, 'Home'> export const HomeScreen = withAuthRequired( - observer(({}: Props) => { + observer(function HomeScreenImpl({}: Props) { const store = useStores() const pagerRef = React.useRef<PagerRef>(null) const [selectedPage, setSelectedPage] = React.useState(0) @@ -142,152 +142,141 @@ export const HomeScreen = withAuthRequired( }), ) -const FeedPage = observer( - ({ - testID, - isPageFocused, - feed, - renderEmptyState, - }: { - testID?: string - feed: PostsFeedModel - isPageFocused: boolean - renderEmptyState?: () => JSX.Element - }) => { - const store = useStores() - const {isMobile} = useWebMediaQueries() - const [onMainScroll, isScrolledDown, resetMainScroll] = - useOnMainScroll(store) - const {screen, track} = useAnalytics() - const [headerOffset, setHeaderOffset] = React.useState( - isMobile ? HEADER_OFFSET_MOBILE : HEADER_OFFSET_DESKTOP, - ) - const scrollElRef = React.useRef<FlatList>(null) - const {appState} = useAppState({ - onForeground: () => doPoll(true), - }) - const isScreenFocused = useIsFocused() +const FeedPage = observer(function FeedPageImpl({ + testID, + isPageFocused, + feed, + renderEmptyState, +}: { + testID?: string + feed: PostsFeedModel + isPageFocused: boolean + renderEmptyState?: () => JSX.Element +}) { + const store = useStores() + const {isMobile} = useWebMediaQueries() + const [onMainScroll, isScrolledDown, resetMainScroll] = useOnMainScroll(store) + const {screen, track} = useAnalytics() + const [headerOffset, setHeaderOffset] = React.useState( + isMobile ? HEADER_OFFSET_MOBILE : HEADER_OFFSET_DESKTOP, + ) + const scrollElRef = React.useRef<FlatList>(null) + const {appState} = useAppState({ + onForeground: () => doPoll(true), + }) + const isScreenFocused = useIsFocused() - React.useEffect(() => { - // called on first load - if (!feed.hasLoaded && isPageFocused) { - feed.setup() - } - }, [isPageFocused, feed]) + React.useEffect(() => { + // called on first load + if (!feed.hasLoaded && isPageFocused) { + feed.setup() + } + }, [isPageFocused, feed]) - const doPoll = React.useCallback( - (knownActive = false) => { - if ( - (!knownActive && appState !== 'active') || - !isScreenFocused || - !isPageFocused - ) { - return - } - if (feed.isLoading) { - return - } - store.log.debug('HomeScreen: Polling for new posts') - feed.checkForLatest() - }, - [appState, isScreenFocused, isPageFocused, store, feed], - ) + const doPoll = React.useCallback( + (knownActive = false) => { + if ( + (!knownActive && appState !== 'active') || + !isScreenFocused || + !isPageFocused + ) { + return + } + if (feed.isLoading) { + return + } + store.log.debug('HomeScreen: Polling for new posts') + feed.checkForLatest() + }, + [appState, isScreenFocused, isPageFocused, store, feed], + ) - const scrollToTop = React.useCallback(() => { - scrollElRef.current?.scrollToOffset({offset: -headerOffset}) - resetMainScroll() - }, [headerOffset, resetMainScroll]) + const scrollToTop = React.useCallback(() => { + scrollElRef.current?.scrollToOffset({offset: -headerOffset}) + resetMainScroll() + }, [headerOffset, resetMainScroll]) - const onSoftReset = React.useCallback(() => { - if (isPageFocused) { - scrollToTop() - feed.refresh() - } - }, [isPageFocused, scrollToTop, feed]) + const onSoftReset = React.useCallback(() => { + if (isPageFocused) { + scrollToTop() + feed.refresh() + } + }, [isPageFocused, scrollToTop, feed]) - // listens for resize events - React.useEffect(() => { - setHeaderOffset(isMobile ? HEADER_OFFSET_MOBILE : HEADER_OFFSET_DESKTOP) - }, [isMobile]) + // listens for resize events + React.useEffect(() => { + setHeaderOffset(isMobile ? HEADER_OFFSET_MOBILE : HEADER_OFFSET_DESKTOP) + }, [isMobile]) - // fires when page within screen is activated/deactivated - // - check for latest - React.useEffect(() => { - if (!isPageFocused || !isScreenFocused) { - return - } + // fires when page within screen is activated/deactivated + // - check for latest + React.useEffect(() => { + if (!isPageFocused || !isScreenFocused) { + return + } - const softResetSub = store.onScreenSoftReset(onSoftReset) - const feedCleanup = feed.registerListeners() - const pollInterval = setInterval(doPoll, POLL_FREQ) + const softResetSub = store.onScreenSoftReset(onSoftReset) + const feedCleanup = feed.registerListeners() + const pollInterval = setInterval(doPoll, POLL_FREQ) - screen('Feed') - store.log.debug('HomeScreen: Updating feed') - feed.checkForLatest() - if (feed.hasContent) { - feed.update() - } + screen('Feed') + store.log.debug('HomeScreen: Updating feed') + feed.checkForLatest() + if (feed.hasContent) { + feed.update() + } - return () => { - clearInterval(pollInterval) - softResetSub.remove() - feedCleanup() - } - }, [ - store, - doPoll, - onSoftReset, - screen, - feed, - isPageFocused, - isScreenFocused, - ]) + return () => { + clearInterval(pollInterval) + softResetSub.remove() + feedCleanup() + } + }, [store, doPoll, onSoftReset, screen, feed, isPageFocused, isScreenFocused]) - const onPressCompose = React.useCallback(() => { - track('HomeScreen:PressCompose') - store.shell.openComposer({}) - }, [store, track]) + const onPressCompose = React.useCallback(() => { + track('HomeScreen:PressCompose') + store.shell.openComposer({}) + }, [store, track]) - const onPressTryAgain = React.useCallback(() => { - feed.refresh() - }, [feed]) + const onPressTryAgain = React.useCallback(() => { + feed.refresh() + }, [feed]) - const onPressLoadLatest = React.useCallback(() => { - scrollToTop() - feed.refresh() - }, [feed, scrollToTop]) + const onPressLoadLatest = React.useCallback(() => { + scrollToTop() + feed.refresh() + }, [feed, scrollToTop]) - const hasNew = feed.hasNewLatest && !feed.isRefreshing - return ( - <View testID={testID} style={s.h100pct}> - <Feed - testID={testID ? `${testID}-feed` : undefined} - key="default" - feed={feed} - scrollElRef={scrollElRef} - onPressTryAgain={onPressTryAgain} - onScroll={onMainScroll} - scrollEventThrottle={100} - renderEmptyState={renderEmptyState} - headerOffset={headerOffset} + const hasNew = feed.hasNewLatest && !feed.isRefreshing + return ( + <View testID={testID} style={s.h100pct}> + <Feed + testID={testID ? `${testID}-feed` : undefined} + key="default" + feed={feed} + scrollElRef={scrollElRef} + onPressTryAgain={onPressTryAgain} + onScroll={onMainScroll} + scrollEventThrottle={100} + renderEmptyState={renderEmptyState} + headerOffset={headerOffset} + /> + {(isScrolledDown || hasNew) && ( + <LoadLatestBtn + onPress={onPressLoadLatest} + label="Load new posts" + showIndicator={hasNew} + minimalShellMode={store.shell.minimalShellMode} /> - {(isScrolledDown || hasNew) && ( - <LoadLatestBtn - onPress={onPressLoadLatest} - label="Load new posts" - showIndicator={hasNew} - minimalShellMode={store.shell.minimalShellMode} - /> - )} - <FAB - testID="composeFAB" - onPress={onPressCompose} - icon={<ComposeIcon2 strokeWidth={1.5} size={29} style={s.white} />} - accessibilityRole="button" - accessibilityLabel="New post" - accessibilityHint="" - /> - </View> - ) - }, -) + )} + <FAB + testID="composeFAB" + onPress={onPressCompose} + icon={<ComposeIcon2 strokeWidth={1.5} size={29} style={s.white} />} + accessibilityRole="button" + accessibilityLabel="New post" + accessibilityHint="" + /> + </View> + ) +}) diff --git a/src/view/screens/ModerationBlockedAccounts.tsx b/src/view/screens/ModerationBlockedAccounts.tsx index 10fa87080..7bbb6beee 100644 --- a/src/view/screens/ModerationBlockedAccounts.tsx +++ b/src/view/screens/ModerationBlockedAccounts.tsx @@ -27,7 +27,7 @@ type Props = NativeStackScreenProps< 'ModerationBlockedAccounts' > export const ModerationBlockedAccounts = withAuthRequired( - observer(({}: Props) => { + observer(function ModerationBlockedAccountsImpl({}: Props) { const pal = usePalette('default') const store = useStores() const {isTabletOrDesktop} = useWebMediaQueries() @@ -116,6 +116,8 @@ export const ModerationBlockedAccounts = withAuthRequired( onEndReached={onEndReached} renderItem={renderItem} initialNumToRender={15} + // FIXME(dan) + // eslint-disable-next-line react/no-unstable-nested-components ListFooterComponent={() => ( <View style={styles.footer}> {blockedAccounts.isLoading && <ActivityIndicator />} diff --git a/src/view/screens/ModerationMutedAccounts.tsx b/src/view/screens/ModerationMutedAccounts.tsx index eb822270a..31c46e640 100644 --- a/src/view/screens/ModerationMutedAccounts.tsx +++ b/src/view/screens/ModerationMutedAccounts.tsx @@ -27,7 +27,7 @@ type Props = NativeStackScreenProps< 'ModerationMutedAccounts' > export const ModerationMutedAccounts = withAuthRequired( - observer(({}: Props) => { + observer(function ModerationMutedAccountsImpl({}: Props) { const pal = usePalette('default') const store = useStores() const {isTabletOrDesktop} = useWebMediaQueries() @@ -112,6 +112,8 @@ export const ModerationMutedAccounts = withAuthRequired( onEndReached={onEndReached} renderItem={renderItem} initialNumToRender={15} + // FIXME(dan) + // eslint-disable-next-line react/no-unstable-nested-components ListFooterComponent={() => ( <View style={styles.footer}> {mutedAccounts.isLoading && <ActivityIndicator />} diff --git a/src/view/screens/Notifications.tsx b/src/view/screens/Notifications.tsx index 5dda965db..058f09034 100644 --- a/src/view/screens/Notifications.tsx +++ b/src/view/screens/Notifications.tsx @@ -24,7 +24,7 @@ type Props = NativeStackScreenProps< 'Notifications' > export const NotificationsScreen = withAuthRequired( - observer(({}: Props) => { + observer(function NotificationsScreenImpl({}: Props) { const store = useStores() const [onMainScroll, isScrolledDown, resetMainScroll] = useOnMainScroll(store) diff --git a/src/view/screens/PreferencesHomeFeed.tsx b/src/view/screens/PreferencesHomeFeed.tsx index bd6dd8b39..49c13bfa3 100644 --- a/src/view/screens/PreferencesHomeFeed.tsx +++ b/src/view/screens/PreferencesHomeFeed.tsx @@ -48,7 +48,9 @@ type Props = NativeStackScreenProps< CommonNavigatorParams, 'PreferencesHomeFeed' > -export const PreferencesHomeFeed = observer(({navigation}: Props) => { +export const PreferencesHomeFeed = observer(function PreferencesHomeFeedImpl({ + navigation, +}: Props) { const pal = usePalette('default') const store = useStores() const {isTabletOrDesktop} = useWebMediaQueries() diff --git a/src/view/screens/Profile.tsx b/src/view/screens/Profile.tsx index a78650b3f..69b5ceee6 100644 --- a/src/view/screens/Profile.tsx +++ b/src/view/screens/Profile.tsx @@ -32,7 +32,7 @@ import {combinedDisplayName} from 'lib/strings/display-names' type Props = NativeStackScreenProps<CommonNavigatorParams, 'Profile'> export const ProfileScreen = withAuthRequired( - observer(({route}: Props) => { + observer(function ProfileScreenImpl({route}: Props) { const store = useStores() const {screen, track} = useAnalytics() const viewSelectorRef = React.useRef<ViewSelectorHandle>(null) diff --git a/src/view/screens/ProfileList.tsx b/src/view/screens/ProfileList.tsx index e86a457b6..322f99486 100644 --- a/src/view/screens/ProfileList.tsx +++ b/src/view/screens/ProfileList.tsx @@ -23,7 +23,7 @@ import {s} from 'lib/styles' type Props = NativeStackScreenProps<CommonNavigatorParams, 'ProfileList'> export const ProfileListScreen = withAuthRequired( - observer(({route}: Props) => { + observer(function ProfileListScreenImpl({route}: Props) { const store = useStores() const navigation = useNavigation<NavigationProp>() const {isTabletOrDesktop} = useWebMediaQueries() diff --git a/src/view/screens/SavedFeeds.tsx b/src/view/screens/SavedFeeds.tsx index dc9c253cb..d5c02ba63 100644 --- a/src/view/screens/SavedFeeds.tsx +++ b/src/view/screens/SavedFeeds.tsx @@ -35,7 +35,7 @@ import {Link, TextLink} from 'view/com/util/Link' type Props = NativeStackScreenProps<CommonNavigatorParams, 'SavedFeeds'> export const SavedFeeds = withAuthRequired( - observer(({}: Props) => { + observer(function SavedFeedsImpl({}: Props) { const pal = usePalette('default') const store = useStores() const {isMobile, isTabletOrDesktop} = useWebMediaQueries() @@ -151,96 +151,98 @@ export const SavedFeeds = withAuthRequired( }), ) -const ListItem = observer( - ({item, drag}: {item: CustomFeedModel; drag: () => void}) => { - const pal = usePalette('default') - const store = useStores() - const savedFeeds = useMemo(() => store.me.savedFeeds, [store]) - const isPinned = savedFeeds.isPinned(item) +const ListItem = observer(function ListItemImpl({ + item, + drag, +}: { + item: CustomFeedModel + drag: () => void +}) { + const pal = usePalette('default') + const store = useStores() + const savedFeeds = useMemo(() => store.me.savedFeeds, [store]) + const isPinned = savedFeeds.isPinned(item) - const onTogglePinned = useCallback(() => { - Haptics.default() - savedFeeds.togglePinnedFeed(item).catch(e => { + const onTogglePinned = useCallback(() => { + Haptics.default() + savedFeeds.togglePinnedFeed(item).catch(e => { + Toast.show('There was an issue contacting the server') + store.log.error('Failed to toggle pinned feed', {e}) + }) + }, [savedFeeds, item, store]) + const onPressUp = useCallback( + () => + savedFeeds.movePinnedFeed(item, 'up').catch(e => { Toast.show('There was an issue contacting the server') - store.log.error('Failed to toggle pinned feed', {e}) - }) - }, [savedFeeds, item, store]) - const onPressUp = useCallback( - () => - savedFeeds.movePinnedFeed(item, 'up').catch(e => { - Toast.show('There was an issue contacting the server') - store.log.error('Failed to set pinned feed order', {e}) - }), - [store, savedFeeds, item], - ) - const onPressDown = useCallback( - () => - savedFeeds.movePinnedFeed(item, 'down').catch(e => { - Toast.show('There was an issue contacting the server') - store.log.error('Failed to set pinned feed order', {e}) - }), - [store, savedFeeds, item], - ) + store.log.error('Failed to set pinned feed order', {e}) + }), + [store, savedFeeds, item], + ) + const onPressDown = useCallback( + () => + savedFeeds.movePinnedFeed(item, 'down').catch(e => { + Toast.show('There was an issue contacting the server') + store.log.error('Failed to set pinned feed order', {e}) + }), + [store, savedFeeds, item], + ) - return ( - <ScaleDecorator> - <ShadowDecorator> - <Pressable + return ( + <ScaleDecorator> + <ShadowDecorator> + <Pressable + accessibilityRole="button" + onLongPress={isPinned ? drag : undefined} + delayLongPress={200} + style={[styles.itemContainer, pal.border]}> + {isPinned && isWeb ? ( + <View style={styles.webArrowButtonsContainer}> + <TouchableOpacity accessibilityRole="button" onPress={onPressUp}> + <FontAwesomeIcon + icon="arrow-up" + size={12} + style={[pal.text, styles.webArrowUpButton]} + /> + </TouchableOpacity> + <TouchableOpacity + accessibilityRole="button" + onPress={onPressDown}> + <FontAwesomeIcon + icon="arrow-down" + size={12} + style={[pal.text]} + /> + </TouchableOpacity> + </View> + ) : isPinned ? ( + <FontAwesomeIcon + icon="bars" + size={20} + color={pal.colors.text} + style={s.ml20} + /> + ) : null} + <CustomFeed + key={item.data.uri} + item={item} + showSaveBtn + style={styles.noBorder} + /> + <TouchableOpacity accessibilityRole="button" - onLongPress={isPinned ? drag : undefined} - delayLongPress={200} - style={[styles.itemContainer, pal.border]}> - {isPinned && isWeb ? ( - <View style={styles.webArrowButtonsContainer}> - <TouchableOpacity - accessibilityRole="button" - onPress={onPressUp}> - <FontAwesomeIcon - icon="arrow-up" - size={12} - style={[pal.text, styles.webArrowUpButton]} - /> - </TouchableOpacity> - <TouchableOpacity - accessibilityRole="button" - onPress={onPressDown}> - <FontAwesomeIcon - icon="arrow-down" - size={12} - style={[pal.text]} - /> - </TouchableOpacity> - </View> - ) : isPinned ? ( - <FontAwesomeIcon - icon="bars" - size={20} - color={pal.colors.text} - style={s.ml20} - /> - ) : null} - <CustomFeed - key={item.data.uri} - item={item} - showSaveBtn - style={styles.noBorder} + hitSlop={10} + onPress={onTogglePinned}> + <FontAwesomeIcon + icon="thumb-tack" + size={20} + color={isPinned ? colors.blue3 : pal.colors.icon} /> - <TouchableOpacity - accessibilityRole="button" - hitSlop={10} - onPress={onTogglePinned}> - <FontAwesomeIcon - icon="thumb-tack" - size={20} - color={isPinned ? colors.blue3 : pal.colors.icon} - /> - </TouchableOpacity> - </Pressable> - </ShadowDecorator> - </ScaleDecorator> - ) - }, -) + </TouchableOpacity> + </Pressable> + </ShadowDecorator> + </ScaleDecorator> + ) +}) const styles = StyleSheet.create({ desktopContainer: { diff --git a/src/view/screens/Search.web.tsx b/src/view/screens/Search.web.tsx index f325b1233..2d0c0288a 100644 --- a/src/view/screens/Search.web.tsx +++ b/src/view/screens/Search.web.tsx @@ -18,7 +18,7 @@ import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' type Props = NativeStackScreenProps<SearchTabNavigatorParams, 'Search'> export const SearchScreen = withAuthRequired( - observer(({navigation, route}: Props) => { + observer(function SearchScreenImpl({navigation, route}: Props) { const store = useStores() const params = route.params || {} const foafs = React.useMemo<FoafsModel>( diff --git a/src/view/screens/SearchMobile.tsx b/src/view/screens/SearchMobile.tsx index 6ad468fa9..b545a643d 100644 --- a/src/view/screens/SearchMobile.tsx +++ b/src/view/screens/SearchMobile.tsx @@ -30,7 +30,7 @@ import {isAndroid, isIOS} from 'platform/detection' type Props = NativeStackScreenProps<SearchTabNavigatorParams, 'Search'> export const SearchScreen = withAuthRequired( - observer<Props>(({}: Props) => { + observer<Props>(function SearchScreenImpl({}: Props) { const pal = usePalette('default') const store = useStores() const scrollViewRef = React.useRef<ScrollView>(null) |