Merge pull request 'Move camera access permissions' (#113) from loewy/permissions into master

Reviewed-on: railbird/railbird-mobile#113
Reviewed-by: Kat Huang <kkathuang@gmail.com>
This commit is contained in:
loewy 2024-02-12 14:57:21 -07:00
commit 62637badcb
5 changed files with 50 additions and 10 deletions

View File

@ -44,7 +44,7 @@ export const createOrSignInUser = async (
} catch (err) { } catch (err) {
console.log(err); console.log(err);
// TODO: #107 -- Correct error handling // TODO: #107 -- Correct error handling
Alert.alert(err.message); Alert.alert("There was an issue.", err.message);
} }
}; };

View File

@ -129,7 +129,7 @@ export default function CameraScreen({
}, [data, uploadManager]); }, [data, uploadManager]);
const camera = useRef<Camera>(null); const camera = useRef<Camera>(null);
const { hasPermission, requestPermission } = useCameraPermission(); const { hasPermission } = useCameraPermission();
const [isCameraInitialized, setIsCameraInitialized] = const [isCameraInitialized, setIsCameraInitialized] =
useState<boolean>(false); useState<boolean>(false);
@ -161,11 +161,6 @@ export default function CameraScreen({
[uploadManager], [uploadManager],
); );
if (!hasPermission) {
requestPermission();
// Error handling in case they refuse to give permission
}
const device = useCameraDevice("back"); const device = useCameraDevice("back");
const format = useCameraFormat(device, [ const format = useCameraFormat(device, [
{ videoResolution: { width: 1920, height: 1080 } }, { videoResolution: { width: 1920, height: 1080 } },
@ -184,6 +179,7 @@ export default function CameraScreen({
// Replace with error handling // Replace with error handling
if (device === null) { if (device === null) {
console.log(device); console.log(device);
// hasPermission redundant here - user should not be able to launch camera without permissions
return ( return (
<Text> <Text>
Camera not available. Does user have permissions: {hasPermission} Camera not available. Does user have permissions: {hasPermission}

View File

@ -0,0 +1,21 @@
interface PermissionMessage {
android: {
title: string;
message: string;
};
ios: {
title: string;
message: string;
};
}
export const CAMERA_PERMISSION_DENIED: PermissionMessage = {
android: {
title: "In order to use the camera, you need to grant app permissions.",
message: "Please go to Railbird > App Info and grant permissions. ",
},
ios: {
title: "In order to use the camera, you need to grant app permissions.",
message: "Please go to Settings > Railbird > Camera and grant permissions.",
},
};

View File

@ -0,0 +1,12 @@
import { Alert, Platform } from "react-native";
import { CAMERA_PERMISSION_DENIED } from "./constants";
const ALERT_TYPE = {
camera: CAMERA_PERMISSION_DENIED,
};
export const showAlert = (alertType: string) => {
const alert = ALERT_TYPE[alertType];
const { title, message } = alert[Platform.OS];
Alert.alert(title, message);
};

View File

@ -8,6 +8,9 @@ import {
View, View,
} from "react-native"; } from "react-native";
import DropDownPicker from "react-native-dropdown-picker"; import DropDownPicker from "react-native-dropdown-picker";
// @ts-ignore
import { useCameraPermission } from "react-native-vision-camera";
import { showAlert } from "../../lib/alert-messages";
import { recordStyles as styles } from "./styles"; import { recordStyles as styles } from "./styles";
interface CameraScreenParams { interface CameraScreenParams {
@ -17,10 +20,14 @@ interface CameraScreenParams {
location: string; location: string;
} }
// Record Screen
// Precedes Camera.tsx
// Can be made into Modal when ready
export default function RecordScreen({ navigation }): React.JSX.Element { export default function RecordScreen({ navigation }): React.JSX.Element {
// Permissions
const { hasPermission, requestPermission } = useCameraPermission();
if (!hasPermission) {
requestPermission();
}
// Game type dropdown // Game type dropdown
const [gameTypeOpen, setGameTypeOpen] = useState<boolean>(false); const [gameTypeOpen, setGameTypeOpen] = useState<boolean>(false);
const [gameType, setGameType] = useState<string | null>(null); // This is a dropdown const [gameType, setGameType] = useState<string | null>(null); // This is a dropdown
@ -64,6 +71,10 @@ export default function RecordScreen({ navigation }): React.JSX.Element {
const [location, setLocation] = useState<string>(""); const [location, setLocation] = useState<string>("");
const handleSubmit = () => { const handleSubmit = () => {
if (!hasPermission) {
return showAlert("camera");
}
// needs to pass info as params or store in a context/state provider // needs to pass info as params or store in a context/state provider
const params: CameraScreenParams = { const params: CameraScreenParams = {
gameType: gameType, gameType: gameType,