-
Notifications
You must be signed in to change notification settings - Fork 16
/
CameraScreen.js
70 lines (62 loc) · 1.91 KB
/
CameraScreen.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
// @flow
import * as React from "react";
import { View, StyleSheet, Text } from "react-native";
import debug from "debug";
import { NavigationActions } from "react-navigation";
import { useFocusState, useNavigation } from "react-navigation-hooks";
import { defineMessages, FormattedMessage } from "react-intl";
import CameraView from "../sharedComponents/CameraView";
import HomeHeader from "../sharedComponents/HomeHeader";
import useDraftObservation, {
type CapturePromise
} from "../hooks/useDraftObservation";
import PermissionsContext, {
PERMISSIONS,
RESULTS
} from "../context/PermissionsContext";
const m = defineMessages({
noCameraAccess: {
id: "screens.CameraScreen.noCameraAccess",
defaultMessage: "No access to camera",
description:
"Error message shown when app does not have permissions to camera"
}
});
const log = debug("mapeo:CameraScreen");
const CameraScreen = () => {
const focusState = useFocusState();
const [, { newDraft }] = useDraftObservation();
const navigation = useNavigation();
const { permissions } = React.useContext(PermissionsContext);
const handleAddPress = React.useCallback(
(e: any, capture: CapturePromise) => {
log("pressed add button");
newDraft(undefined, { tags: {} }, capture);
navigation.navigate(
"NewObservation",
{},
NavigationActions.navigate({ routeName: "CategoryChooser" })
);
},
[newDraft, navigation]
);
return (
<View style={styles.container}>
{permissions[PERMISSIONS.CAMERA] !== RESULTS.GRANTED ? (
<Text>
<FormattedMessage {...m.noCameraAccess} />
</Text>
) : focusState.isBlurred || focusState.isFocusing ? null : (
<CameraView onAddPress={handleAddPress} />
)}
<HomeHeader />
</View>
);
};
export default CameraScreen;
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "black"
}
});