feat(intial auth): intial auth setup for the scanner

lstMobile/src/components/LSTScanner.tsx

@@ -1,24 +1,51 @@
-import React from 'react'
-import { View, Text } from 'react-native'
+import { useCallback, useEffect } from "react";
+import { Text, View } from "react-native";
+
+import { zebraScanner } from "../lib/ZebraScanner";
 
 export default function LSTScanner() {
-  return (
-     <View><View style={{ alignItems: "center", margin: 10 }}>
-                         <Text style={{ fontSize: 20, fontWeight: "600" }}>LST Scanner</Text>
-                     </View>
-                     <View
-                         style={{
-                             marginTop: 50,
-                             alignItems: "center",
-                         }}
-                     >
-                         <Text>Relocate</Text>
-                         <Text>0 / 4</Text>
-                     </View>
-         
-                     {/* <View>
+	const handleScan = useCallback(async (scan: any) => {
+		console.log(scan);
+	}, []);
+
+	const clearScans = () => {
+		// add in
+	};
+
+	//console.log(lastScan);
+
+	useEffect(() => {
+		zebraScanner.ensureProfile();
+		zebraScanner.startListening();
+
+		const sub = zebraScanner.addScanListener((scan) => {
+			//console.log("SCAN:", scan);
+			handleScan(scan);
+		});
+
+		return () => {
+			sub.remove();
+			zebraScanner.stopListening();
+		};
+	}, [handleScan]);
+	return (
+		<View>
+			<View style={{ alignItems: "center", margin: 10 }}>
+				<Text style={{ fontSize: 20, fontWeight: "600" }}>LST Scanner</Text>
+			</View>
+			<View
+				style={{
+					marginTop: 50,
+					alignItems: "center",
+				}}
+			>
+				<Text>Relocate</Text>
+				<Text>0 / 4</Text>
+			</View>
+
+			{/* <View>
                          <Text>List of recent scanned pallets TBA</Text>
                      </View> */}
-                    </View>
-  )
+		</View>
+	);
 }