BarCodeScanner doesn't stop to work

[rgmsrl]

Hi,
I am using BarCodeScanner, even if I remove it from the screen after the scan is complete, the camera still works. I’m using a Pixel 6 with Android 13 and the camera usage notification doesn’t go away. Even if I quit the application (I am using the expo go app to run the app). The only way to stop it is to deauthorize the camera or stop the app.

This is my code:

import React, { useState, useEffect, useRef } from "react";
import {
  Text,
  View,
  StyleSheet,
  Button,
  TouchableOpacity,
  Platform,
  Linking,
  Animated,
  Easing,
} from "react-native";
import { BarCodeScanner } from "expo-barcode-scanner";
import { contrast, primaryColor } from "../../../Costants";

const Scanner = ({ navigation }) => {
  const [hasPermission, setHasPermission] = useState(null);
  const [scanned, setScanned] = useState(false);
  const [showScanner, setShowScanner] = useState(true);

  var linePosition = useRef(new Animated.Value(0)).current;

  useEffect(() => {
    scanAnimation();
    const getBarCodeScannerPermissions = async () => {
      const { status } = await BarCodeScanner.requestPermissionsAsync();
      setHasPermission(status === "granted");
    };

    getBarCodeScannerPermissions();
    return () => {
      setHasPermission(false);
    };
  }, []);

  const handleBarCodeScanned = ({ type, data }) => {
    setScanned(true);
    setShowScanner(false);
    //navigation.navigate("DeviceStatus", { code: data });
  };

  function scanAnimation() {
    Animated.loop(
      Animated.sequence([
        Animated.timing(linePosition, {
          toValue: 400,
          useNativeDriver: true,
          duration: 1500,
          easing: Easing.linear,
        }),
        Animated.timing(linePosition, {
          toValue: 0,
          useNativeDriver: true,
          duration: 1500,
          easing: Easing.linear,
        }),
      ])
    ).start();
  }

  function goToSettings() {
    if (Platform.OS == "ios") {
      Linking.openURL("app-settings:");
    } else {
      Linking.openSettings();
    }
  }

  if (hasPermission === null) {
    return (
      <View style={styles.container}>
        <Text>Requesting for camera permission</Text>
      </View>
    );
  }
  if (hasPermission === false) {
    return (
      <View style={styles.container}>
        <Text>No access to camera</Text>
        <Text>
          If you want to abilitate it you have to go and do it manually
        </Text>
        <Text>Press the button below to go on settings</Text>
        <TouchableOpacity style={styles.buttonContainer}>
          <Text style={styles.buttonText} onPress={() => goToSettings()}>
            Go to settings
          </Text>
        </TouchableOpacity>
      </View>
    );
  }

  return (
    <View style={styles.container}>
      {showScanner && (
        <View>
          <Animated.View
            style={[styles.line, { transform: [{ translateY: linePosition }] }]}
          />
          <BarCodeScanner
            onBarCodeScanned={scanned ? undefined : handleBarCodeScanned}
            style={styles.scanner}
          />
          {scanned && (
            <Button
              title={"Tap to Scan Again"}
              onPress={() => setScanned(false)}
            />
          )}
        </View>
      )}
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    flexDirection: "column",
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: contrast,
  },
  buttonText: {
    padding: 15,
    color: contrast,
    fontWeight: "bold",
  },
  buttonContainer: {
    position: "relative",
    height: 50,
    width: 150,
    backgroundColor: primaryColor,
    elevation: 5,
    shadowRadius: 2,
    shadowOffset: {
      width: 1,
      height: 1,
    },
    shadowColor: "grey",
    shadowOpacity: 0.5,
    borderRadius: 5,
    alignSelf: "center",
    alignItems: "center",
    marginTop: 30,
    marginBottom: 30,
  },
  line: {
    width: 300,
    height: 4,
    backgroundColor: primaryColor,
    position: "relative",
    elevation: 5,
    zIndex: 1,
  },
  scanner: {
    width: 300,
    height: 400,
    alignSelf: "center",
  },
});

export { Scanner };