/** * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. * * @format * @flow strict-local */ import Dimensions from './Dimensions'; import { type DisplayMetrics, type DisplayMetricsAndroid, } from './NativeDeviceInfo'; import {useEffect, useState} from 'react'; export default function useWindowDimensions(): | DisplayMetrics | DisplayMetricsAndroid { const [dimensions, setDimensions] = useState(() => Dimensions.get('window')); useEffect(() => { function handleChange({window}) { if ( dimensions.width !== window.width || dimensions.height !== window.height || dimensions.scale !== window.scale || dimensions.fontScale !== window.fontScale ) { setDimensions(window); } } const subscription = Dimensions.addEventListener('change', handleChange); // We might have missed an update between calling `get` in render and // `addEventListener` in this handler, so we set it here. If there was // no change, React will filter out this update as a no-op. handleChange({window: Dimensions.get('window')}); return () => { subscription.remove(); }; }, [dimensions]); return dimensions; }