ordering-ui-react-native 0.15.14 → 0.15.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-react-native",
-  "version": "0.15.14",
+  "version": "0.15.15",
   "description": "Reusable components made in react native",
   "main": "src/index.tsx",
   "author": "ordering.inc",

package/themes/business/src/components/OrdersOption/index.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useState, useRef } from 'react';
 import { View, Pressable, StyleSheet, ScrollView, RefreshControl, Linking, Platform, TextInput } from 'react-native';
-import { useLanguage, useUtils, useToast, ToastType, OrderListGroups } from 'ordering-components/native';
+import { useLanguage, useUtils, useToast, ToastType, OrderListGroups, useConfig } from 'ordering-components/native';
 import SelectDropdown from 'react-native-select-dropdown'
 import { Placeholder, PlaceholderLine, Fade } from 'rn-placeholder';
 import FeatherIcon from 'react-native-vector-icons/Feather';
@@ -400,20 +400,6 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
     setOpenSLASettingModal(false)
   }
 
-  const [settingTimeErrorMessage, setSettingTimeErrorMessage] = useState('')
-
-  const handlSLASettingTime = () => {
-    if (!hour || !minute) {
-      setSettingTimeErrorMessage(t('SLA_SETTING_ERROR', 'Time value is invalid'))
-      return
-    }
-    const _settingTimeSecond = hour * 3600 + minute * 60
-    setSlaSettingTime(_settingTimeSecond)
-    handleClose()
-    showToast(ToastType.Success, t('SLA_SETTING_UPDATED', 'SLAs setting updated'))
-  }
-
-
   useEffect(() => {
     setCurrentFilters(null)
     onFiltered && onFiltered(null)
@@ -859,24 +845,10 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
                       key={i}
                       item={item}
                       last={i + 1 === selectedTabStatus.length}
-                      setHour={setHour}
-                      setMinute={setMinute}
-                      setSettingTimeErrorMessage={setSettingTimeErrorMessage}
                     />
                   ))}
                   <VerticalLine />
                 </DeliveryStatusWrapper>
-                {settingTimeErrorMessage !== '' && (
-                  <OText style={styles.errorMessage}>{settingTimeErrorMessage}</OText>
-                )}
-                <Actions>
-                  <OButton
-                    text={t('ACCEPT', 'Accept')}
-                    textStyle={{ color: 'white', fontSize: 14 }}
-                    onClick={handlSLASettingTime}
-                    style={styles.acceptButtonStyle}
-                  />
-                </Actions>
               </SlaSettingModalContent>
             )}
           </ModalContainer>
@@ -887,7 +859,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 };
 
 export const StatusBlock = (props: any) => {
-  const { item, last, setHour, setMinute, setSettingTimeErrorMessage } = props
+  const { item, last } = props
   const [showTime, setShowTime] = useState(false)
 
   useEffect(() => {
@@ -898,7 +870,7 @@ export const StatusBlock = (props: any) => {
 
   return (
     <StatusItems>
-      <Pressable onPress={() => setShowTime(!showTime)} style={{ marginBottom: 5 }}>
+      <Pressable style={{ marginBottom: 10 }}>
         <ItemHeader>
           <IconWrapper>
             <OIcon
@@ -916,11 +888,7 @@ export const StatusBlock = (props: any) => {
         <OText>{item?.des}</OText>
       </ItemContent>
       {showTime && (
-        <Timer
-          setHour={setHour}
-          setMinute={setMinute}
-          setSettingTimeErrorMessage={setSettingTimeErrorMessage}
-        />
+        <Timer />
       )}
       {last && (
         <OverLine />
@@ -929,47 +897,28 @@ export const StatusBlock = (props: any) => {
   )
 }
 
-export const Timer = (props: any) => {
-  const { setHour, setMinute, setSettingTimeErrorMessage } = props
+export const Timer = () => {
   const [, t] = useLanguage()
   const theme = useTheme()
+  const [{ configs }] = useConfig();
 
   const styles = StyleSheet.create({
-    inputStyle: {
-      paddingHorizontal: 7,
-      paddingVertical: 2,
-      borderRadius: 0,
+    settingTime: {
       fontSize: 14,
+      borderWidth: 1,
+      borderRadius: 7.6,
+      margin: 0,
+      marginRight: 10,
+      paddingHorizontal: 10,
+      paddingTop: 5,
+      borderColor: theme.colors.disabled
     }
   })
 
-  const handleChangeInput = (val: any, type: string) => {
-    setSettingTimeErrorMessage('')
-    if (type === 'hour') {
-      setHour(val)
-    }
-    if (type === 'minute') {
-      setMinute(val)
-    }
-  }
-
   return (
     <TimerInputWrapper>
-      <TextInput
-        placeholder='HH'
-        keyboardType='number-pad'
-        maxLength={2}
-        style={{ ...styles.inputStyle, width: 36 }}
-        onChangeText={hour => handleChangeInput(hour, 'hour')}
-      />
-      <OText color={theme.colors.disabled}>:</OText>
-      <TextInput
-        placeholder='MM'
-        keyboardType='number-pad'
-        maxLength={2}
-        style={{ ...styles.inputStyle, width: 40 }}
-        onChangeText={minute => handleChangeInput(minute, 'minute')}
-      />
+      <OText style={styles.settingTime} color={theme.colors.disabled}>{configs?.order_deadlines_delayed_time?.value}</OText>
+      <OText>{t('MIN', 'min')}</OText>
     </TimerInputWrapper>
   )
 }

package/themes/business/src/components/OrdersOption/styles.tsx

@@ -130,15 +130,12 @@ export const ItemContent = styled.View`
 `
 
 export const TimerInputWrapper = styled.View`
-  border-width: 1px;
-  border-radius: 7.6px;
   color: ${(props: any) => props.theme.colors.disabled};
-  border-color: ${(props: any) => props.theme.colors.disabled};
+  margin-top: 15px;
   margin-left: 30px;
   margin-right: 30px;
   flex-direction: row;
-  align-items: center;
-  width: 80px;
+  align-items: flex-end;
 `
 export const OverLine = styled.View`
   position: absolute;

package/themes/original/src/components/Messages/index.tsx

@@ -97,7 +97,7 @@ const MessagesUI = (props: MessagesParams) => {
 	}
 
 	const handleImagePicker = () => {
-		launchImageLibrary({ mediaType: 'photo', maxHeight: 300, maxWidth: 300, includeBase64: true }, (response: any) => {
+		launchImageLibrary({ mediaType: 'photo', maxHeight: 2048, maxWidth: 2048, includeBase64: true }, (response: any) => {
 			if (response.didCancel) {
 				console.log('User cancelled image picker');
 			} else if (response.errorMessage) {

package/themes/original/src/components/OrderDetails/index.tsx

@@ -594,18 +594,20 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                     {order?.business?.name}
                   </OText>
                   <Icons>
-                    <TouchableOpacity
-                      onPress={() => order?.business?.cellphone &&
-                        Linking.openURL(`tel:${order?.business?.cellphone}`)
-                      }
-                      style={{ paddingEnd: 5 }}
-                    >
-                      <OIcon
-                        src={theme.images.general.phone}
-                        width={16}
-                        color={theme.colors.disabled}
-                      />
-                    </TouchableOpacity>
+                    {!!order?.business?.cellphone && (
+                      <TouchableOpacity
+                        onPress={() => order?.business?.cellphone &&
+                          Linking.openURL(`tel:${order?.business?.cellphone}`)
+                        }
+                        style={{ paddingEnd: 5 }}
+                      >
+                        <OIcon
+                          src={theme.images.general.phone}
+                          width={16}
+                          color={theme.colors.disabled}
+                        />
+                      </TouchableOpacity>
+                    )}
                     <TouchableOpacity
                       style={{ paddingStart: 5 }}
                       onPress={() => handleOpenMessagesForBusiness()}>
@@ -624,13 +626,15 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                   mBottom={2}>
                   {order?.business?.email}
                 </OText>
-                <OText
-                  size={12}
-                  lineHeight={18}
-                  color={theme.colors.textNormal}
-                  mBottom={2}>
-                  {order?.business?.cellphone}
-                </OText>
+                {!!order?.business?.cellphone && (
+                  <OText
+                    size={12}
+                    lineHeight={18}
+                    color={theme.colors.textNormal}
+                    mBottom={2}>
+                    {order?.business?.cellphone}
+                  </OText>
+                )}
                 <OText size={12} lineHeight={18} color={theme.colors.textNormal}>
                   {order?.business?.address}
                 </OText>
@@ -978,7 +982,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                       marginTop: 10
                     }}
                   >
-                    {order?.payment_events?.map((event: any) => (
+                    {order?.payment_events?.map((event: any) => event.amount > 0 && (
                       <View
                         key={event.id}
                         style={{

package/themes/original/src/components/ProductForm/index.tsx

@@ -872,9 +872,13 @@ export const ProductOptionsUI = (props: any) => {
 			</ScrollView>
 			{!loading && !error && product && (
 				<ProductActions ios={Platform?.OS === 'ios'}>
-					<OText size={16} lineHeight={24} weight={'600'}>
-						{productCart.total ? parsePrice(productCart?.total) : ''}
-					</OText>
+					<View>
+						<OText size={16} lineHeight={24} weight={'600'}>
+							{productCart.total ? parsePrice(productCart?.total) : ''}
+						</OText>
+						{product?.minimum_per_order && productCart?.quantity < product?.minimum_per_order && <OText size={12} color={theme.colors?.red}>{t('MOBILE_MINIMUM_TO_ORDER', 'Min. _number_ ').replace('_number_', product?.minimum_per_order)}</OText>}
+						{product?.maximum_per_order && productCart?.quantity > product?.maximum_per_order && <OText size={12} color={theme.colors?.red}>{t('MOBILE_MAXIMUM_TO_ORDER', 'Max. _number_'.replace('_number_', product?.maximum_per_order))}</OText>}
+					</View>
 					{productCart && !isSoldOut && maxProductQuantity > 0 && (
 						<View style={styles.quantityControl}>
 							<TouchableOpacity
@@ -883,6 +887,7 @@ export const ProductOptionsUI = (props: any) => {
 								<OIcon
 									src={theme.images.general.minus}
 									width={16}
+									style={{ borderWidth: 1, borderColor: 'red' }}
 									color={
 										productCart.quantity === 1 || isSoldOut
 											? theme.colors.backgroundGray
@@ -926,6 +931,7 @@ export const ProductOptionsUI = (props: any) => {
 								<OIcon
 									src={theme.images.general.plus}
 									width={16}
+									style={{ borderWidth: 1, borderColor: 'red' }}
 									color={
 										maxProductQuantity <= 0 ||
 											productCart.quantity >= maxProductQuantity ||
@@ -987,14 +993,14 @@ export const ProductOptionsUI = (props: any) => {
 												? t('UPDATE', 'Update')
 												: t('ADD', 'Add')
 										}`}
-									isDisabled={isSoldOut || maxProductQuantity <= 0}
+									isDisabled={isSoldOut || maxProductQuantity <= 0 || productCart?.quantity < product?.minimum_per_order || productCart?.quantity > product?.maximum_per_order}
 									textStyle={{
 										color: saveErrors || isSoldOut || maxProductQuantity <= 0 ? theme.colors.primary : theme.colors.white,
 										fontSize: orderState.loading || editMode ? 10 : 14
 									}}
 									style={{
-										backgroundColor: saveErrors || isSoldOut || maxProductQuantity <= 0 ? theme.colors.lightGray : theme.colors.primary,
-										borderColor: saveErrors || isSoldOut || maxProductQuantity <= 0 ? theme.colors.white : theme.colors.primary,
+										backgroundColor: saveErrors || isSoldOut || maxProductQuantity <= 0 || productCart?.quantity < product?.minimum_per_order || productCart?.quantity > product?.maximum_per_order ? theme.colors.lightGray : theme.colors.primary,
+										borderColor: saveErrors || isSoldOut || maxProductQuantity <= 0 || productCart?.quantity < product?.minimum_per_order || productCart?.quantity > product?.maximum_per_order ? theme.colors.white : theme.colors.primary,
 										opacity: saveErrors || isSoldOut || maxProductQuantity <= 0 ? 0.3 : 1,
 										borderRadius: 7.6,
 										height: 44,