react-native hook useStatusBarHeight

useStatusBarHeight.ts

import { useEffect, useState } from "react";
import { NativeModules, StatusBarIOS } from "react-native";

export function useStatusBarHeight() {
  const [height, setHeight] = useState(0)

  useEffect(() => {
    NativeModules.StatusBarManager.getHeight((frame: any) => setHeight(frame.height))
    const changeListener = StatusBarIOS.addListener('statusBarFrameWillChange', (data: any) => {
      setHeight(data.frame.height)
    })

    return () => changeListener.remove()
  }, [])

  return height
}