Hide footer on scroll down (minimal shell mode)

src/view/screens/Home.tsx

@@ -9,6 +9,7 @@ import {useStores} from '../../state'
 import {FeedModel} from '../../state/models/feed-view'
 import {ScreenParams} from '../routes'
 import {s, colors} from '../lib/styles'
+import {useOnMainScroll} from '../lib/useOnMainScroll'
 
 const HITSLOP = {left: 20, top: 20, right: 20, bottom: 20}
 
@@ -18,6 +19,7 @@ export const Home = observer(function Home({
   scrollElRef,
 }: ScreenParams) {
   const store = useStores()
+  const onMainScroll = useOnMainScroll(store)
   const [hasSetup, setHasSetup] = useState<boolean>(false)
   const {appState} = useAppState({
     onForeground: () => doPoll(true),
@@ -95,6 +97,7 @@ export const Home = observer(function Home({
         style={{flex: 1}}
         onPressCompose={onPressCompose}
         onPressTryAgain={onPressTryAgain}
+        onScroll={onMainScroll}
       />
       {defaultFeedView.hasNewLatest ? (
         <TouchableOpacity

src/view/screens/Notifications.tsx

@@ -5,9 +5,11 @@ import {Feed} from '../com/notifications/Feed'
 import {useStores} from '../../state'
 import {NotificationsViewModel} from '../../state/models/notifications-view'
 import {ScreenParams} from '../routes'
+import {useOnMainScroll} from '../lib/useOnMainScroll'
 
 export const Notifications = ({navIdx, visible}: ScreenParams) => {
   const store = useStores()
+  const onMainScroll = useOnMainScroll(store)
 
   useEffect(() => {
     if (!visible) {
@@ -33,7 +35,11 @@ export const Notifications = ({navIdx, visible}: ScreenParams) => {
   return (
     <View style={{flex: 1}}>
       <ViewHeader title="Notifications" />
-      <Feed view={store.me.notifications} onPressTryAgain={onPressTryAgain} />
+      <Feed
+        view={store.me.notifications}
+        onPressTryAgain={onPressTryAgain}
+        onScroll={onMainScroll}
+      />
     </View>
   )
 }

src/view/screens/PostDownvotedBy.tsx

@@ -14,6 +14,7 @@ export const PostDownvotedBy = ({navIdx, visible, params}: ScreenParams) => {
   useEffect(() => {
     if (visible) {
       store.nav.setTitle(navIdx, 'Downvoted by')
+      store.shell.setMinimalShellMode(false)
     }
   }, [store, visible])
 

src/view/screens/PostRepostedBy.tsx

@@ -14,6 +14,7 @@ export const PostRepostedBy = ({navIdx, visible, params}: ScreenParams) => {
   useEffect(() => {
     if (visible) {
       store.nav.setTitle(navIdx, 'Reposted by')
+      store.shell.setMinimalShellMode(false)
     }
   }, [store, visible])
 

src/view/screens/PostThread.tsx

@@ -29,6 +29,7 @@ export const PostThread = ({navIdx, visible, params}: ScreenParams) => {
       return
     }
     setTitle()
+    store.shell.setMinimalShellMode(false)
     if (!view.hasLoaded && !view.isLoading) {
       console.log('Fetching post thread', uri)
       view.setup().then(

src/view/screens/Profile.tsx

@@ -18,6 +18,7 @@ import {EmptyState} from '../com/util/EmptyState'
 import {ViewHeader} from '../com/util/ViewHeader'
 import * as Toast from '../com/util/Toast'
 import {s, colors} from '../lib/styles'
+import {useOnMainScroll} from '../lib/useOnMainScroll'
 
 const LOADING_ITEM = {_reactKey: '__loading__'}
 const END_ITEM = {_reactKey: '__end__'}
@@ -25,6 +26,7 @@ const EMPTY_ITEM = {_reactKey: '__empty__'}
 
 export const Profile = observer(({navIdx, visible, params}: ScreenParams) => {
   const store = useStores()
+  const onMainScroll = useOnMainScroll(store)
   const [hasSetup, setHasSetup] = useState<boolean>(false)
   const uiState = useMemo(
     () => new ProfileUiModel(store, {user: params.name}),
@@ -252,6 +254,7 @@ export const Profile = observer(({navIdx, visible, params}: ScreenParams) => {
           ListFooterComponent={Footer}
           refreshing={uiState.isRefreshing || false}
           onSelectView={onSelectView}
+          onScroll={onMainScroll}
           onRefresh={onRefresh}
           onEndReached={onEndReached}
         />

src/view/screens/ProfileFollowers.tsx

@@ -12,6 +12,7 @@ export const ProfileFollowers = ({navIdx, visible, params}: ScreenParams) => {
   useEffect(() => {
     if (visible) {
       store.nav.setTitle(navIdx, `Followers of ${name}`)
+      store.shell.setMinimalShellMode(false)
     }
   }, [store, visible, name])
 

src/view/screens/ProfileFollows.tsx

@@ -12,6 +12,7 @@ export const ProfileFollows = ({navIdx, visible, params}: ScreenParams) => {
   useEffect(() => {
     if (visible) {
       store.nav.setTitle(navIdx, `Followed by ${name}`)
+      store.shell.setMinimalShellMode(false)
     }
   }, [store, visible, name])
 

src/view/screens/ProfileMembers.tsx

@@ -12,6 +12,7 @@ export const ProfileMembers = ({navIdx, visible, params}: ScreenParams) => {
   useEffect(() => {
     if (visible) {
       store.nav.setTitle(navIdx, `Members of ${name}`)
+      store.shell.setMinimalShellMode(false)
     }
   }, [store, visible, name])
 

src/view/screens/Search.tsx

@@ -29,6 +29,7 @@ export const Search = ({navIdx, visible, params}: ScreenParams) => {
 
   useEffect(() => {
     if (visible) {
+      store.shell.setMinimalShellMode(false)
       autocompleteView.setup()
       textInput.current?.focus()
       store.nav.setTitle(navIdx, `Search`)

src/view/screens/Settings.tsx

@@ -18,6 +18,7 @@ export const Settings = observer(function Settings({
     if (!visible) {
       return
     }
+    store.shell.setMinimalShellMode(false)
     store.nav.setTitle(navIdx, 'Settings')
   }, [visible, store])