diff options
Diffstat (limited to 'src/view/screens/Home.tsx')
-rw-r--r-- | src/view/screens/Home.tsx | 30 |
1 files changed, 8 insertions, 22 deletions
diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx index 4f1ebe039..795d813d1 100644 --- a/src/view/screens/Home.tsx +++ b/src/view/screens/Home.tsx @@ -19,14 +19,11 @@ import {useStores} from 'state/index' import {s} from 'lib/styles' import {useOnMainScroll} from 'lib/hooks/useOnMainScroll' import {useAnalytics} from 'lib/analytics/analytics' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import {ComposeIcon2} from 'lib/icons' -import {isDesktopWeb, isMobileWebMediaQuery, isWeb} from 'platform/detection' const HEADER_OFFSET_MOBILE = 78 const HEADER_OFFSET_DESKTOP = 50 -const HEADER_OFFSET = isDesktopWeb - ? HEADER_OFFSET_DESKTOP - : HEADER_OFFSET_MOBILE const POLL_FREQ = 30e3 // 30sec type Props = NativeStackScreenProps<HomeTabNavigatorParams, 'Home'> @@ -158,10 +155,13 @@ const FeedPage = observer( renderEmptyState?: () => JSX.Element }) => { const store = useStores() + const {isMobile} = useWebMediaQueries() const [onMainScroll, isScrolledDown, resetMainScroll] = useOnMainScroll(store) const {screen, track} = useAnalytics() - const [headerOffset, setHeaderOffset] = React.useState(HEADER_OFFSET) + const [headerOffset, setHeaderOffset] = React.useState( + isMobile ? HEADER_OFFSET_MOBILE : HEADER_OFFSET_DESKTOP, + ) const scrollElRef = React.useRef<FlatList>(null) const {appState} = useAppState({ onForeground: () => doPoll(true), @@ -206,15 +206,9 @@ const FeedPage = observer( }, [isPageFocused, scrollToTop, feed]) // listens for resize events - const listenForResize = React.useCallback(() => { - // @ts-ignore we know window exists -prf - const isMobileWeb = global.window.matchMedia( - isMobileWebMediaQuery, - )?.matches - setHeaderOffset( - isMobileWeb ? HEADER_OFFSET_MOBILE : HEADER_OFFSET_DESKTOP, - ) - }, []) + React.useEffect(() => { + setHeaderOffset(isMobile ? HEADER_OFFSET_MOBILE : HEADER_OFFSET_DESKTOP) + }, [isMobile]) // fires when page within screen is activated/deactivated // - check for latest @@ -234,17 +228,10 @@ const FeedPage = observer( feed.update() } - if (isWeb) { - window.addEventListener('resize', listenForResize) - } - return () => { clearInterval(pollInterval) softResetSub.remove() feedCleanup() - if (isWeb) { - isWeb && window.removeEventListener('resize', listenForResize) - } } }, [ store, @@ -254,7 +241,6 @@ const FeedPage = observer( feed, isPageFocused, isScreenFocused, - listenForResize, ]) const onPressCompose = React.useCallback(() => { |