Q:

react-native-device-detection not working with Nexus 7

I had created an imageGallery application built over React-Native.
The basic requirement is 

Mobile View shows 3 images per row. 
Tablet View shows 5 images per row.

Device detection is done using react-native-device-detection
The number of images per row is limited using Dimensions object.
const Device = require('react-native-device-detection');
 if(Device.isTablet) {
 Object.assign(styles, {
  image: {
    width: Dimensions.get('window').width / 5 - 10 ,
    height: Dimensions.get('window').width / 5 - 10,
  }
 });
}
if(Device.isPhone) {
 Object.assign(styles, {
  image: {
    width: Dimensions.get('window').width / 3 - 10 ,
    height: Dimensions.get('window').width / 3 - 10,
  }
 });
}

This works fine in mobile and also in the simulator (Nexus 7). 
Checked with https://material.io/devices/. Nexus 7 comes under Tablet.
Nexus 7 Emulator Screenshot

Nexus 7 Device Screenshot

But in the device (Nexus 7) it shows 3 images per row.(Mobile behavior). 
How can this be fixed?

A:

Nexus 7 is actually a mini tablet as per manufacturer. react-native-device-detection identifies the device on the basis of their height/width and pixelDensity like this.
  isPhoneOrTablet() {
    if(this.pixelDensity < 2 && (this.adjustedWidth >= 1000 || this.adjustedHeight >= 1000)) {
      this.isTablet = true;
      this.isPhone = false;
    } else if(this.pixelDensity === 2 && (this.adjustedWidth >= 1920 || this.adjustedHeight >= 1920)) {
      this.isTablet = true;
      this.isPhone = false;
    } else {
      this.isTablet = false;
      this.isPhone = true;
    }
  }

There is a chance for wrong info if the device has unorthodox sizes, you can add your own custom calculations to make it more accurate.

