ordering-ui-react-native 0.15.38 → 0.15.41

package/package.json

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

package/themes/original/index.tsx

@@ -60,6 +60,7 @@ import {
 	OAlert,
 	OModal,
 	OBottomPopup,
+  HeaderTitle
 } from './src/components/shared';
 
 import { Container } from './src/layouts/Container';
@@ -134,6 +135,7 @@ export {
 	OAlert,
 	OModal,
 	OBottomPopup,
+  HeaderTitle,
 
 	// layout
 	Container,

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

@@ -108,6 +108,9 @@ const AddressFormUI = (props: AddressFormParams) => {
 			top: 12,
 			zIndex: 1002,
 		},
+		wrapperNavbar: Platform.OS === 'ios'
+			? {  paddingVertical: 0, paddingHorizontal: 40 }
+			: {  paddingVertical: 20, paddingHorizontal: 40 }
 	});
 
 	const [, t] = useLanguage();
@@ -500,16 +503,18 @@ const AddressFormUI = (props: AddressFormParams) => {
 			keyboardShouldPersistTaps='always'
 			listViewDisplayed={false}
 		>
-			<NavBar
-				title={t('WHERE_DO_WE_DELIVERY', 'Where do we delivery?')}
-				titleAlign={'center'}
-				onActionLeft={goToBack}
-				showCall={false}
-				paddingTop={20}
-				btnStyle={{ paddingLeft: 40 }}
-				titleStyle={{ fontSize: 14 }}
-				titleWrapStyle={{ paddingHorizontal: 0 }}
-			/>
+			<View style={styles.wrapperNavbar}>
+				<NavBar
+					title={t('WHERE_DO_WE_DELIVERY', 'Where do we delivery?')}
+					titleAlign={'center'}
+					onActionLeft={goToBack}
+					showCall={false}
+					btnStyle={{ paddingLeft: 0 }}
+					style={{ flexDirection: 'column', alignItems: 'flex-start' }}
+					titleWrapStyle={{ paddingHorizontal: 0 }}
+					titleStyle={{ marginRight: 0, marginLeft: 0 }}
+				/>
+			</View>
 			<TouchableWithoutFeedback onPress={Keyboard.dismiss}>
 				<AddressFormContainer style={{ height: 600, overflow: 'scroll' }}>
 					<View>

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

@@ -1,7 +1,7 @@
 import React, { useEffect } from 'react'
 import { AddressList as AddressListController, useLanguage, useOrder, useSession } from 'ordering-components/native'
 import { AddressListContainer, AddressItem } from './styles'
-import { StyleSheet, View } from 'react-native'
+import { Platform, StyleSheet, View } from 'react-native'
 import { OButton, OText, OAlert, OModal, OIcon } from '../shared'
 import { Container } from '../../layouts/Container'
 import { AddressListParams } from '../../types'
@@ -261,6 +261,32 @@ const AddressListUI = (props: AddressListParams) => {
 					)}
 					{!addressList.loading && !addressList.error && (
 						<>
+							{addressList?.addresses?.length === 0 && (
+								<View
+									style={{
+										flexDirection: 'column',
+										paddingHorizontal: 10,
+										paddingTop: 20
+									}}
+								>
+									<OText
+										size={24}
+										lineHeight={36}
+										weight={Platform.OS === 'ios' ? '600' : 'bold'}
+										style={{
+											textAlign: 'center',
+											marginRight: 40,
+											color: theme.colors.textNormal,
+											paddingHorizontal: 0,
+											width: '100%',
+											marginLeft: 0
+										}}
+									>
+										{t('ADDRESS_LIST', 'Address List')}
+									</OText>
+								</View>
+							)}
+
 							<OButton
 								text={t('ADD_NEW_ADDRESS', 'Add new Address')}
 								imgRightSrc=''

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

@@ -45,9 +45,6 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 	const [orderState] = useOrder();
 	const [, t] = useLanguage();
 	const theme = useTheme()
-	const [{ configs }] = useConfig();
-	const isPreOrderSetting = configs?.preorder_status_enabled?.value === '1'
-
 	const styles = StyleSheet.create({
 		headerStyle: {
 			borderTopLeftRadius: 7.6,
@@ -115,7 +112,7 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 	};
 
 	const handleBusinessClick = (selectedBusiness: any) => {
-		if (business?.open || !isPreOrderSetting) handleClick && handleClick(selectedBusiness)
+		if (business?.open) handleClick && handleClick(selectedBusiness)
 		else {
 			navigation.navigate('BusinessPreorder', { business: selectedBusiness, handleBusinessClick: handleClick })
 		}

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

@@ -53,6 +53,7 @@ const BusinessPreorderUI = (props: BusinessPreorderParams) => {
   const [isEnabled, setIsEnabled] = useState(false)
   const { top } = useSafeAreaInsets()
   const showOrderTime = (selectedPreorderType === 1 && Object.keys(menu)?.length > 0) || selectedPreorderType === 0
+  const isPreOrderSetting = configs?.preorder_status_enabled?.value === '1'
   const styles = StyleSheet.create({
     container: {
       height: windowHeight,
@@ -301,60 +302,62 @@ const BusinessPreorderUI = (props: BusinessPreorderParams) => {
             />
           </View>
         </BusinessInfoWrapper>
-        <PreorderTypeWrapper>
-          <OText
-            size={16}
-            style={{
-              fontWeight: '600',
-              lineHeight: 24,
-              marginBottom: 12
-            }}
-          >
-            {t('PREORDER_TYPE', 'Preorder type')}
-          </OText>
-          <SelectDropdown
-            defaultValueByIndex={selectedPreorderType}
-            data={preorderTypeList}
-            // disabled={orderState.loading}
-            onSelect={(selectedItem, index) => {
-              setSelectedPreorderType(index)
-            }}
-            buttonTextAfterSelection={(selectedItem, index) => {
-              return selectedItem.name
-            }}
-            rowTextForSelection={(item, index) => {
-              return item.name
-            }}
-            buttonStyle={styles.selectOption}
-            buttonTextStyle={{
-              color: theme.colors.disabled,
-              fontSize: 14,
-              textAlign: 'left',
-              marginHorizontal: 0
-            }}
-            dropdownStyle={{
-              borderRadius: 8,
-              borderColor: theme.colors.lightGray,
-              marginTop: Platform.OS === 'ios' ? 12 : -top
-            }}
-            rowStyle={{
-              borderBottomColor: theme.colors.backgroundGray100,
-              backgroundColor: theme.colors.backgroundGray100,
-              height: 40,
-              flexDirection: 'column',
-              alignItems: 'flex-start',
-              paddingTop: 8,
-              paddingHorizontal: 14
-            }}
-            rowTextStyle={{
-              color: theme.colors.disabled,
-              fontSize: 14,
-              marginHorizontal: 0
-            }}
-            renderDropdownIcon={() => dropDownIcon()}
-            dropdownOverlayColor='transparent'
-          />
-        </PreorderTypeWrapper>
+        {isPreOrderSetting && (
+          <PreorderTypeWrapper>
+            <OText
+              size={16}
+              style={{
+                fontWeight: '600',
+                lineHeight: 24,
+                marginBottom: 12
+              }}
+            >
+              {t('PREORDER_TYPE', 'Preorder type')}
+            </OText>
+            <SelectDropdown
+              defaultValueByIndex={selectedPreorderType}
+              data={preorderTypeList}
+              // disabled={orderState.loading}
+              onSelect={(selectedItem, index) => {
+                setSelectedPreorderType(index)
+              }}
+              buttonTextAfterSelection={(selectedItem, index) => {
+                return selectedItem.name
+              }}
+              rowTextForSelection={(item, index) => {
+                return item.name
+              }}
+              buttonStyle={styles.selectOption}
+              buttonTextStyle={{
+                color: theme.colors.disabled,
+                fontSize: 14,
+                textAlign: 'left',
+                marginHorizontal: 0
+              }}
+              dropdownStyle={{
+                borderRadius: 8,
+                borderColor: theme.colors.lightGray,
+                marginTop: Platform.OS === 'ios' ? 12 : -top
+              }}
+              rowStyle={{
+                borderBottomColor: theme.colors.backgroundGray100,
+                backgroundColor: theme.colors.backgroundGray100,
+                height: 40,
+                flexDirection: 'column',
+                alignItems: 'flex-start',
+                paddingTop: 8,
+                paddingHorizontal: 14
+              }}
+              rowTextStyle={{
+                color: theme.colors.disabled,
+                fontSize: 14,
+                marginHorizontal: 0
+              }}
+              renderDropdownIcon={() => dropDownIcon()}
+              dropdownOverlayColor='transparent'
+            />
+          </PreorderTypeWrapper>
+        )}
         {selectedPreorderType === 1 && (
           <MenuWrapper>
             <OText
@@ -374,7 +377,7 @@ const BusinessPreorderUI = (props: BusinessPreorderParams) => {
             />
           </MenuWrapper>
         )}
-        {showOrderTime && (
+        {isPreOrderSetting && (
           <OrderTimeWrapper>
             <OText
               size={16}
@@ -448,6 +451,20 @@ const BusinessPreorderUI = (props: BusinessPreorderParams) => {
             </TimeListWrapper>
           </OrderTimeWrapper>
         )}
+        {!isPreOrderSetting && (
+          <OText
+            size={16}
+            style={{
+              fontWeight: '600',
+              lineHeight: 24,
+              marginTop: 30,
+              marginBottom: 12,
+              textAlign: 'center'
+            }}
+            >
+            {t('ERROR_ADD_PRODUCT_BUSINESS_CLOSED', 'The business is closed at the moment')}
+          </OText>
+        )}
         <OButton
           text={t('GO_TO_MENU', 'Go to menu')}
           textStyle={{ color: 'white' }}

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

@@ -111,7 +111,7 @@ const BusinessProductsCategoriesUI = (props: any) => {
 				categories.length &&
 				categories.map((category: any) => (
 					<Tab
-						key={category.name}
+						key={category.id}
 						onPress={() => handleCategoryScroll(category)}
 						style={[
 							category.id === 'featured' && !featured && styles.featuredStyle,

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

@@ -61,7 +61,6 @@ const BusinessesListingUI = (props: BusinessesListingParams) => {
 		handleChangeSearch,
 		businessId
 	} = props;
-	
 	const theme = useTheme();
 	const isFocused = useIsFocused();
 	const appState = useRef(AppState.currentState)

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

@@ -22,9 +22,9 @@ export const CartContent = (props: any) => {
 		<CCContainer>
 			{isOrderStateCarts && carts?.length > 0 && (
 				<>
-					<OText size={24} lineHeight={36} weight={'600'} style={{ marginBottom: 20 }}>
+					{/* <OText size={24} lineHeight={36} weight={'600'} style={{ marginBottom: 20 }}>
 						{carts.length > 1 ? t('MY_CARTS', 'My Carts') : t('CART', 'Cart')}
-					</OText>
+					</OText> */}
 					{carts.map((cart: any, i: number) => (
 						<CCList key={i} style={{ overflow: 'visible' }}>
 							{cart.products.length > 0 && (

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

@@ -540,6 +540,11 @@ const styles = StyleSheet.create({
 
 export const Messages = (props: MessagesParams) => {
 	const [allMessages, setAllMessages] = useState(props.messages)
+
+	useEffect(() => {
+		setAllMessages(props.messages)
+	}, [props.messages])
+
 	const MessagesProps = {
 		...props,
 		UIComponent: MessagesUI,

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

@@ -1,7 +1,5 @@
-
 import styled, { css } from 'styled-components/native'
 
-
 export const Wrapper = styled.View`
   flex: 1;
   background-color: ${(props: any) => props.theme.colors.white};
@@ -39,4 +37,4 @@ export const MessageTypeItem = styled.View`
   ${({ active }: any) => active && css`
     background-color: ${(props: any) => props.theme.colors.whiteGray};
   `}
-`
+`

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

@@ -136,10 +136,10 @@ const ProfileListUI = (props: ProfileParams) => {
 	}
 
 	return (
-		<View style={{ flex: 1, height: height - top - bottom - 62 }}>
-			<OText size={24} style={{ marginTop: 15, paddingHorizontal: 40 }}>
+		<View style={{ flex: 1, height: height - top - bottom - 62, paddingTop: 20 }}>
+			{/* <OText size={24} style={{ marginTop: 15, paddingHorizontal: 40 }}>
 				{t('PROFILE', 'Profile')}
-			</OText>
+			</OText> */}
 			<CenterView style={styles.pagePadding}>
 				{user?.photo && (
 					<View style={styles.photo}>

package/themes/original/src/components/shared/HeaderTitle.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import OText from './OText';
+
+const HeaderTitle = (props: any) => {
+  const { text, style } = props
+  return (
+    <OText
+      size={24}
+      style={style ?? {
+        marginTop: 30,
+        paddingHorizontal: 40,
+        textTransform: 'capitalize'
+      }}
+    >
+      {text}
+    </OText>
+  )
+}
+
+export default HeaderTitle

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

@@ -11,6 +11,7 @@ import OKeyButton from './OKeyButton'
 import OModal from './OModal'
 import OAlert from './OAlert'
 import OBottomPopup from './OBottomPopup'
+import HeaderTitle from './HeaderTitle'
 
 export {
 	OText,
@@ -26,4 +27,5 @@ export {
 	OAlert,
   	OModal,
 	OBottomPopup,
+  HeaderTitle
 }