Added console.log to troubelshoot handlePayload to return type to scannedDataBox, Pending fix for data not displayed on history page

screens/HistoryScreen.tsx

@@ -1,5 +1,5 @@
-import React, { useContext, useState } from 'react';
-import { View, Text, StyleSheet, FlatList, TouchableOpacity, Image, Modal } from 'react-native';
+import React, { useContext, useState, useEffect } from 'react';
+import { View, Text, StyleSheet, FlatList, TouchableOpacity, Image, BackHandler, Modal } from 'react-native';
 import { QRCodeContext, QRCode } from '../types'; // Import QRCode type
 import ScannedDataBox from '../components/ScannedDataBox';
 import { Ionicons } from '@expo/vector-icons';
@@ -16,6 +16,24 @@ const HistoryScreen: React.FC = () => {
   const [isModalVisible, setIsModalVisible] = useState<boolean>(false);
   const [indexToDelete, setIndexToDelete] = useState<number | null>(null);
 
+  useEffect(() => {
+    const backAction = () => {
+      if (selectedData) {
+        setSelectedData(null);
+        setSelectedScanResult(null);
+        return true;
+      }
+      return false;
+    };
+
+    const backHandler = BackHandler.addEventListener(
+      'hardwareBackPress',
+      backAction
+    );
+
+    return () => backHandler.remove();
+  }, [selectedData]);
+
   const toggleBookmark = (index: number) => {
     setQrCodes((prev: QRCode[]) => {
       const originalIndex = prev.length - 1 - index; // Compute the original index