ordering-ui-react-native 0.18.13 → 0.18.14
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 +1 -1
- package/src/components/OrderCreating/index.tsx +0 -20
- package/themes/business/src/components/Chat/index.tsx +116 -105
- package/themes/original/src/components/BusinessBasicInformation/styles.tsx +1 -4
- package/themes/original/src/components/BusinessProductsListing/index.tsx +7 -5
- package/themes/original/src/components/Messages/index.tsx +2 -1
- package/themes/original/src/components/MomentOption/index.tsx +5 -5
- package/themes/original/src/components/MultiCheckout/index.tsx +1 -0
- package/themes/original/src/components/OrderDetails/index.tsx +1 -1
- package/themes/original/src/components/SingleProductReview/styles.tsx +1 -1
- package/themes/original/src/components/shared/OButton.tsx +2 -2
package/package.json
CHANGED
|
@@ -131,26 +131,6 @@ export const OrderCreating = (props: any) => {
|
|
|
131
131
|
<OText size={14}>{address}</OText>
|
|
132
132
|
</LocationWrapper>
|
|
133
133
|
)}
|
|
134
|
-
{cart && !orderState?.options?.moment && (
|
|
135
|
-
<DeliveryWrapper>
|
|
136
|
-
<DeliveryContentWrapper>
|
|
137
|
-
<SimpleIcon
|
|
138
|
-
name='clock'
|
|
139
|
-
size={20}
|
|
140
|
-
color={theme.colors.primary}
|
|
141
|
-
style={{ marginRight: 10 }}
|
|
142
|
-
/>
|
|
143
|
-
<OText size={14}>
|
|
144
|
-
{orderState?.options?.type === 1
|
|
145
|
-
? t('DELIVERY_TIME', 'Delivery Time')
|
|
146
|
-
: t('PICK_UP', 'Pick Time')}
|
|
147
|
-
</OText>
|
|
148
|
-
</DeliveryContentWrapper>
|
|
149
|
-
<View>
|
|
150
|
-
<OText size={14} weight='700'>{parseDeliveryTime()}</OText>
|
|
151
|
-
</View>
|
|
152
|
-
</DeliveryWrapper>
|
|
153
|
-
)}
|
|
154
134
|
{cardData?.card?.brand && (
|
|
155
135
|
<View style={{ flexDirection: 'row', marginBottom: 27 }}>
|
|
156
136
|
{getIconCard(cardData?.card?.brand, 20)}
|
|
@@ -69,6 +69,8 @@ const ChatUI = (props: MessagesParams) => {
|
|
|
69
69
|
const [, { showToast }] = useToast();
|
|
70
70
|
const theme = useTheme();
|
|
71
71
|
const [messageList, setMessageList] = useState<any>([])
|
|
72
|
+
const previousStatus = [1, 2, 5, 6, 10, 11, 12, 16, 17]
|
|
73
|
+
const chatDisabled = previousStatus.includes(order?.status)
|
|
72
74
|
|
|
73
75
|
const ORDER_STATUS: any = {
|
|
74
76
|
0: t('ORDER_STATUS_PENDING', 'Order status pending'),
|
|
@@ -176,12 +178,8 @@ const ChatUI = (props: MessagesParams) => {
|
|
|
176
178
|
fontSize: 12,
|
|
177
179
|
},
|
|
178
180
|
toolbarStyle: {
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
paddingHorizontal: 30,
|
|
182
|
-
backgroundColor: theme.colors.white,
|
|
183
|
-
borderTopWidth: 1,
|
|
184
|
-
borderTopColor: theme.colors.tabBar,
|
|
181
|
+
padding: Platform.OS === 'ios' && isKeyboardShow ? 0 : 10,
|
|
182
|
+
flexDirection: 'column-reverse'
|
|
185
183
|
},
|
|
186
184
|
accessoryIcon: {
|
|
187
185
|
height: 32,
|
|
@@ -586,16 +584,12 @@ const ChatUI = (props: MessagesParams) => {
|
|
|
586
584
|
};
|
|
587
585
|
|
|
588
586
|
const renderAccessory = () => (
|
|
587
|
+
!chatDisabled &&
|
|
589
588
|
<View>
|
|
590
589
|
<Header
|
|
591
590
|
showsVerticalScrollIndicator={false}
|
|
592
591
|
showsHorizontalScrollIndicator={false}
|
|
593
592
|
horizontal
|
|
594
|
-
// contentContainerStyle={{
|
|
595
|
-
// justifyContent:
|
|
596
|
-
// orientation === 'Landscape' ? 'center' : 'space-between',
|
|
597
|
-
// width: '100%',
|
|
598
|
-
// }}
|
|
599
593
|
nestedScrollEnabled={true}
|
|
600
594
|
>
|
|
601
595
|
{user?.level !== 2 && (
|
|
@@ -766,113 +760,130 @@ const ChatUI = (props: MessagesParams) => {
|
|
|
766
760
|
containerStyle={styles.toolbarStyle}
|
|
767
761
|
primaryStyle={{ alignItems: 'center', justifyContent: 'space-between' }}
|
|
768
762
|
accessoryStyle={{ position: 'relative', marginBottom: 45 }}
|
|
769
|
-
renderAccessory={
|
|
763
|
+
renderAccessory={() => renderAccessory()}
|
|
770
764
|
/>
|
|
771
765
|
);
|
|
772
766
|
|
|
773
767
|
const renderComposer = (props: any) => (
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
borderRadius: 7.6,
|
|
781
|
-
alignItems: 'center',
|
|
782
|
-
justifyContent: 'center',
|
|
783
|
-
paddingRight: 10,
|
|
784
|
-
}}>
|
|
785
|
-
<Composer
|
|
786
|
-
{...props}
|
|
787
|
-
textInputStyle={{
|
|
788
|
-
borderRadius: 7.6,
|
|
789
|
-
borderColor: theme.colors.transparent,
|
|
790
|
-
borderWidth: 0,
|
|
791
|
-
color: '#010300',
|
|
792
|
-
}}
|
|
793
|
-
textInputProps={{
|
|
794
|
-
value: message,
|
|
795
|
-
onSubmitEditing: onSubmit,
|
|
796
|
-
returnKeyType: message ? 'send' : 'done',
|
|
797
|
-
blurOnSubmit: true,
|
|
798
|
-
multiline: false,
|
|
799
|
-
numberOfLines: 1,
|
|
800
|
-
autoCorrect: false,
|
|
801
|
-
autoCompleteType: 'off',
|
|
802
|
-
enablesReturnKeyAutomatically: false,
|
|
803
|
-
selectionColor: theme.colors.primary,
|
|
768
|
+
chatDisabled ? (
|
|
769
|
+
<View
|
|
770
|
+
style={{
|
|
771
|
+
width: '100%',
|
|
772
|
+
flexDirection: 'column',
|
|
773
|
+
alignItems: 'center'
|
|
804
774
|
}}
|
|
805
|
-
|
|
806
|
-
placeholderTextColor={theme.colors.composerPlaceHolder}
|
|
807
|
-
/>
|
|
808
|
-
|
|
809
|
-
<TouchableOpacity
|
|
810
|
-
onPress={() => {
|
|
811
|
-
setImage && setImage(null);
|
|
812
|
-
setIsShowSignaturePad(!isShowSignaturePad);
|
|
813
|
-
}}>
|
|
775
|
+
>
|
|
814
776
|
<MaterialCommunityIcon
|
|
815
|
-
name=
|
|
816
|
-
color={
|
|
817
|
-
isShowSignaturePad ? theme.colors.primary : theme.colors.arrowColor
|
|
818
|
-
}
|
|
777
|
+
name='close-octagon-outline'
|
|
819
778
|
size={24}
|
|
820
779
|
/>
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
|
|
780
|
+
<OText size={14}>{t('NOT_SEND_MESSAGES', 'You can\'t send messages because the order has ended')}</OText>
|
|
781
|
+
</View>
|
|
782
|
+
) : (
|
|
783
|
+
<View
|
|
784
|
+
style={{
|
|
785
|
+
flexDirection: 'row',
|
|
786
|
+
height: 44,
|
|
787
|
+
width: '85%',
|
|
788
|
+
backgroundColor: theme.colors.composerView,
|
|
789
|
+
borderRadius: 7.6,
|
|
790
|
+
alignItems: 'center',
|
|
791
|
+
justifyContent: 'center',
|
|
792
|
+
paddingRight: 10,
|
|
793
|
+
}}>
|
|
794
|
+
<Composer
|
|
825
795
|
{...props}
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
/>
|
|
847
|
-
|
|
848
|
-
{image && !isShowSignaturePad && (
|
|
849
|
-
<TouchableOpacity
|
|
850
|
-
style={{
|
|
851
|
-
position: 'absolute',
|
|
852
|
-
top: -5,
|
|
853
|
-
right: -5,
|
|
854
|
-
borderColor: theme.colors.backgroundDark,
|
|
855
|
-
backgroundColor: theme.colors.white,
|
|
856
|
-
borderRadius: 25,
|
|
857
|
-
}}
|
|
858
|
-
onPress={() => removeImage()}>
|
|
859
|
-
<MaterialCommunityIcon
|
|
860
|
-
name="close-circle-outline"
|
|
861
|
-
color={theme.colors.backgroundDark}
|
|
862
|
-
size={24}
|
|
863
|
-
/>
|
|
864
|
-
</TouchableOpacity>
|
|
865
|
-
)}
|
|
866
|
-
</>
|
|
867
|
-
)}
|
|
868
|
-
</>
|
|
869
|
-
)}
|
|
796
|
+
textInputStyle={{
|
|
797
|
+
borderRadius: 7.6,
|
|
798
|
+
borderColor: theme.colors.transparent,
|
|
799
|
+
borderWidth: 0,
|
|
800
|
+
color: '#010300',
|
|
801
|
+
}}
|
|
802
|
+
textInputProps={{
|
|
803
|
+
value: message,
|
|
804
|
+
onSubmitEditing: onSubmit,
|
|
805
|
+
returnKeyType: message ? 'send' : 'done',
|
|
806
|
+
blurOnSubmit: true,
|
|
807
|
+
multiline: false,
|
|
808
|
+
numberOfLines: 1,
|
|
809
|
+
autoCorrect: false,
|
|
810
|
+
autoCompleteType: 'off',
|
|
811
|
+
enablesReturnKeyAutomatically: false,
|
|
812
|
+
selectionColor: theme.colors.primary,
|
|
813
|
+
}}
|
|
814
|
+
placeholder={t('WRITE_MESSAGE', 'Write message')}
|
|
815
|
+
placeholderTextColor={theme.colors.composerPlaceHolder}
|
|
870
816
|
/>
|
|
871
|
-
|
|
872
|
-
|
|
817
|
+
|
|
818
|
+
<TouchableOpacity
|
|
819
|
+
onPress={() => {
|
|
820
|
+
setImage && setImage(null);
|
|
821
|
+
setIsShowSignaturePad(!isShowSignaturePad);
|
|
822
|
+
}}>
|
|
823
|
+
<MaterialCommunityIcon
|
|
824
|
+
name="pen"
|
|
825
|
+
color={
|
|
826
|
+
isShowSignaturePad ? theme.colors.primary : theme.colors.arrowColor
|
|
827
|
+
}
|
|
828
|
+
size={24}
|
|
829
|
+
/>
|
|
830
|
+
</TouchableOpacity>
|
|
831
|
+
|
|
832
|
+
{!file.type && (
|
|
833
|
+
<Actions
|
|
834
|
+
{...props}
|
|
835
|
+
containerStyle={styles.containerActions}
|
|
836
|
+
optionTintColor="#222845"
|
|
837
|
+
icon={() => (
|
|
838
|
+
<>
|
|
839
|
+
{!file?.type && (
|
|
840
|
+
<>
|
|
841
|
+
<OIconButton
|
|
842
|
+
borderColor={theme.colors.transparent}
|
|
843
|
+
icon={
|
|
844
|
+
!isShowSignaturePad && image
|
|
845
|
+
? { uri: image }
|
|
846
|
+
: theme.images.general.imageChat
|
|
847
|
+
}
|
|
848
|
+
iconStyle={{
|
|
849
|
+
borderRadius: image ? 10 : 0,
|
|
850
|
+
width: image ? 32 : 28,
|
|
851
|
+
height: image ? 32 : 28,
|
|
852
|
+
}}
|
|
853
|
+
onClick={handleImagePicker}
|
|
854
|
+
iconCover
|
|
855
|
+
/>
|
|
856
|
+
|
|
857
|
+
{image && !isShowSignaturePad && (
|
|
858
|
+
<TouchableOpacity
|
|
859
|
+
style={{
|
|
860
|
+
position: 'absolute',
|
|
861
|
+
top: -5,
|
|
862
|
+
right: -5,
|
|
863
|
+
borderColor: theme.colors.backgroundDark,
|
|
864
|
+
backgroundColor: theme.colors.white,
|
|
865
|
+
borderRadius: 25,
|
|
866
|
+
}}
|
|
867
|
+
onPress={() => removeImage()}>
|
|
868
|
+
<MaterialCommunityIcon
|
|
869
|
+
name="close-circle-outline"
|
|
870
|
+
color={theme.colors.backgroundDark}
|
|
871
|
+
size={24}
|
|
872
|
+
/>
|
|
873
|
+
</TouchableOpacity>
|
|
874
|
+
)}
|
|
875
|
+
</>
|
|
876
|
+
)}
|
|
877
|
+
</>
|
|
878
|
+
)}
|
|
879
|
+
/>
|
|
880
|
+
)}
|
|
881
|
+
</View>
|
|
882
|
+
)
|
|
873
883
|
);
|
|
874
884
|
|
|
875
885
|
const renderSend = (props: any) => (
|
|
886
|
+
!chatDisabled &&
|
|
876
887
|
<Send
|
|
877
888
|
{...props}
|
|
878
889
|
disabled={
|
|
@@ -44,13 +44,10 @@ export const WrapBusinessInfo = styled.TouchableOpacity`
|
|
|
44
44
|
|
|
45
45
|
export const TitleWrapper = styled.View`
|
|
46
46
|
width: 100%;
|
|
47
|
-
flex-direction:
|
|
48
|
-
align-items: center;
|
|
49
|
-
justify-content: space-between;
|
|
47
|
+
flex-direction: column;
|
|
50
48
|
`
|
|
51
49
|
|
|
52
50
|
export const RibbonBox = styled.View`
|
|
53
|
-
margin-left: 5px;
|
|
54
51
|
background-color: ${(props: any) => props.theme.colors.primary};
|
|
55
52
|
padding: 2px 8px;
|
|
56
53
|
max-width: 180px;
|
|
@@ -188,13 +188,15 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
|
|
|
188
188
|
setOpenUpselling(false)
|
|
189
189
|
setCanOpenUpselling(false)
|
|
190
190
|
const cartsAvailable: any = Object.values(orderState?.carts)?.filter((cart: any) => cart?.valid && cart?.status !== 2)
|
|
191
|
-
if (cartsAvailable.length === 1) {
|
|
191
|
+
if (cartsAvailable.length === 1 || !isCheckoutMultiBusinessEnabled) {
|
|
192
|
+
const cart = isCheckoutMultiBusinessEnabled ? cartsAvailable[0] : currentCart
|
|
193
|
+
|
|
192
194
|
props.onNavigationRedirect('CheckoutNavigator', {
|
|
193
195
|
screen: 'CheckoutPage',
|
|
194
|
-
cartUuid:
|
|
195
|
-
businessLogo:
|
|
196
|
-
businessName:
|
|
197
|
-
cartTotal:
|
|
196
|
+
cartUuid: cart?.uuid,
|
|
197
|
+
businessLogo: cart?.business?.logo,
|
|
198
|
+
businessName: cart?.business?.name,
|
|
199
|
+
cartTotal: cart?.total
|
|
198
200
|
})
|
|
199
201
|
} else {
|
|
200
202
|
const groupKeys: any = {}
|
|
@@ -171,7 +171,7 @@ const MessagesUI = (props: MessagesParams) => {
|
|
|
171
171
|
image: message.source,
|
|
172
172
|
system: message.type === 1,
|
|
173
173
|
user: {
|
|
174
|
-
_id: message.author && message.author.id
|
|
174
|
+
_id: message.author && message.author.id,
|
|
175
175
|
name: message.author && message.author.name,
|
|
176
176
|
avatar: message.author && (message.author.id !== user.id && type === USER_TYPE.DRIVER ? order?.driver?.photo : order?.business?.logo)
|
|
177
177
|
}
|
|
@@ -242,6 +242,7 @@ const MessagesUI = (props: MessagesParams) => {
|
|
|
242
242
|
|
|
243
243
|
const renderAccessory = () => {
|
|
244
244
|
return (
|
|
245
|
+
!chatDisabled &&
|
|
245
246
|
<QuickMessageContainer
|
|
246
247
|
style={{
|
|
247
248
|
marginLeft: 10,
|
|
@@ -256,7 +256,7 @@ const MomentOptionUI = (props: MomentOptionParams) => {
|
|
|
256
256
|
setDateWhitelist([{ start: _minDate, end: _maxDate }])
|
|
257
257
|
}
|
|
258
258
|
}
|
|
259
|
-
}, [JSON.stringify(datesList), preorderMinimumDays, preorderMaximumDays])
|
|
259
|
+
}, [JSON.stringify(datesList), preorderMinimumDays, preorderMaximumDays, cateringPreorder])
|
|
260
260
|
|
|
261
261
|
useEffect(() => {
|
|
262
262
|
if (dateSelected) {
|
|
@@ -321,7 +321,7 @@ const MomentOptionUI = (props: MomentOptionParams) => {
|
|
|
321
321
|
}
|
|
322
322
|
}))
|
|
323
323
|
}
|
|
324
|
-
}, [dateSelected, JSON.stringify(hoursList), JSON.stringify(datesWhitelist), cateringPreorder])
|
|
324
|
+
}, [dateSelected, JSON.stringify(hoursList), JSON.stringify(datesWhitelist), cateringPreorder, JSON.stringify(business)])
|
|
325
325
|
|
|
326
326
|
return (
|
|
327
327
|
<>
|
|
@@ -385,12 +385,12 @@ const MomentOptionUI = (props: MomentOptionParams) => {
|
|
|
385
385
|
</WrapSelectOption>
|
|
386
386
|
{optionSelected.isSchedule && (
|
|
387
387
|
<OrderTimeWrapper>
|
|
388
|
-
{datesWhitelist?.
|
|
388
|
+
{datesWhitelist[0]?.start === datesWhitelist[0]?.end && (
|
|
389
389
|
<OText>
|
|
390
390
|
{moment(selectDate).format('Do MMMM, YYYY')}
|
|
391
391
|
</OText>
|
|
392
392
|
)}
|
|
393
|
-
{datesWhitelist
|
|
393
|
+
{datesWhitelist[0]?.start !== datesWhitelist[0]?.end && (
|
|
394
394
|
<View style={{ flex: 1 }}>
|
|
395
395
|
{selectDate && datesWhitelist[0]?.start !== null && (
|
|
396
396
|
<CalendarStrip
|
|
@@ -466,7 +466,7 @@ const MomentOptionUI = (props: MomentOptionParams) => {
|
|
|
466
466
|
</View>
|
|
467
467
|
<Spinner visible={momentState.isLoading === 1} />
|
|
468
468
|
</Container>
|
|
469
|
-
{!isCart && (
|
|
469
|
+
{!isCart && !cateringPreorder && (
|
|
470
470
|
<View style={{ position: 'absolute', bottom: bottom, paddingBottom: 20, paddingHorizontal: 40, backgroundColor: 'white', width: '100%' }}>
|
|
471
471
|
<OButton onClick={() => handleChangeMoment()} isDisabled={!selectedTime} text={t('CONTINUE', 'Continue')} style={{ borderRadius: 7.6, height: 44, shadowOpacity: 0 }} textStyle={{ color: 'white', fontSize: 14 }} showNextIcon />
|
|
472
472
|
</View>
|
|
@@ -279,6 +279,7 @@ const MultiCheckoutUI = (props: any) => {
|
|
|
279
279
|
hideDeliveryFee={configs?.multi_business_checkout_show_combined_delivery_fee?.value === '1'}
|
|
280
280
|
hideDriverTip={configs?.multi_business_checkout_show_combined_driver_tip?.value === '1'}
|
|
281
281
|
onNavigationRedirect={(route: string, params: any) => props.navigation.navigate(route, params)}
|
|
282
|
+
businessConfigs={cart?.business?.configs}
|
|
282
283
|
/>
|
|
283
284
|
{openCarts.length > 1 && (
|
|
284
285
|
<View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100, marginTop: 13, marginHorizontal: -40 }} />
|
|
@@ -1009,7 +1009,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
|
|
|
1009
1009
|
<OText>
|
|
1010
1010
|
{event?.wallet_event
|
|
1011
1011
|
? walletName[event?.wallet_event?.wallet?.type]?.name
|
|
1012
|
-
: event?.paymethod?.name}
|
|
1012
|
+
: t(event?.paymethod?.name.toUpperCase()?.replace(/ /g, '_'), event?.paymethod?.name)}
|
|
1013
1013
|
</OText>
|
|
1014
1014
|
{event?.data?.charge_id && (
|
|
1015
1015
|
<OText>
|
|
@@ -27,7 +27,7 @@ const StyledButton = styled.View<Props>`
|
|
|
27
27
|
padding-left: 20px;
|
|
28
28
|
padding-right: 20px;
|
|
29
29
|
position: relative;
|
|
30
|
-
${(props
|
|
30
|
+
${(props: any) => props?.theme?.general?.components?.buttons?.borderRadius && css`
|
|
31
31
|
border-radius: ${props?.theme?.general?.components?.buttons?.borderRadius}px;
|
|
32
32
|
`}
|
|
33
33
|
`
|
|
@@ -119,7 +119,7 @@ const OButton = (props: Props): React.ReactElement => {
|
|
|
119
119
|
style={{ width: props.isCircle ? 52 : props.style?.width, ...props.parentStyle }}
|
|
120
120
|
disabled={props.isDisabledWithSameStyles}
|
|
121
121
|
>
|
|
122
|
-
<StyledButton style={props.bgColor ? { ...props.style, backgroundColor: props.bgColor, borderColor: props.borderColor, borderRadius: theme?.general?.components?.buttons?.borderRadius || props.style?.borderRadius} : {...props.style, borderRadius: theme?.general?.components?.buttons?.borderRadius || props.style?.borderRadius}}>
|
|
122
|
+
<StyledButton style={props.bgColor ? { ...props.style, backgroundColor: props.bgColor, borderColor: props.borderColor, borderRadius: parseInt(theme?.general?.components?.buttons?.borderRadius) || props.style?.borderRadius } : { ...props.style, borderRadius: parseInt(theme?.general?.components?.buttons?.borderRadius) || props.style?.borderRadius }}>
|
|
123
123
|
{props.icon ? (
|
|
124
124
|
<props.icon {...props.iconProps} />
|
|
125
125
|
) : null}
|