From 35f126b128f76e35ab3a67c54558d0cb07f93c3e Mon Sep 17 00:00:00 2001
From: Developer <info@procivis.ch>
Date: Thu, 15 Aug 2024 13:43:59 +0200
Subject: [PATCH] ONE-3155: remove camera permission request from camera
 screens

---
 package.json                                  |  2 +-
 src/camera/qr-code-scanner.tsx                | 23 ++++---------------
 .../qr-code-scanner-screen.stories.tsx        | 12 ++++++++--
 src/screens/qr-code-scanner-screen.tsx        | 17 ++++----------
 4 files changed, 21 insertions(+), 33 deletions(-)

diff --git a/package.json b/package.json
index 6f00e92..85e55c8 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@procivis/one-react-native-components",
-  "version": "0.1.27",
+  "version": "0.1.28",
   "description": "Common Procivis ONE UI components for react-native",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
diff --git a/src/camera/qr-code-scanner.tsx b/src/camera/qr-code-scanner.tsx
index 87d24f3..e27d4b9 100644
--- a/src/camera/qr-code-scanner.tsx
+++ b/src/camera/qr-code-scanner.tsx
@@ -1,20 +1,13 @@
 import React, { FunctionComponent, useMemo } from 'react';
 import { StyleSheet, View, ViewProps } from 'react-native';
-import {
-  Camera,
-  Code,
-  CodeType,
-  useCameraDevice,
-  useCameraPermission,
-  useCodeScanner,
-} from 'react-native-vision-camera';
+import { Camera, Code, CodeType, useCameraDevice, useCodeScanner } from 'react-native-vision-camera';
 
 import CameraOverlay from './camera-overlay';
 
 export type QRCodeScannerProps = ViewProps & {
   cameraOverlay?: React.ComponentType<any> | React.ReactElement;
   codeTypes?: CodeType[];
-  notAuthorizedView?: JSX.Element;
+  noCameraView?: JSX.Element;
   onQRCodeRead: (code: Code[]) => void;
 };
 
@@ -22,15 +15,9 @@ const QRCodeScanner: FunctionComponent<QRCodeScannerProps> = ({
   cameraOverlay,
   codeTypes = ['qr'],
   onQRCodeRead,
-  notAuthorizedView,
+  noCameraView = null,
   ...viewProps
 }) => {
-  const { hasPermission, requestPermission } = useCameraPermission();
-
-  if (!hasPermission) {
-    requestPermission();
-  }
-
   const qrCodeScanner = useCodeScanner({
     codeTypes,
     onCodeScanned: onQRCodeRead,
@@ -50,8 +37,8 @@ const QRCodeScanner: FunctionComponent<QRCodeScannerProps> = ({
     }
   }, [cameraOverlay]);
 
-  if (!hasPermission || !device) {
-    return notAuthorizedView ?? null;
+  if (!device) {
+    return noCameraView;
   }
 
   return (
diff --git a/src/screens/qr-code-scanner-screen.stories.tsx b/src/screens/qr-code-scanner-screen.stories.tsx
index dc87f59..ee688d9 100644
--- a/src/screens/qr-code-scanner-screen.stories.tsx
+++ b/src/screens/qr-code-scanner-screen.stories.tsx
@@ -1,9 +1,17 @@
 import type { ComponentMeta, ComponentStory } from '@storybook/react';
-import React from 'react';
+import React, { useEffect } from 'react';
+import { useCameraPermission } from 'react-native-vision-camera';
 
 import QRCodeScannerScreen from './qr-code-scanner-screen';
 
 const Basic: ComponentStory<typeof QRCodeScannerScreen> = (args) => {
+  const { hasPermission, requestPermission } = useCameraPermission();
+  useEffect(() => {
+    if (!hasPermission) {
+      requestPermission();
+    }
+  }, [hasPermission, requestPermission]);
+
   return <QRCodeScannerScreen {...args} />;
 };
 
@@ -24,6 +32,6 @@ export default {
     },
   },
   argTypes: {
-    onBarCodeRead: { action: 'onBarCodeRead' },
+    onQRCodeRead: { action: 'onQRCodeRead' },
   },
 } as ComponentMeta<typeof QRCodeScannerScreen>;
diff --git a/src/screens/qr-code-scanner-screen.tsx b/src/screens/qr-code-scanner-screen.tsx
index ac7462d..400b735 100644
--- a/src/screens/qr-code-scanner-screen.tsx
+++ b/src/screens/qr-code-scanner-screen.tsx
@@ -1,7 +1,7 @@
 import React, { FunctionComponent, memo, ReactElement } from 'react';
 import { StyleSheet, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
-import { useCameraDevice, useCameraPermission } from 'react-native-vision-camera';
+import { useCameraDevice } from 'react-native-vision-camera';
 
 import { useAccessibilityTranslation } from '../accessibility/accessibilityLanguage';
 import BlurView from '../blur/blur-view';
@@ -17,14 +17,14 @@ export interface QRCodeScannerScreenProps {
   codeTypes?: QRCodeScannerProps['codeTypes'];
   onQRCodeRead: QRCodeScannerProps['onQRCodeRead'];
   onClose: () => void;
-  notAuthorizedView?: JSX.Element;
+  noCameraView?: JSX.Element;
   title: ReactElement | string;
 }
 
 const QRCodeScannerScreen: FunctionComponent<QRCodeScannerScreenProps> = ({
   codeTypes,
   onQRCodeRead,
-  notAuthorizedView,
+  noCameraView = null,
   onClose,
   title,
 }) => {
@@ -32,16 +32,9 @@ const QRCodeScannerScreen: FunctionComponent<QRCodeScannerScreenProps> = ({
   const insets = useSafeAreaInsets();
   const colorScheme = useAppColorScheme();
 
-  const { hasPermission, requestPermission } = useCameraPermission();
-
-  if (!hasPermission) {
-    requestPermission();
-  }
-
   const device = useCameraDevice('back');
-
-  if (!hasPermission || !device) {
-    return notAuthorizedView ?? null;
+  if (!device) {
+    return noCameraView;
   }
 
   return (