105 lines
2.6 KiB
TypeScript
105 lines
2.6 KiB
TypeScript
import { useStartTestMutation } from "@/api/userTests";
|
|
import { Button, ButtonText } from "@/components/ui/button";
|
|
import { ThemedText } from "@/components/ui/themed-text";
|
|
import getErrorAxiosMessage from "@/utils/get-error-axios-message";
|
|
import { router, Stack, useFocusEffect } from "expo-router";
|
|
import { useCallback, useState } from "react";
|
|
import { StyleSheet, Text, View } from "react-native";
|
|
import { useToast } from "react-native-toast-notifications";
|
|
import {
|
|
Camera,
|
|
useCameraDevice,
|
|
useCameraPermission,
|
|
useCodeScanner,
|
|
} from "react-native-vision-camera";
|
|
|
|
const QrScreen = () => {
|
|
const device = useCameraDevice("back");
|
|
const { hasPermission, requestPermission } = useCameraPermission();
|
|
const toast = useToast();
|
|
const [scanned, setScanned] = useState(false);
|
|
|
|
const { mutate, isPending } = useStartTestMutation();
|
|
|
|
useFocusEffect(
|
|
useCallback(() => {
|
|
setScanned(false);
|
|
}, [])
|
|
);
|
|
|
|
const handleStartTest = (id: number) => {
|
|
mutate(
|
|
{
|
|
test_id: id,
|
|
},
|
|
{
|
|
onSuccess: (data) => {
|
|
router.push(`/user-tests/doing/${data.id}`);
|
|
},
|
|
onError: (error) => {
|
|
toast.show(getErrorAxiosMessage(error), { type: "danger" });
|
|
},
|
|
}
|
|
);
|
|
};
|
|
|
|
const codeScanner = useCodeScanner({
|
|
codeTypes: ["qr", "ean-13"],
|
|
onCodeScanned: (codes) => {
|
|
if (scanned) return;
|
|
if (!codes || codes.length === 0) return;
|
|
|
|
const scannedValue = codes[0].value;
|
|
if (scannedValue) {
|
|
const id = parseInt(scannedValue, 10);
|
|
setScanned(true);
|
|
toast.show("Going to test", { type: "normal" });
|
|
router.push(`/tests/${id}`);
|
|
// handleStartTest(id);
|
|
} else {
|
|
toast.show("Invalid QR code", { type: "warning" });
|
|
}
|
|
},
|
|
});
|
|
|
|
if (!hasPermission) {
|
|
return (
|
|
<View style={styles.center}>
|
|
<Stack.Screen options={{ title: "Scan QR Code" }} />
|
|
<ThemedText>No camera permission</ThemedText>
|
|
<Button onPress={requestPermission} className="mt-2">
|
|
<ButtonText>Grant Permission</ButtonText>
|
|
</Button>
|
|
</View>
|
|
);
|
|
}
|
|
if (!device) {
|
|
return (
|
|
<View style={styles.center}>
|
|
<ThemedText>No camera device found</ThemedText>
|
|
</View>
|
|
);
|
|
}
|
|
return (
|
|
<>
|
|
<Stack.Screen options={{ title: "Scan QR Code" }} />
|
|
<Camera
|
|
codeScanner={codeScanner}
|
|
style={StyleSheet.absoluteFill}
|
|
device={device}
|
|
isActive={true}
|
|
/>
|
|
</>
|
|
);
|
|
};
|
|
|
|
const styles = StyleSheet.create({
|
|
center: {
|
|
flex: 1,
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
},
|
|
});
|
|
|
|
export default QrScreen;
|