src/components/hooks/useHeaderOffset.ts


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

import {useWindowDimensions} from 'react-native'

import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'

export function useHeaderOffset() {
  const {isDesktop, isTablet} = useWebMediaQueries()
  const {fontScale} = useWindowDimensions()
  if (isDesktop || isTablet) {
    return 0
  }
  const navBarHeight = 52
  const tabBarPad = 10 + 10 + 3 // padding + border
  const normalLineHeight = 20 // matches tab bar
  const tabBarText = normalLineHeight * fontScale
  return navBarHeight + tabBarPad + tabBarText - 4 // for some reason, this calculation is wrong by 4 pixels, which we adjust
}