Fixed ClearScanData not being called when closing ScannedData Modal

App.tsx

@@ -26,6 +26,7 @@ const App: React.FC = () => {
 
   const clearScanData = () => {
     setScannedData('');
+    console.log('ClearScanedDATa');
   };
 
   useEffect(() => {

screens/QRScannerScreen.tsx

@@ -11,7 +11,7 @@ import NetInfo from '@react-native-community/netinfo';
 
 const { width: screenWidth, height: screenHeight } = Dimensions.get('window');
 
-const QRScannerScreen: React.FC = () => {
+const QRScannerScreen: React.FC<{ clearScanData: () => void }> = ({ clearScanData }) => {
   // State management
   const [isSettingsModalVisible, setIsSettingsModalVisible] = useState<boolean>(false);
   const [enableTorch, setEnableTorch] = useState<boolean>(false);
@@ -79,6 +79,13 @@ const QRScannerScreen: React.FC = () => {
       setIsScannedDataBoxVisible(false);
     });
   };
+  const clearSelectedQrCodeData = () => {
+    console.log("!!!!!clearSelectedQrCodeData");
+    setQRCodeId(null);
+    hideScannedDataBox();
+    setScanned(false); // Reset the scanned state so the camera can scan again
+    clearScanData(); // Call the clearScanData passed from App.tsx
+  };
   
   // Show an offline banner
   const showBanner = () => {
@@ -176,10 +183,11 @@ const QRScannerScreen: React.FC = () => {
           <Camera
           style={StyleSheet.absoluteFill}
           device={device}
-            isActive={!isSettingsModalVisible} // Disable the camera when settings modal is open
+          isActive={!isSettingsModalVisible && !isScannedDataBoxVisible} // Disable the camera when settings modal or ScannedDataBox is open
           torch={enableTorch ? 'on' : 'off'}
           codeScanner={codeScanner}
         />
+        
         )}
 
         {/* Torch Button */}
@@ -210,24 +218,26 @@ const QRScannerScreen: React.FC = () => {
       </View>
 
       {/* Scanned Data Box as a modal with sliding animation */}
-      <Modal
+<Modal
   transparent={true}
   visible={isScannedDataBoxVisible}
   animationType="none"
-        onRequestClose={hideScannedDataBox}
+  onRequestClose={clearSelectedQrCodeData} // Call clearSelectedQrCodeData when the modal is requested to close
+>
+  <TouchableOpacity 
+    style={styles.modalOverlay} 
+    activeOpacity={1} 
+    onPress={clearSelectedQrCodeData} // Call clearSelectedQrCodeData on press
   >
-        <TouchableOpacity style={styles.modalOverlay} activeOpacity={1} onPress={hideScannedDataBox}>
     <Animated.View style={[styles.modalContainer, { transform: [{ translateY: scannedDataBoxY }] }]}>
       <ScannedDataBox
         qrCodeId={qrCodeId!}
-              clearScanData={() => {
+        clearScanData={clearSelectedQrCodeData} // Close modal and reset the scanned state
-                setScanned(false);
-                hideScannedDataBox();
-              }}
       />
     </Animated.View>
   </TouchableOpacity>
-      </Modal>
+</Modal>
+
 
       {/* Settings Icon */}
       <TouchableOpacity onPress={() => setIsSettingsModalVisible(true)} style={styles.settingsButton}>