Upgrade Example to RN 0.64 (#83)

* ReactLogger: Also log function

* Run SwiftFormat & SwiftLint in example project

* Upgrade to RN 0.64 1/2

* Update lockfiles

* Upgrade a few packages

* index.tsx -> index.js

* Upgrade docusaurus

* Fix line length violation

* Update CameraView.swift

* Update gradle plugin

* Fix example to prefer higher res cameras

* Remove unused log line

* Update App.tsx

src/hooks/useCameraFormat.ts

@@ -17,7 +17,17 @@ export function useCameraFormat(device?: CameraDevice, cameraViewSize?: Size): C
   const formats = useMemo(() => {
     if (device?.formats == null) return [];
     const filtered = filterFormatsByAspectRatio(device.formats, cameraViewSize);
-    return filtered.sort(sortFormatsByResolution);
+
+    const sorted = filtered.sort(sortFormatsByResolution);
+    const bestFormat = sorted[0];
+    if (bestFormat == null) return [];
+    const bestFormatResolution = bestFormat.photoHeight * bestFormat.photoWidth;
+    return sorted.filter((f) => {
+      // difference in resolution in percent (e.g. 100x100 is 0.5 of 200x200)
+      const resolutionDiff = (bestFormatResolution - f.photoHeight * f.photoWidth) / bestFormatResolution;
+      // formats that are less than 25% of the bestFormat's resolution are dropped. They are too much quality loss
+      return resolutionDiff <= 0.25;
+    });
   }, [device?.formats, cameraViewSize]);
 
   return formats[0];

src/utils/FormatFilter.ts

@@ -24,8 +24,8 @@ export const sortDevices = (left: CameraDevice, right: CameraDevice): number =>
   if (leftHasWideAngle) leftPoints += 5;
   if (rightHasWideAngle) rightPoints += 5;
 
-  if (left.devices.length > right.devices.length) leftPoints += 2;
-  if (right.devices.length > left.devices.length) rightPoints += 2;
+  if (left.devices.length > right.devices.length) leftPoints += 3;
+  if (right.devices.length > left.devices.length) rightPoints += 3;
 
   return rightPoints - leftPoints;
 };
@@ -96,7 +96,12 @@ export const filterFormatsByAspectRatio = (formats: CameraDeviceFormat[], viewSi
     else return prev;
   }, Number.MAX_SAFE_INTEGER);
 
-  return formats.filter((f) => getFormatAspectRatioOverflow(f, viewSize) === minOverflow);
+  return formats.filter((f) => {
+    // percentage of difference in overflow from this format, to the minimum available overflow
+    const overflowDiff = (getFormatAspectRatioOverflow(f, viewSize) - minOverflow) / minOverflow;
+    // we have an acceptance of 25%, if overflow is more than 25% off to the min available overflow, we drop it
+    return overflowDiff < 0.25;
+  });
 };
 
 /**