1
- import React from 'react' ;
1
+ import React , {
2
+ Component ,
3
+ useState
4
+ } from 'react' ;
2
5
import {
3
6
Button ,
4
7
Image ,
@@ -7,9 +10,12 @@ import {
7
10
Text ,
8
11
View ,
9
12
Dimensions ,
13
+ Platform ,
10
14
TouchableWithoutFeedback ,
15
+ TextInput ,
11
16
} from 'react-native' ;
12
17
import { flattenObject } from './utils/utils' ;
18
+ import AnylineOCR from 'anyline-ocr-react-native-module' ;
13
19
14
20
const withoutImagePaths = value =>
15
21
value !== 'imagePath' && value !== 'fullImagePath' ;
@@ -23,6 +29,66 @@ export default function Result({
23
29
hasBackButton,
24
30
title = false ,
25
31
} ) {
32
+
33
+ const [ correctedResult , setCorrectedResult ] = useState ( '' ) ;
34
+ const [ responseText , setResponseText ] = useState ( '' ) ;
35
+
36
+ let onReportCorrectedResultResponseHandler = function ( response ) {
37
+ /*
38
+ The response is a string with the following style if it's an error:
39
+ {
40
+ "code": <Error code>,
41
+ "message": {
42
+ "code": <Error code>,
43
+ "timestamp": <Timestamp>,
44
+ "path": <Endpoint URL of our Api>,
45
+ "method": <POST, GET etc.>,
46
+ "message": <Error message>
47
+ }
48
+ }
49
+
50
+ If the response is successful it looks like this:
51
+ {
52
+ "code" : 201,
53
+ "message" : {
54
+ "message": "ok"
55
+ }
56
+ }
57
+ */
58
+ var parsedResponse = JSON . parse ( response ) ;
59
+ if ( parsedResponse [ "code" ] === 201 ) {
60
+ setResponseText ( "Sending corrected result was successful." ) ;
61
+ } else {
62
+ setResponseText ( "Error while sending corrected result: " + parsedResponse [ "message" ] ) ;
63
+ }
64
+ }
65
+
66
+ let onReportCorrectedResultPressed = function ( ) {
67
+ let blobKey = result [ "blobKey" ] ;
68
+
69
+ if ( typeof blobKey === 'undefined' || blobKey === '' || blobKey === null ) {
70
+ setResponseText ( "Only licenses with 'debugReporting' set to 'on' allow user corrected results." ) ;
71
+ } else if ( correctedResult !== "" ) {
72
+ setResponseText ( "Waiting for response..." ) ;
73
+ AnylineOCR . reportCorrectedResult ( result [ "blobKey" ] , correctedResult , onReportCorrectedResultResponseHandler ) ;
74
+ }
75
+ } ;
76
+
77
+ let reportCorrectedResultButton = (
78
+ < View
79
+ style = { styles . reportCorrectedResultButtonStyle }
80
+ >
81
+ < TextInput
82
+ placeholder = 'Enter corrected result'
83
+ backgroundColor = 'white'
84
+ marginBottom = { 16 }
85
+ onChangeText = { newCorrectedResult => setCorrectedResult ( newCorrectedResult ) }
86
+ />
87
+ < Button title = { 'Report corrected result' } onPress = { onReportCorrectedResultPressed } />
88
+ < Text style = { styles . text } > { responseText } </ Text >
89
+ </ View >
90
+ ) ;
91
+
26
92
let fullImage = < View /> ;
27
93
let fullImageText = < View /> ;
28
94
if ( fullImagePath && fullImagePath !== '' ) {
@@ -90,6 +156,7 @@ export default function Result({
90
156
</ View >
91
157
) ;
92
158
} ) }
159
+ { Platform . OS === 'android' && reportCorrectedResultButton }
93
160
{ BackButton }
94
161
</ ScrollView >
95
162
</ View >
@@ -163,6 +230,14 @@ const styles = StyleSheet.create({
163
230
alignSelf : 'center' ,
164
231
} ,
165
232
233
+ reportCorrectedResultButtonStyle : {
234
+ marginTop : 25 ,
235
+ width : Dimensions . get ( 'window' ) . width ,
236
+ alignSelf : 'center' ,
237
+ paddingLeft : 24 ,
238
+ paddingRight : 24
239
+ } ,
240
+
166
241
titleText : {
167
242
color : '#0099FF' ,
168
243
fontSize : 20
0 commit comments