|  |  |  | @ -1,4 +1,4 @@ | 
			
		
	
		
			
				
					|  |  |  |  | import React from "react"; | 
			
		
	
		
			
				
					|  |  |  |  | import React from 'react'; | 
			
		
	
		
			
				
					|  |  |  |  | import { | 
			
		
	
		
			
				
					|  |  |  |  |   View, | 
			
		
	
		
			
				
					|  |  |  |  |   Text, | 
			
		
	
	
		
			
				
					|  |  |  | @ -6,92 +6,98 @@ import { | 
			
		
	
		
			
				
					|  |  |  |  |   Dimensions, | 
			
		
	
		
			
				
					|  |  |  |  |   ImageBackground, | 
			
		
	
		
			
				
					|  |  |  |  |   StatusBar, | 
			
		
	
		
			
				
					|  |  |  |  | } from "react-native"; | 
			
		
	
		
			
				
					|  |  |  |  | import { useNavigation } from "@react-navigation/native"; | 
			
		
	
		
			
				
					|  |  |  |  | import { BarCodeScanner } from "expo-barcode-scanner"; | 
			
		
	
		
			
				
					|  |  |  |  | import { Entypo } from "@expo/vector-icons"; | 
			
		
	
		
			
				
					|  |  |  |  | import { connect } from "react-redux"; | 
			
		
	
		
			
				
					|  |  |  |  | } from 'react-native'; | 
			
		
	
		
			
				
					|  |  |  |  | import {useNavigation} from '@react-navigation/native'; | 
			
		
	
		
			
				
					|  |  |  |  | import QRCodeScanner from 'react-native-qrcode-scanner'; | 
			
		
	
		
			
				
					|  |  |  |  | import {RNCamera} from 'react-native-camera'; | 
			
		
	
		
			
				
					|  |  |  |  | // import { Entypo } from "@expo/vector-icons";
 | 
			
		
	
		
			
				
					|  |  |  |  | import {connect} from 'react-redux'; | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | //style
 | 
			
		
	
		
			
				
					|  |  |  |  | import tw from "tailwind-rn"; | 
			
		
	
		
			
				
					|  |  |  |  | import Colors from "../../../../constants/Colors"; | 
			
		
	
		
			
				
					|  |  |  |  | import fontSize from "../../../../constants/fontSize"; | 
			
		
	
		
			
				
					|  |  |  |  | import tw from 'tailwind-rn'; | 
			
		
	
		
			
				
					|  |  |  |  | import Colors from '../../../../constants/Colors'; | 
			
		
	
		
			
				
					|  |  |  |  | import fontSize from '../../../../constants/fontSize'; | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | const { width, height } = Dimensions.get("screen"); | 
			
		
	
		
			
				
					|  |  |  |  | const {width, height} = Dimensions.get('window'); | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | //assets
 | 
			
		
	
		
			
				
					|  |  |  |  | import laptopImage from "../../assets/laptop.png"; | 
			
		
	
		
			
				
					|  |  |  |  | import laptopImage from '../../assets/laptop.png'; | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | function Scan({ route, theme, page }) { | 
			
		
	
		
			
				
					|  |  |  |  | function Scan({route, theme, page}) { | 
			
		
	
		
			
				
					|  |  |  |  |   const navigation = useNavigation(); | 
			
		
	
		
			
				
					|  |  |  |  |   const [hasPermission, setHasPermission] = React.useState(null); | 
			
		
	
		
			
				
					|  |  |  |  |   const [scanned, setScanned] = React.useState(false); | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |   React.useEffect(() => { | 
			
		
	
		
			
				
					|  |  |  |  |     (async () => { | 
			
		
	
		
			
				
					|  |  |  |  |       const { status } = await BarCodeScanner.requestPermissionsAsync(); | 
			
		
	
		
			
				
					|  |  |  |  |       setHasPermission(status === "granted"); | 
			
		
	
		
			
				
					|  |  |  |  |       const {status} = await BarCodeScanner.requestPermissionsAsync(); | 
			
		
	
		
			
				
					|  |  |  |  |       setHasPermission(status === 'granted'); | 
			
		
	
		
			
				
					|  |  |  |  |     })(); | 
			
		
	
		
			
				
					|  |  |  |  |   }, []); | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |   const handleBarCodeScanned = ({ type, data }) => { | 
			
		
	
		
			
				
					|  |  |  |  |     if (page === "activation") { | 
			
		
	
		
			
				
					|  |  |  |  |       navigation.replace("Activation", { | 
			
		
	
		
			
				
					|  |  |  |  |         data: data.slice(data.lastIndexOf("/") + 1, data.length), | 
			
		
	
		
			
				
					|  |  |  |  |   const handleBarCodeScanned = data => { | 
			
		
	
		
			
				
					|  |  |  |  |     if (page === 'activation') { | 
			
		
	
		
			
				
					|  |  |  |  |       navigation.replace('Activation', { | 
			
		
	
		
			
				
					|  |  |  |  |         data: data.slice(data.lastIndexOf('/') + 1, data.length), | 
			
		
	
		
			
				
					|  |  |  |  |       }); | 
			
		
	
		
			
				
					|  |  |  |  |     } else { | 
			
		
	
		
			
				
					|  |  |  |  |       navigation.replace("QRContent", { | 
			
		
	
		
			
				
					|  |  |  |  |         data: data.slice(data.lastIndexOf("/") + 1, data.length), | 
			
		
	
		
			
				
					|  |  |  |  |       navigation.replace('QRContent', { | 
			
		
	
		
			
				
					|  |  |  |  |         data: data.slice(data.lastIndexOf('/') + 1, data.length), | 
			
		
	
		
			
				
					|  |  |  |  |       }); | 
			
		
	
		
			
				
					|  |  |  |  |     } | 
			
		
	
		
			
				
					|  |  |  |  |   }; | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |   return ( | 
			
		
	
		
			
				
					|  |  |  |  |     <ImageBackground | 
			
		
	
		
			
				
					|  |  |  |  |       source={laptopImage} | 
			
		
	
		
			
				
					|  |  |  |  |       resizeMode="cover" | 
			
		
	
		
			
				
					|  |  |  |  |       style={[tw("w-full"), { height: height - StatusBar.currentHeight }]} | 
			
		
	
		
			
				
					|  |  |  |  |     > | 
			
		
	
		
			
				
					|  |  |  |  |     <ImageBackground source={laptopImage} resizeMode="cover" style={{flex: 1}}> | 
			
		
	
		
			
				
					|  |  |  |  |       <View | 
			
		
	
		
			
				
					|  |  |  |  |         style={tw( | 
			
		
	
		
			
				
					|  |  |  |  |           "flex-1 flex  justify-evenly items-center  bg-gray-800 bg-opacity-80" | 
			
		
	
		
			
				
					|  |  |  |  |         )} | 
			
		
	
		
			
				
					|  |  |  |  |       > | 
			
		
	
		
			
				
					|  |  |  |  |         <View style={{ width: height / 2.5, height: height / 2.5 }}> | 
			
		
	
		
			
				
					|  |  |  |  |           {hasPermission && !scanned ? ( | 
			
		
	
		
			
				
					|  |  |  |  |             <BarCodeScanner | 
			
		
	
		
			
				
					|  |  |  |  |               onBarCodeScanned={handleBarCodeScanned} | 
			
		
	
		
			
				
					|  |  |  |  |               style={{ width: "100%", height: "100%" }} | 
			
		
	
		
			
				
					|  |  |  |  |           'flex-1 flex justify-evenly items-center  bg-gray-800 bg-opacity-80', | 
			
		
	
		
			
				
					|  |  |  |  |         )}> | 
			
		
	
		
			
				
					|  |  |  |  |         <View style={{width: height / 2.5, height: height / 2.5, overflow: 'hidden'}}> | 
			
		
	
		
			
				
					|  |  |  |  |           <QRCodeScanner | 
			
		
	
		
			
				
					|  |  |  |  |             onRead={e => handleBarCodeScanned(e.data)} | 
			
		
	
		
			
				
					|  |  |  |  |             flashMode={RNCamera.Constants.FlashMode.off} | 
			
		
	
		
			
				
					|  |  |  |  |             topContent={<Text></Text>} | 
			
		
	
		
			
				
					|  |  |  |  |             bottomContent={ | 
			
		
	
		
			
				
					|  |  |  |  |               <TouchableOpacity> | 
			
		
	
		
			
				
					|  |  |  |  |                 <Text></Text> | 
			
		
	
		
			
				
					|  |  |  |  |               </TouchableOpacity> | 
			
		
	
		
			
				
					|  |  |  |  |             } | 
			
		
	
		
			
				
					|  |  |  |  |             containerStyle={{ | 
			
		
	
		
			
				
					|  |  |  |  |               width: '100%', | 
			
		
	
		
			
				
					|  |  |  |  |               height: '100%', | 
			
		
	
		
			
				
					|  |  |  |  |             }} | 
			
		
	
		
			
				
					|  |  |  |  |             cameraContainerStyle={{ | 
			
		
	
		
			
				
					|  |  |  |  |               width: '100%', | 
			
		
	
		
			
				
					|  |  |  |  |               height: '100%', | 
			
		
	
		
			
				
					|  |  |  |  |             }} | 
			
		
	
		
			
				
					|  |  |  |  |           /> | 
			
		
	
		
			
				
					|  |  |  |  |           ) : null} | 
			
		
	
		
			
				
					|  |  |  |  |         </View> | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |         {/* {scanned && ( */} | 
			
		
	
		
			
				
					|  |  |  |  |         <TouchableOpacity | 
			
		
	
		
			
				
					|  |  |  |  |           onPress={() => navigation.goBack()} | 
			
		
	
		
			
				
					|  |  |  |  |           style={[ | 
			
		
	
		
			
				
					|  |  |  |  |             tw("py-2.5 rounded-full flex justify-center flex-row items-center"), | 
			
		
	
		
			
				
					|  |  |  |  |             tw('py-2.5 rounded-full flex justify-center flex-row items-center'), | 
			
		
	
		
			
				
					|  |  |  |  |             { | 
			
		
	
		
			
				
					|  |  |  |  |               width: height / 3.5, | 
			
		
	
		
			
				
					|  |  |  |  |               borderWidth: 1, | 
			
		
	
		
			
				
					|  |  |  |  |               borderColor: Colors.theme1.greenCF, | 
			
		
	
		
			
				
					|  |  |  |  |             }, | 
			
		
	
		
			
				
					|  |  |  |  |           ]} | 
			
		
	
		
			
				
					|  |  |  |  |         > | 
			
		
	
		
			
				
					|  |  |  |  |           <Entypo | 
			
		
	
		
			
				
					|  |  |  |  |           ]}> | 
			
		
	
		
			
				
					|  |  |  |  |           {/* <Entypo | 
			
		
	
		
			
				
					|  |  |  |  |             name="arrow-left" | 
			
		
	
		
			
				
					|  |  |  |  |             size={fontSize.base} | 
			
		
	
		
			
				
					|  |  |  |  |             style={{ marginRight: 5, color: Colors.theme1.greenCF }} | 
			
		
	
		
			
				
					|  |  |  |  |           /> | 
			
		
	
		
			
				
					|  |  |  |  |           /> */} | 
			
		
	
		
			
				
					|  |  |  |  |           <Text | 
			
		
	
		
			
				
					|  |  |  |  |             style={[ | 
			
		
	
		
			
				
					|  |  |  |  |               { | 
			
		
	
		
			
				
					|  |  |  |  |                 color: Colors.theme1.greenCF, | 
			
		
	
		
			
				
					|  |  |  |  |                 fontSize: fontSize.base, | 
			
		
	
		
			
				
					|  |  |  |  |                 fontFamily: "Regular", | 
			
		
	
		
			
				
					|  |  |  |  |                 fontFamily: 'Regular', | 
			
		
	
		
			
				
					|  |  |  |  |               }, | 
			
		
	
		
			
				
					|  |  |  |  |             ]} | 
			
		
	
		
			
				
					|  |  |  |  |           > | 
			
		
	
		
			
				
					|  |  |  |  |             ]}> | 
			
		
	
		
			
				
					|  |  |  |  |             بازگشت | 
			
		
	
		
			
				
					|  |  |  |  |           </Text> | 
			
		
	
		
			
				
					|  |  |  |  |         </TouchableOpacity> | 
			
		
	
	
		
			
				
					|  |  |  | @ -101,7 +107,7 @@ function Scan({ route, theme, page }) { | 
			
		
	
		
			
				
					|  |  |  |  |   ); | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | const mapStateToProps = (state) => ({ | 
			
		
	
		
			
				
					|  |  |  |  | const mapStateToProps = state => ({ | 
			
		
	
		
			
				
					|  |  |  |  |   theme: state.publicApi.theme, | 
			
		
	
		
			
				
					|  |  |  |  | }); | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
	
		
			
				
					|  |  |  | 
 |