ordering-ui-react-native 0.14.64 → 0.14.65

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/src/components/PaymentOptionsWebView/index.tsx +124 -123
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ordering-ui-react-native",
3
- "version": "0.14.64",
3
+ "version": "0.14.65",
4
4
  "description": "Reusable components made in react native",
5
5
  "main": "src/index.tsx",
6
6
  "author": "ordering.inc",
package/src/components/PaymentOptionsWebView/index.tsx CHANGED
@@ -5,146 +5,147 @@ import WebView from 'react-native-webview';
5
5
  import { ActivityIndicator } from 'react-native-paper';
6
6
 
7
7
  import {
8
- ToastType,
9
- useToast,
10
- useApi,
11
- useLanguage,
12
- useConfig
8
+ ToastType,
9
+ useToast,
10
+ useApi,
11
+ useLanguage,
12
+ useConfig
13
13
  } from 'ordering-components/native';
14
14
 
15
15
  import { OText } from '../shared';
16
16
 
17
17
  interface PaymentOptionsWebViewParams {
18
- onNavigationRedirect?: Function,
19
- uri?: any,
20
- user?: any,
21
- token?: any,
22
- cart?: any,
23
- currency?: any,
24
- webviewPaymethod?: any,
25
- setShowGateway?: any,
26
- setOpenOrderCreating?: any,
27
- locationId?: any
18
+ onNavigationRedirect?: Function,
19
+ uri?: any,
20
+ user?: any,
21
+ token?: any,
22
+ cart?: any,
23
+ currency?: any,
24
+ webviewPaymethod?: any,
25
+ setShowGateway?: any,
26
+ setOpenOrderCreating?: any,
27
+ locationId?: any
28
28
  }
29
29
  export const PaymentOptionsWebView = (props: PaymentOptionsWebViewParams) => {
30
- const {
31
- onNavigationRedirect,
32
- uri,
33
- user,
34
- token,
35
- cart,
36
- currency,
37
- webviewPaymethod,
38
- setShowGateway,
39
- setOpenOrderCreating,
40
- locationId
41
- } = props
30
+ const {
31
+ onNavigationRedirect,
32
+ uri,
33
+ user,
34
+ token,
35
+ cart,
36
+ currency,
37
+ webviewPaymethod,
38
+ setShowGateway,
39
+ setOpenOrderCreating,
40
+ locationId
41
+ } = props
42
42
 
43
- const webviewRef = useRef<any>(null)
44
- const [, { showToast }] = useToast();
45
- const [ordering] = useApi()
46
- const [{ configs }] = useConfig();
47
- const [, t] = useLanguage();
43
+ const webviewRef = useRef<any>(null)
44
+ const [, { showToast }] = useToast();
45
+ const [ordering] = useApi()
46
+ const [{ configs }] = useConfig();
47
+ const [, t] = useLanguage();
48
48
 
49
-
50
- const [progClr, setProgClr] = useState('#424242');
51
- const [prog, setProg] = useState(true);
52
49
 
53
- const handleCloseWebview = () => {
50
+ const [progClr, setProgClr] = useState('#424242');
51
+ const [prog, setProg] = useState(true);
52
+
53
+ const handleCloseWebview = () => {
54
54
  setProg(true);
55
55
  setShowGateway({ open: false, closedByUser: true })
56
56
  }
57
57
 
58
- const onMessage = (e: any) => {
59
- if (e?.nativeEvent?.data && e?.nativeEvent?.data !== 'undefined') {
60
- let payment = JSON.parse(e.nativeEvent.data);
58
+ const onMessage = (e: any) => {
59
+ if (e?.nativeEvent?.data && e?.nativeEvent?.data !== 'undefined') {
60
+ let payment = JSON.parse(e.nativeEvent.data);
61
61
 
62
- if (payment === 'api error') {
63
- setShowGateway({ closedByUser: true, open: false })
64
- setProg(true);
65
- }
62
+ if (payment === 'api error') {
63
+ setShowGateway({ closedByUser: true, open: false })
64
+ setProg(true);
65
+ }
66
66
 
67
- if (payment) {
68
- if (payment.error) {
69
- showToast(ToastType.Error, payment.result)
70
- setOpenOrderCreating && setOpenOrderCreating(false)
71
- } else if (payment?.result?.order?.uuid) {
72
- showToast(ToastType.Success, t('ORDER_PLACED_SUCCESSfULLY', 'The order was placed successfully'))
73
- onNavigationRedirect && onNavigationRedirect('OrderDetails', { orderId: payment?.result?.order?.uuid, isFromCheckout: true})
74
- }
75
- setProg(true);
76
- setShowGateway({ closedByUser: false, open: false })
77
- }
67
+ if (payment) {
68
+ if (payment.error) {
69
+ showToast(ToastType.Error, payment.result)
70
+ setOpenOrderCreating && setOpenOrderCreating(false)
71
+ } else if (payment?.result?.order?.uuid) {
72
+ showToast(ToastType.Success, t('ORDER_PLACED_SUCCESSfULLY', 'The order was placed successfully'))
73
+ onNavigationRedirect && onNavigationRedirect('OrderDetails', { orderId: payment?.result?.order?.uuid, isFromCheckout: true })
78
74
  }
79
- }
75
+ setProg(true);
76
+ setShowGateway({ closedByUser: false, open: false })
77
+ }
78
+ }
79
+ }
80
80
 
81
- return (
81
+ return (
82
82
  <View style={{ zIndex: 9999, height: '100%', width: '100%', position: 'absolute', backgroundColor: 'white' }}>
83
- <Icon
84
- name="x"
85
- size={35}
86
- style={{ backgroundColor: 'white', paddingTop: 30, paddingLeft: 10 }}
87
- onPress={handleCloseWebview}
88
- />
89
- <OText
90
- style={{
91
- textAlign: 'center',
92
- fontSize: 16,
93
- fontWeight: 'bold',
94
- color: '#00457C',
95
- marginBottom: 5,
96
- marginTop: 10
97
- }}>
98
- {webviewPaymethod?.gateway === 'paypal' ? (t('PAYPAL_GATEWAY', 'PayPal GateWay')) : (t('SQUARE_PAYMENT', 'Square payment'))}
99
- </OText>
100
- <View style={{ padding: 20, opacity: prog ? 1 : 0, backgroundColor: 'white' }}>
101
- <ActivityIndicator size={24} color={progClr} />
102
- </View>
103
- <WebView
104
- source={{ uri: uri }}
105
- onMessage={onMessage}
106
- ref={webviewRef}
107
- javaScriptEnabled={true}
108
- javaScriptEnabledAndroid={true}
109
- cacheEnabled={false}
110
- cacheMode='LOAD_NO_CACHE'
111
- style={{ flex: 1 }}
112
- onShouldStartLoadWithRequest={() => true}
113
- onLoadStart={() => {
114
- setProg(true);
115
- setProgClr('#424242');
116
- }}
117
- onLoadProgress={() => {
118
- setProg(true);
119
- setProgClr('#00457C');
120
- }}
121
- onLoad={() => {
122
- setProg(true);
123
- setProgClr('#00457C');
124
- }}
125
- onLoadEnd={(e) => {
126
- const messageParams = locationId ? { locationId } : {}
127
- const message = {
128
- action: 'init',
129
- data: {
130
- urlPlace: `${ordering.root}/carts/${cart?.uuid}/place`,
131
- urlConfirm: `${ordering.root}/carts/${cart?.uuid}/confirm`,
132
- payData: {
133
- paymethod_id: webviewPaymethod?.id,
134
- amount: cart?.balance ?? cart?.total,
135
- delivery_zone_id: cart?.delivery_zone_id,
136
- user_id: user?.id,
137
- user_name: user?.name
138
- },
139
- currency: configs?.stripe_currency?.value || currency,
140
- userToken: token,
141
- clientId: webviewPaymethod?.credentials?.client_id,
142
- ...messageParams
143
- }
144
- }
145
- setProg(false);
146
- webviewRef?.current?.postMessage?.(JSON.stringify(message))
147
- }}
148
- />
83
+ <Icon
84
+ name="x"
85
+ size={35}
86
+ style={{ backgroundColor: 'white', paddingTop: 30, paddingLeft: 10 }}
87
+ onPress={handleCloseWebview}
88
+ />
89
+ <OText
90
+ style={{
91
+ textAlign: 'center',
92
+ fontSize: 16,
93
+ fontWeight: 'bold',
94
+ color: '#00457C',
95
+ marginBottom: 5,
96
+ marginTop: 10
97
+ }}>
98
+ {webviewPaymethod?.gateway === 'paypal' ? (t('PAYPAL_GATEWAY', 'PayPal GateWay')) : (t('SQUARE_PAYMENT', 'Square payment'))}
99
+ </OText>
100
+ <View style={{ padding: 20, opacity: prog ? 1 : 0, backgroundColor: 'white' }}>
101
+ <ActivityIndicator size={24} color={progClr} />
102
+ </View>
103
+ <WebView
104
+ source={{ uri: uri }}
105
+ onMessage={onMessage}
106
+ ref={webviewRef}
107
+ javaScriptEnabled={true}
108
+ javaScriptEnabledAndroid={true}
109
+ cacheEnabled={false}
110
+ cacheMode='LOAD_NO_CACHE'
111
+ style={{ flex: 1 }}
112
+ onShouldStartLoadWithRequest={() => true}
113
+ onLoadStart={() => {
114
+ setProg(true);
115
+ setProgClr('#424242');
116
+ }}
117
+ onLoadProgress={() => {
118
+ setProg(true);
119
+ setProgClr('#00457C');
120
+ }}
121
+ onLoad={() => {
122
+ setProg(true);
123
+ setProgClr('#00457C');
124
+ }}
125
+ onLoadEnd={(e) => {
126
+ const messageParams = locationId ? { locationId, clientId: webviewPaymethod?.credentials?.application_id } : {}
127
+ const message = {
128
+ action: 'init',
129
+ data: {
130
+ urlPlace: `${ordering.root}/carts/${cart?.uuid}/place`,
131
+ urlConfirm: `${ordering.root}/carts/${cart?.uuid}/confirm`,
132
+ payData: {
133
+ paymethod_id: webviewPaymethod?.id,
134
+ amount: cart?.balance ?? cart?.total,
135
+ delivery_zone_id: cart?.delivery_zone_id,
136
+ user_id: user?.id,
137
+ user_name: user?.name
138
+ },
139
+ currency: configs?.stripe_currency?.value || currency,
140
+ userToken: token,
141
+ clientId: webviewPaymethod?.credentials?.client_id,
142
+ ...messageParams
143
+ }
144
+ }
145
+ setProg(false);
146
+ webviewRef?.current?.postMessage?.(JSON.stringify(message))
147
+ }}
148
+ />
149
149
  </View>
150
- )}
150
+ )
151
+ }