rn-custom-style-sheet/lib/module/MediaQuery/Hooks/UseDevice/UseDevice.js

React Native component to select a specific value from a range of values.

import { useEffect, useState } from 'react';
import { useCurrentOrientation, useDeepCompareEffect } from '../../../Core';
import { useDeviceForMediaQuery } from '../UseDeviceForMediaQuery';
import { useIsUpdate } from '../UseIsUpdate';
import { getDevice, shallowEqualObjects } from './UseDeviceUtils';
export default function useDevice(deviceFromProps) {
  const deviceFromContext = useDeviceForMediaQuery();
  const isSupportedOrientation = useCurrentOrientation();
  const [device, setDevice] = useState(getDevice(deviceFromProps, deviceFromContext));
  const isUpdate = useIsUpdate();
  useDeepCompareEffect(() => {
    if (isUpdate) {
      const newDevice = getDevice(deviceFromProps, deviceFromContext);
      if (!shallowEqualObjects(device, newDevice)) {
        setDevice(newDevice);
      }
    }
  }, [deviceFromProps, deviceFromContext]);
  useEffect(() => {
    const newDevice = getDevice(deviceFromProps, deviceFromContext);
    if (!shallowEqualObjects(device, newDevice)) {
      setDevice(newDevice);
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [isSupportedOrientation]);
  return device;
}
//# sourceMappingURL=UseDevice.js.map