ordering-ui-react-native 0.12.15 → 0.12.19

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ordering-ui-react-native",
3
- "version": "0.12.15",
3
+ "version": "0.12.19",
4
4
  "description": "Reusable components made in react native",
5
5
  "main": "src/index.tsx",
6
6
  "author": "ordering.inc",
@@ -57,7 +57,7 @@ const AddressListUI = (props: AddressListParams) => {
57
57
 
58
58
  const [orderState] = useOrder()
59
59
  const [, t] = useLanguage()
60
- const [{ auth }] = useSession()
60
+ const [{ auth }, { logout }] = useSession()
61
61
  const [alert, setAlert] = useState<any>({ show: false })
62
62
 
63
63
  const onNavigatorRedirect = () => {
@@ -261,6 +261,8 @@ const AddressListUI = (props: AddressListParams) => {
261
261
  addressList.error[0] ||
262
262
  t('NETWORK_ERROR', 'Network Error, please reload the app')
263
263
  }
264
+ btnTitle={t('LOGIN', 'Login')}
265
+ onClickButton={() => logout()}
264
266
  />
265
267
  )
266
268
  )}
@@ -27,6 +27,7 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
27
27
  notShowCustomerPhone,
28
28
  titleAccept,
29
29
  titleReject,
30
+ titleNotReady,
30
31
  appTitle,
31
32
  } = props;
32
33
 
@@ -43,7 +44,7 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
43
44
  const [isKeyboardShow, setIsKeyboardShow] = useState(false);
44
45
  const phoneNumber = customerCellphone;
45
46
  let codeNumberPhone, numberPhone, numberToShow;
46
- const { top, bottom} = useSafeAreaInsets()
47
+ const { top, bottom } = useSafeAreaInsets()
47
48
 
48
49
  const handleFocus = () => {
49
50
  viewRef?.current?.measure((x: any, y: any) => {
@@ -111,7 +112,7 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
111
112
  openTimerIOnput();
112
113
  }
113
114
 
114
- if (actions && (action === 'reject' || action === 'failed')) {
115
+ if (actions && (action === 'reject' || action === 'failed' || action === 'notReady')) {
115
116
  openTextTareaOInput();
116
117
  }
117
118
  }, []);
@@ -181,6 +182,10 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
181
182
  failedByDriver: {
182
183
  comment: comments,
183
184
  status: 12
185
+ },
186
+ orderNotReady: {
187
+ comment: comments,
188
+ status: 14
184
189
  }
185
190
  };
186
191
 
@@ -190,9 +195,12 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
190
195
  if (actions && action === 'reject') {
191
196
  bodyToSend = orderStatus[actions.reject];
192
197
  }
193
- if(actions && action === 'failed'){
198
+ if (actions && action === 'failed') {
194
199
  bodyToSend = orderStatus[actions.failed]
195
200
  }
201
+ if (actions && action === 'notReady') {
202
+ bodyToSend = orderStatus[actions.notReady]
203
+ }
196
204
 
197
205
  bodyToSend.id = orderId;
198
206
 
@@ -200,11 +208,11 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
200
208
  };
201
209
 
202
210
  return (
203
- <KeyboardAvoidingView
211
+ <KeyboardAvoidingView
204
212
  enabled
205
- behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
206
- style={{ flex: 1, paddingHorizontal: 30, paddingTop: 30, marginTop: top, marginBottom: bottom,justifyContent: 'space-between' }}>
207
- <View>
213
+ behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
214
+ style={{ flex: 1, paddingHorizontal: 30, paddingTop: 30, marginTop: top, marginBottom: bottom, justifyContent: 'space-between' }}>
215
+ <View>
208
216
  <OIconButton
209
217
  icon={theme.images.general.arrow_left}
210
218
  borderColor={theme.colors.clear}
@@ -227,163 +235,167 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
227
235
  weight="600">
228
236
  {action === 'accept'
229
237
  ? `${t(titleAccept?.key, titleAccept?.text)}:`
230
- : t(titleReject?.key, titleReject?.text)}
238
+ : action === 'notReady'
239
+ ? t(titleNotReady?.key, titleNotReady?.text)
240
+ : t(titleReject?.key, titleReject?.text)}
231
241
  </OText>
232
- </View>
233
- <Content showsVerticalScrollIndicator={false} ref={scrollViewRef}>
234
- <Header>
235
- {action === 'reject' && (
236
- <>
237
- {!notShowCustomerPhone && (
238
- <>
239
- <OText
240
- size={15}
241
- color={theme.colors.textGray}
242
- style={{ marginTop: 10 }}>
243
- {t(
244
- 'CALL_YOUR_CUSTOMER_TO_RESOLVE_THE_ISSUE_AS_POLITELY_AS_POSSIBLE',
245
- 'Call your customer to resolve the issue as politely as possible',
246
- )}
247
- </OText>
248
-
249
- {numberToShow ? (
250
- <OButton
251
- bgColor="transparent"
252
- borderColor={theme.colors.primary}
253
- textStyle={{
254
- color: theme.colors.primary,
255
- fontSize: 20,
256
- }}
257
- style={{
258
- borderRadius: 10,
259
- marginVertical: 20,
260
- }}
261
- imgLeftStyle={{
262
- resizeMode: 'contain',
263
- left: 20,
264
- position: 'absolute',
265
- }}
266
- imgLeftSrc={theme.images.general.cellphone}
267
- text={numberToShow}
268
- onClick={() =>
269
- Linking.openURL(`tel:${customerCellphone}`)
270
- }
271
- />
272
- ) : (
273
- <OButton
274
- bgColor="transparent"
275
- borderColor={theme.colors.primary}
276
- textStyle={{
277
- color: theme.colors.primary,
278
- fontSize: 15,
279
- }}
280
- style={{
281
- borderRadius: 10,
282
- marginVertical: 20,
283
- }}
284
- imgLeftStyle={{
285
- resizeMode: 'contain',
286
- left: 20,
287
- position: 'absolute',
288
- }}
289
- isDisabled={true}
290
- imgLeftSrc={theme.images.general.cellphone}
291
- text={t('NOT_NUMBER', "There's not phonenumber.")}
292
- onClick={() =>
293
- Linking.openURL(`tel:${customerCellphone}`)
294
- }
295
- />
242
+ </View>
243
+ <Content showsVerticalScrollIndicator={false} ref={scrollViewRef}>
244
+ <Header>
245
+ {action === 'reject' && (
246
+ <>
247
+ {!notShowCustomerPhone && (
248
+ <>
249
+ <OText
250
+ size={15}
251
+ color={theme.colors.textGray}
252
+ style={{ marginTop: 10 }}>
253
+ {t(
254
+ 'CALL_YOUR_CUSTOMER_TO_RESOLVE_THE_ISSUE_AS_POLITELY_AS_POSSIBLE',
255
+ 'Call your customer to resolve the issue as politely as possible',
296
256
  )}
297
- </>
298
- )}
257
+ </OText>
299
258
 
300
- <OText
301
- size={15}
302
- color={theme.colors.textGray}
303
- style={{ marginBottom: 10 }}>
304
- {t(
305
- 'MARK_THE_ORDER_AS_REJECTED',
306
- 'Mark the order as rejected',
259
+ {numberToShow ? (
260
+ <OButton
261
+ bgColor="transparent"
262
+ borderColor={theme.colors.primary}
263
+ textStyle={{
264
+ color: theme.colors.primary,
265
+ fontSize: 20,
266
+ }}
267
+ style={{
268
+ borderRadius: 10,
269
+ marginVertical: 20,
270
+ }}
271
+ imgLeftStyle={{
272
+ resizeMode: 'contain',
273
+ left: 20,
274
+ position: 'absolute',
275
+ }}
276
+ imgLeftSrc={theme.images.general.cellphone}
277
+ text={numberToShow}
278
+ onClick={() =>
279
+ Linking.openURL(`tel:${customerCellphone}`)
280
+ }
281
+ />
282
+ ) : (
283
+ <OButton
284
+ bgColor="transparent"
285
+ borderColor={theme.colors.primary}
286
+ textStyle={{
287
+ color: theme.colors.primary,
288
+ fontSize: 15,
289
+ }}
290
+ style={{
291
+ borderRadius: 10,
292
+ marginVertical: 20,
293
+ }}
294
+ imgLeftStyle={{
295
+ resizeMode: 'contain',
296
+ left: 20,
297
+ position: 'absolute',
298
+ }}
299
+ isDisabled={true}
300
+ imgLeftSrc={theme.images.general.cellphone}
301
+ text={t('NOT_NUMBER', "There's not phonenumber.")}
302
+ onClick={() =>
303
+ Linking.openURL(`tel:${customerCellphone}`)
304
+ }
305
+ />
307
306
  )}
308
- </OText>
309
-
310
- <OText>
311
- <OText style={{ fontWeight: '600' }}>
312
- {t('NOTE', 'Note')}
313
- {': '}
314
- </OText>
307
+ </>
308
+ )}
309
+
310
+ <OText
311
+ size={15}
312
+ color={theme.colors.textGray}
313
+ style={{ marginBottom: 10 }}>
314
+ {t(
315
+ 'MARK_THE_ORDER_AS_REJECTED',
316
+ 'Mark the order as rejected',
317
+ )}
318
+ </OText>
315
319
 
316
- <OText size={15} color={theme.colors.textGray}>
317
- {t(
318
- 'YOUR_CUSTOMER_WILL_RECEIVE_A_NOTIFICATION_ABOUT_THIS_ACTIONS',
319
- 'Your customer will receive a notification about this actions',
320
- )}
321
- </OText>
322
- </OText>
323
- </>
324
- )}
325
- </Header>
326
-
327
- {action === 'accept' && (
328
- <View style={{ height: 400, justifyContent: 'center' }}>
329
- <Timer onPress={() => openTimerIOnput()}>
330
- <OText weight="600" style={{ textAlign: 'center' }} size={55}>
331
- {hour}
320
+ <OText>
321
+ <OText style={{ fontWeight: '600' }}>
322
+ {t('NOTE', 'Note')}
323
+ {': '}
332
324
  </OText>
333
- {hour.length > 0 && <OText size={55}>:</OText>}
334
- <OText weight="600" style={{ textAlign: 'center' }} size={55}>
335
- {min}
325
+
326
+ <OText size={15} color={theme.colors.textGray}>
327
+ {t(
328
+ 'YOUR_CUSTOMER_WILL_RECEIVE_A_NOTIFICATION_ABOUT_THIS_ACTIONS',
329
+ 'Your customer will receive a notification about this actions',
330
+ )}
336
331
  </OText>
337
- </Timer>
338
- </View>
339
- )}
340
- <TimeField
341
- ref={timerRef}
342
- keyboardType="numeric"
343
- value={time}
344
- placeholder={'00:00'}
345
- onChangeText={handleTime}
346
- onPressOut={() => handleFixTime()}
347
- editable={true}
348
- autoFocus={actions && action === 'accept'}
349
- selectionColor={theme.colors.primary}
350
- placeholderTextColor={theme.colors.textGray}
351
- color={theme.colors.textGray}
352
- onEndEditing={handleFixTime}
353
- />
354
-
355
- {(action === 'reject' || action === 'failed') && (
356
- <Comments ref={viewRef}>
357
- <OTextarea
358
- textTareaRef={textTareaRef}
359
- autoFocus={actions && (action === 'reject' || action === 'failed')}
360
- onFocus={handleFocus}
361
- placeholder={t(
362
- 'PLEASE_TYPE_YOUR_COMMENTS_IN_HERE',
363
- 'Please type your comments in here',
364
- )}
365
- value={comments}
366
- onChange={setComments}
367
- />
368
- <View style={{ height: 20 }} />
369
- </Comments>
332
+ </OText>
333
+ </>
370
334
  )}
371
- </Content>
372
-
373
- <Action>
374
- <FloatingButton
375
- firstButtonClick={() => {
376
- handleAcceptOrReject();
377
- }}
378
- btnText={
379
- action === 'accept'
380
- ? t('ACCEPT', 'Accept')
335
+ </Header>
336
+
337
+ {action === 'accept' && (
338
+ <View style={{ height: 400, justifyContent: 'center' }}>
339
+ <Timer onPress={() => openTimerIOnput()}>
340
+ <OText weight="600" style={{ textAlign: 'center' }} size={55}>
341
+ {hour}
342
+ </OText>
343
+ {hour.length > 0 && <OText size={55}>:</OText>}
344
+ <OText weight="600" style={{ textAlign: 'center' }} size={55}>
345
+ {min}
346
+ </OText>
347
+ </Timer>
348
+ </View>
349
+ )}
350
+ <TimeField
351
+ ref={timerRef}
352
+ keyboardType="numeric"
353
+ value={time}
354
+ placeholder={'00:00'}
355
+ onChangeText={handleTime}
356
+ onPressOut={() => handleFixTime()}
357
+ editable={true}
358
+ autoFocus={actions && action === 'accept'}
359
+ selectionColor={theme.colors.primary}
360
+ placeholderTextColor={theme.colors.textGray}
361
+ color={theme.colors.textGray}
362
+ onEndEditing={handleFixTime}
363
+ />
364
+
365
+ {(['failed', 'reject', 'notReady']?.includes(action)) && (
366
+ <Comments ref={viewRef}>
367
+ <OTextarea
368
+ textTareaRef={textTareaRef}
369
+ autoFocus={actions && (action === 'reject' || action === 'failed' || action === 'notReady')}
370
+ onFocus={handleFocus}
371
+ placeholder={t(
372
+ 'PLEASE_TYPE_YOUR_COMMENTS_IN_HERE',
373
+ 'Please type your comments in here',
374
+ )}
375
+ value={comments}
376
+ onChange={setComments}
377
+ />
378
+ <View style={{ height: 20 }} />
379
+ </Comments>
380
+ )}
381
+ </Content>
382
+
383
+ <Action>
384
+ <FloatingButton
385
+ firstButtonClick={() => {
386
+ handleAcceptOrReject();
387
+ }}
388
+ btnText={
389
+ action === 'accept'
390
+ ? t('ACCEPT', 'Accept')
391
+ : action === 'notReady'
392
+ ? t('ORDER_NOT_READY', 'Order not ready')
381
393
  : t('REJECT', 'Reject')
382
- }
383
- color={action === 'accept' ? theme.colors.green : theme.colors.red}
384
- widthButton={'100%'}
385
- />
386
- </Action>
387
- </KeyboardAvoidingView>
394
+ }
395
+ color={action === 'accept' ? theme.colors.green : theme.colors.red}
396
+ widthButton={'100%'}
397
+ />
398
+ </Action>
399
+ </KeyboardAvoidingView>
388
400
  );
389
401
  };
@@ -8,6 +8,7 @@ import { NotificationContainer } from './styles'
8
8
  import Sound from 'react-native-sound'
9
9
  import moment from 'moment'
10
10
  import { useLocation } from '../../hooks/useLocation'
11
+ import { useFocusEffect } from '@react-navigation/core'
11
12
  Sound.setCategory('Playback')
12
13
 
13
14
  const windowWidth = Dimensions.get('screen').width
@@ -23,6 +24,7 @@ export const NewOrderNotification = (props: any) => {
23
24
  const [modalOpen, setModalOpen] = useState(false)
24
25
  const [newOrderId, setNewOrderId] = useState(null)
25
26
  const [soundTimeout, setSoundTimeout] = useState<any>(null)
27
+ const [isFocused, setIsFocused] = useState(false)
26
28
 
27
29
  const notificationSound = new Sound(theme.sounds.notification, error => {
28
30
  if (error) {
@@ -86,7 +88,9 @@ export const NewOrderNotification = (props: any) => {
86
88
  clearInterval(soundTimeout)
87
89
  handlePlayNotificationSound()
88
90
  setNewOrderId(order.id)
89
- setModalOpen(true)
91
+ if(isFocused){
92
+ setModalOpen(true)
93
+ }
90
94
  }
91
95
  }
92
96
  }, [newOrderId, notificationSound, soundTimeout])
@@ -106,6 +110,15 @@ export const NewOrderNotification = (props: any) => {
106
110
  }
107
111
  }, [])
108
112
 
113
+ useFocusEffect(
114
+ useCallback(() => {
115
+ setIsFocused(true)
116
+ return () => {
117
+ setIsFocused(false)
118
+ }
119
+ }, [])
120
+ )
121
+
109
122
  return (
110
123
  <>
111
124
  <Modal
@@ -50,6 +50,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
50
50
  setDriverUpdateLocation,
51
51
  titleAccept,
52
52
  titleReject,
53
+ titleNotReady,
53
54
  appTitle,
54
55
  } = props;
55
56
 
@@ -302,7 +303,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
302
303
  textStyle={{ color: theme.colors.white }}
303
304
  text={t('ORDER_NOT_READY', 'Order not ready')}
304
305
  onClick={() =>
305
- handleChangeOrderStatus && handleChangeOrderStatus(14)
306
+ handleViewActionOrder && handleViewActionOrder('notReady')
306
307
  }
307
308
  imgLeftStyle={{ tintColor: theme.colors.backArrow }}
308
309
  bgColor={theme.colors.red}
@@ -344,6 +345,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
344
345
  actions={actions}
345
346
  titleAccept={titleAccept}
346
347
  titleReject={titleReject}
348
+ titleNotReady={titleNotReady}
347
349
  appTitle={appTitle}
348
350
  />
349
351
  </OModal>
@@ -570,21 +570,25 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
570
570
  search={search}
571
571
  onSearch={setSearch}
572
572
  />
573
- <OrdersOptionDelivery
574
- {...props}
575
- search={search}
576
- onSearch={setSearch}
577
- />
578
- <OrdersOptionPaymethod
579
- {...props}
580
- search={search}
581
- onSearch={setSearch}
582
- />
583
- <OrdersOptionDriver
584
- {...props}
585
- search={search}
586
- onSearch={setSearch}
587
- />
573
+ {isBusinessApp && (
574
+ <>
575
+ <OrdersOptionDelivery
576
+ {...props}
577
+ search={search}
578
+ onSearch={setSearch}
579
+ />
580
+ <OrdersOptionDriver
581
+ {...props}
582
+ search={search}
583
+ onSearch={setSearch}
584
+ />
585
+ <OrdersOptionPaymethod
586
+ {...props}
587
+ search={search}
588
+ onSearch={setSearch}
589
+ />
590
+ </>
591
+ )}
588
592
  <OButton
589
593
  text={t('SEARCH', 'Search')}
590
594
  textStyle={{ color: theme.colors.white }}
@@ -341,6 +341,7 @@ export interface OrderDetailsParams {
341
341
  actions?: actions;
342
342
  titleAccept?: textTranslate;
343
343
  titleReject?: textTranslate;
344
+ titleNotReady?: textTranslate;
344
345
  appTitle?: textTranslate;
345
346
  drivers?: any;
346
347
  loadingDriver?: boolean;
@@ -520,6 +521,7 @@ interface actions {
520
521
  accept: string;
521
522
  reject: string;
522
523
  failed: string;
524
+ notReady: string;
523
525
  }
524
526
 
525
527
  interface textTranslate {
@@ -531,13 +533,14 @@ export interface AcceptOrRejectOrderParams {
531
533
  customerCellphone?: string;
532
534
  closeModal?: any;
533
535
  loading?: boolean;
534
- action?: string;
536
+ action: string;
535
537
  orderId?: number;
536
538
  handleUpdateOrder?: (status: number, isAccept: any) => {};
537
539
  notShowCustomerPhone?: boolean | undefined;
538
540
  actions?: actions;
539
541
  titleAccept?: textTranslate;
540
542
  titleReject?: textTranslate;
543
+ titleNotReady?: textTranslate;
541
544
  appTitle?: textTranslate;
542
545
  }
543
546