React Native measure component size hook

Component.tsx

import { View } from 'react-native';
import { useComponentSize } from './useComponentSize';

const Component = () => {
  const [size, onLayout] = useComponentSize();
  
  return (
    <View onLayout={onLayout} />
   )
}

useComponentSize.ts

import React, { useState, useCallback } from 'react';

export const useComponentSize = (): [
  size: { width: number; height: number } | null,
  onLayout: (event: any) => void
] => {
  const [size, setSize] = useState<{ width: number; height: number } | null>(
    null
  );

  const onLayout = useCallback((event) => {
    const { width, height } = event.nativeEvent.layout;
    setSize({ width, height });
  }, []);

  return [size, onLayout];
};