Hide footer on scroll down (minimal shell mode)

src/view/com/notifications/Feed.tsx

@@ -6,15 +6,18 @@ import {FeedItem} from './FeedItem'
 import {NotificationFeedLoadingPlaceholder} from '../util/LoadingPlaceholder'
 import {ErrorMessage} from '../util/ErrorMessage'
 import {EmptyState} from '../util/EmptyState'
+import {OnScrollCb} from '../../lib/useOnMainScroll'
 
 const EMPTY_FEED_ITEM = {_reactKey: '__empty__'}
 
 export const Feed = observer(function Feed({
   view,
   onPressTryAgain,
+  onScroll,
 }: {
   view: NotificationsViewModel
   onPressTryAgain?: () => void
+  onScroll?: OnScrollCb
 }) {
   // TODO optimize renderItem or FeedItem, we're getting this notice from RN: -prf
   //   VirtualizedList: You have a large list that is slow to update - make sure your
@@ -65,6 +68,7 @@ export const Feed = observer(function Feed({
           refreshing={view.isRefreshing}
           onRefresh={onRefresh}
           onEndReached={onEndReached}
+          onScroll={onScroll}
         />
       )}
     </View>

src/view/com/posts/Feed.tsx

@@ -13,6 +13,7 @@ import {ErrorMessage} from '../util/ErrorMessage'
 import {FeedModel} from '../../../state/models/feed-view'
 import {FeedItem} from './FeedItem'
 import {ComposePrompt} from '../composer/Prompt'
+import {OnScrollCb} from '../../lib/useOnMainScroll'
 
 const COMPOSE_PROMPT_ITEM = {_reactKey: '__prompt__'}
 const EMPTY_FEED_ITEM = {_reactKey: '__empty__'}
@@ -23,12 +24,14 @@ export const Feed = observer(function Feed({
   scrollElRef,
   onPressCompose,
   onPressTryAgain,
+  onScroll,
 }: {
   feed: FeedModel
   style?: StyleProp<ViewStyle>
   scrollElRef?: MutableRefObject<FlatList<any> | null>
   onPressCompose: () => void
   onPressTryAgain?: () => void
+  onScroll?: OnScrollCb
 }) {
   // TODO optimize renderItem or FeedItem, we're getting this notice from RN: -prf
   //   VirtualizedList: You have a large list that is slow to update - make sure your
@@ -92,6 +95,7 @@ export const Feed = observer(function Feed({
           ListFooterComponent={FeedFooter}
           refreshing={feed.isRefreshing}
           contentContainerStyle={{paddingBottom: 100}}
+          onScroll={onScroll}
           onRefresh={onRefresh}
           onEndReached={onEndReached}
         />

src/view/com/util/ViewSelector.tsx

@@ -1,8 +1,14 @@
 import React, {useEffect, useState} from 'react'
-import {FlatList, View} from 'react-native'
+import {
+  FlatList,
+  NativeSyntheticEvent,
+  NativeScrollEvent,
+  View,
+} from 'react-native'
 import {Selector} from './Selector'
 import {HorzSwipe} from './gestures/HorzSwipe'
 import {useAnimatedValue} from '../../lib/useAnimatedValue'
+import {OnScrollCb} from '../../lib/useOnMainScroll'
 
 const HEADER_ITEM = {_reactKey: '__header__'}
 const SELECTOR_ITEM = {_reactKey: '__selector__'}
@@ -17,6 +23,7 @@ export function ViewSelector({
   renderItem,
   ListFooterComponent,
   onSelectView,
+  onScroll,
   onRefresh,
   onEndReached,
 }: {
@@ -32,6 +39,7 @@ export function ViewSelector({
     | null
     | undefined
   onSelectView?: (viewIndex: number) => void
+  onScroll?: OnScrollCb
   onRefresh?: () => void
   onEndReached?: (info: {distanceFromEnd: number}) => void
 }) {
@@ -90,6 +98,7 @@ export function ViewSelector({
         ListFooterComponent={ListFooterComponent}
         stickyHeaderIndices={STICKY_HEADER_INDICES}
         refreshing={refreshing}
+        onScroll={onScroll}
         onRefresh={onRefresh}
         onEndReached={onEndReached}
       />