ordering-ui-react-native 0.14.29 → 0.14.30-release

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

@@ -74,10 +74,6 @@ export const ChDriverTips = styled(ChPaymethods)``
 
 export const ChCart = styled(ChPaymethods)``
 
-export const WalletPaymentOptionContainer = styled(ChPaymethods)`
-  padding-bottom: 0;
-`
-
 export const ChPlaceOrderBtn = styled.View`
   width: 100%;
   display: flex;
@@ -103,4 +99,4 @@ export const DeliveryOptionItem = styled.View`
   align-items: center;
   flex-direction: row;
   background-color: ${(props : any) => props?.backgroundColor ?? '#fff'};
-`;
+`; 

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

@@ -11,7 +11,8 @@ export const FacebookLogin = (props: any) => {
 	const {
 		handleErrors,
 		handleLoading,
-		handleSuccessFacebookLogin
+		handleSuccessFacebookLogin,
+		notificationState
 	} = props
 
 	const [, t] = useLanguage()
@@ -30,7 +31,14 @@ export const FacebookLogin = (props: any) => {
 
 	const handleLoginClick = async (accessToken: string) => {
 		try {
-			const response = await ordering.users().authFacebook({ access_token: accessToken })
+			const body: any = {
+				access_token: accessToken
+			  }
+			  if (notificationState?.notification_token) {
+				body.notification_token = notificationState.notification_token
+				body.notification_app = notificationState.notification_app
+			  }
+			const response = await ordering.users().authFacebook(body)
 			if (!response.content.error) {
 				if (handleSuccessFacebookLogin) {
 					handleSuccessFacebookLogin(response.content.result)
@@ -38,9 +46,10 @@ export const FacebookLogin = (props: any) => {
 				}
 			} else {
 				handleLoading && handleLoading(false)
+				handleErrors && handleErrors(response.content.result)
 				logoutWithFacebook()
 			}
-		} catch (err) {
+		} catch (err: any) {
 			handleLoading && handleLoading(false)
 			handleErrors && handleErrors(err.message)
 		}
@@ -48,7 +57,7 @@ export const FacebookLogin = (props: any) => {
 
 	const loginWithFacebook = () => {
 		handleLoading && handleLoading(true)
-		LoginManager && LoginManager.logInWithPermissions(['public_profile']).then(
+		LoginManager && LoginManager.logInWithPermissions(['public_profile', 'email']).then(
 			(login: any) => {
 				if (login.isCancelled) {
 					const err = t('LOGIN_WITH_FACEBOOK_CANCELLED', 'Login cancelled')
@@ -58,6 +67,9 @@ export const FacebookLogin = (props: any) => {
 					AccessToken.getCurrentAccessToken().then((data: any) => {
 						const accessToken = data.accessToken.toString();
 						handleLoginClick(accessToken)
+					}).catch((err : any) => {
+						handleErrors && handleErrors(err.message)
+						handleLoading && handleLoading(false)
 					});
 				}
 			},
@@ -68,7 +80,10 @@ export const FacebookLogin = (props: any) => {
 				handleLoading && handleLoading(false)
 				handleErrors && handleErrors(err)
 			},
-		);
+		).catch((err : any) => {
+			handleErrors && handleErrors(err.message)
+			handleLoading && handleLoading(false)
+		});
 	};
 
 	const onPressButton = auth

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

@@ -48,8 +48,8 @@ export const Help = (props: HelpParams) => {
 
       <LastOrdersContainer>
         <OText size={18} weight={600}>{t('LAST_ORDERS', 'Last Orders')}</OText>
-        <LastOrders businessId={props.businessId} onRedirect={onRedirect} />
+        <LastOrders onRedirect={onRedirect} />
       </LastOrdersContainer>
     </>
   )
-}
+}

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

@@ -5,11 +5,11 @@ import { StyleSheet, View } from 'react-native';
 import { OButton, OIcon, OText } from '../shared';
 import { LanguageSelector } from '../LanguageSelector';
 import { TouchableOpacity } from 'react-native-gesture-handler';
-import { useWindowDimensions } from 'react-native';
+import { useWindowDimensions, Platform } from 'react-native';
 
 export const Home = (props: any) => {
 	const { onNavigationRedirect } = props;
-	const { width } = useWindowDimensions();
+	const { width, height } = useWindowDimensions();
 	const [, t] = useLanguage();
 	const [orderState] = useOrder();
 
@@ -18,7 +18,9 @@ export const Home = (props: any) => {
 	return (
 		<View style={styles.container}>
 			<View>
-				<LanguageSelector />
+				<View style={{paddingTop: (height <= 756 && Platform.OS !== 'ios') ? (height * 0.05) : 0 }}>
+					<LanguageSelector />
+				</View>
 				<OIcon
 					src={theme.images.logos.logotypeInvert}
 					style={{

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

@@ -104,15 +104,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
 
   const { order, businessData } = props.order;
 
-  const walletName: any = {
-    cash: {
-      name: t('PAY_WITH_CASH_WALLET', 'Pay with Cash Wallet'),
-    },
-    credit_point: {
-      name: t('PAY_WITH_CREDITS_POINTS_WALLET', 'Pay with Credit Points Wallet'),
-    }
-  }
-
   const getOrderStatus = (s: string) => {
     const status = parseInt(s);
     const orderStatus = [
@@ -611,7 +602,9 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                   <OText size={16} style={{ textAlign: 'left' }} color={theme.colors.textNormal}>
                     {t('DELIVERY_PREFERENCE', 'Delivery Preference')}
                   </OText>
-                  <OText size={12} style={{ textAlign: 'left' }} color={theme.colors.textNormal}>{order?.delivery_option?.name ?? t('EITHER_WAY', 'Either way')}</OText>
+                  <OText size={12} style={{ textAlign: 'left' }} color={theme.colors.textNormal}>
+                    {order?.delivery_option?.name ? t(order?.delivery_option?.name.toUpperCase().replace(/\s/g, '_')) : t('EITHER_WAY', 'Either way')}
+                  </OText>
                 </View>
               )}
               {order?.comment && (
@@ -835,51 +828,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                   </OText>
                 </Table>
               </Total>
-              {order?.payment_events?.length > 0 && (
-                <View style={{marginTop: 10}}>
-                  <OText size={20} weight='bold' color={theme.colors.textNormal}>{t('PAYMENTS', 'Payments')}</OText>
-                  <View
-                    style={{
-                      width: '100%',
-                      marginTop: 10
-                    }}
-                  >
-                    {order?.payment_events?.map((event: any) => (
-                      <View
-                        key={event.id}
-                        style={{
-                          display: 'flex',
-                          flexDirection: 'row',
-                          justifyContent: 'space-between',
-                          alignItems: 'center',
-                          marginBottom: 10
-                        }}
-                      >
-                        <View
-                          style={{
-                            display: 'flex',
-                            flexDirection: 'column',
-                          }}
-                        >
-                          <OText>
-                            {event?.wallet_event
-                              ? walletName[event?.wallet_event?.wallet?.type]?.name
-                              : event?.paymethod?.name}
-                          </OText>
-                          {event?.data?.charge_id && (
-                            <OText>
-                              {`${t('CODE', 'Code')}: ${event?.data?.charge_id}`}
-                            </OText>
-                          )}
-                        </View>
-                        <OText>
-                          -{parsePrice(event.amount)}
-                        </OText>
-                      </View>
-                    ))}
-                  </View>
-                </View>
-              )}
             </OrderBill>
           </OrderContent>
         </>

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

@@ -193,13 +193,13 @@ const OrderProgressUI = (props: any) => {
           </View>
         </View>
       )}
-      {/* {!orderList?.loading && orderList?.orders?.length === 0 && (
+      {!orderList?.loading && orderList?.orders?.length === 0 && (
         <NotFoundSource
           image={imageFails}
           content={t('NO_RESULTS_FOUND', 'Sorry, no results found')}
           conditioned
         />
-      )} */}
+      )}
 		</>
 	)
 }

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

@@ -28,6 +28,7 @@ import { TouchableOpacity } from 'react-native';
 
 const OrderSummaryUI = (props: any) => {
   const {
+    cart,
     changeQuantity,
     getProductMax,
     offsetDisabled,
@@ -75,16 +76,6 @@ const OrderSummaryUI = (props: any) => {
     }
   }
 
-  const cart = orderState?.carts?.[`businessId:${props.cart.business_id}`]
-
-  const walletName: any = {
-    cash: {
-      name: t('PAY_WITH_CASH_WALLET', 'Pay with Cash Wallet'),
-    },
-    credit_point: {
-      name: t('PAY_WITH_CREDITS_POINTS_WALLET', 'Pay with Credit Points Wallet'),
-    }
-  }
 
   return (
     <OSContainer>
@@ -177,14 +168,6 @@ const OrderSummaryUI = (props: any) => {
                   <OText size={12}>{parsePrice(cart?.driver_tip)}</OText>
                 </OSTable>
               )}
-              {cart?.payment_events?.length > 0 && cart?.payment_events?.map((event: any) => (
-                <OSTable key={event.id}>
-                  <OText size={12} numberOfLines={1}>
-                    {walletName[cart?.wallets?.find((wallet: any) => wallet.id === event.wallet_id)?.type]?.name}
-                  </OText>
-                  <OText size={12}>-{parsePrice(event.amount)}</OText>
-                </OSTable>
-              ))}
               {isCouponEnabled && !isCartPending && (
                 <View>
                   <View style={{ paddingVertical: 5 }}>
@@ -202,7 +185,7 @@ const OrderSummaryUI = (props: any) => {
                       {t('TOTAL', 'Total')}
                     </OText>
                     <OText size={14} style={{ fontWeight: 'bold' }} >
-                      {parsePrice(cart?.balance ?? cart?.total)}
+                      {parsePrice(cart?.total)}
                     </OText>
                   </OSTable>
                 </View>
@@ -222,8 +205,7 @@ const OrderSummaryUI = (props: any) => {
                           height: 100,
                           borderColor: theme.colors.border,
                           paddingRight: 50,
-                          marginTop: 10,
-                          borderRadius: 8
+                          marginTop: 10
                         }}
                         multiline
                       />

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

@@ -12,9 +12,6 @@ import { ProductOption } from '../ProductOption';
 import Swiper from 'react-native-swiper'
 import FastImage from 'react-native-fast-image';
 import IconAntDesign from 'react-native-vector-icons/AntDesign';
-import {
-	Grayscale
-} from 'react-native-color-matrix-image-filters'
 
 import { View, TouchableOpacity, StyleSheet, Dimensions, Platform, AppRegistry, I18nManager } from 'react-native';
 
@@ -31,9 +28,7 @@ import {
 	WrapperSubOption,
 	ProductComment,
 	ProductActions,
-	ExtraOptionWrap,
-	WeightUnitSwitch,
-	WeightUnitItem
+	ExtraOptionWrap
 } from './styles';
 import { OButton, OIcon, OInput, OText } from '../shared';
 import { ScrollView } from 'react-native-gesture-handler';
@@ -132,9 +127,6 @@ export const ProductOptionsUI = (props: any) => {
 			height: 32,
 			borderRadius: 16,
 			backgroundColor: 'rgba(208,208,208,0.5)'
-		},
-		unitItem: {
-			fontSize: 12
 		}
 	});
 
@@ -149,12 +141,6 @@ export const ProductOptionsUI = (props: any) => {
 	const { top, bottom } = useSafeAreaInsets();
 	const { height } = useWindowDimensions();
 	const [selOpt, setSelectedOpt] = useState(0);
-	const [isHaveWeight, setIsHaveWeight] = useState(false)
-	const [qtyBy, setQtyBy] = useState({
-		weight_unit: false,
-		pieces: true
-	})
-	const [pricePerWeightUnit, setPricePerWeightUnit] = useState(null)
 
 	const swiperRef: any = useRef(null)
 
@@ -163,12 +149,9 @@ export const ProductOptionsUI = (props: any) => {
 		if (errors[`id:${id}`]) {
 			bgColor = 'rgba(255, 0, 0, 0.05)';
 		}
-		if (maxProductQuantity <= 0) {
+		if (isSoldOut || maxProductQuantity <= 0) {
 			bgColor = 'hsl(0, 0%, 72%)';
 		}
-		if (isSoldOut) {
-			bgColor = theme.colors.white;
-		}
 		return bgColor;
 	};
 
@@ -210,10 +193,6 @@ export const ProductOptionsUI = (props: any) => {
 		navigation.navigate('Login');
 	};
 
-	const handleSwitchQtyUnit = (val: string) => {
-		setQtyBy({ [val]: true, [!val]: false })
-	}
-
 	useEffect(() => {
 		const productImgList: any = []
 		product?.images && productImgList.push(product.images)
@@ -223,11 +202,6 @@ export const ProductOptionsUI = (props: any) => {
 			}
 		}
 		setGallery(productImgList)
-
-		if (product?.weight && product?.weight_unit) {
-			setIsHaveWeight(true)
-			setPricePerWeightUnit(product?.price / product?.weight)
-		}
 	}, [product])
 
 	const saveErrors =
@@ -342,15 +316,13 @@ export const ProductOptionsUI = (props: any) => {
 												style={styles.slide1}
 												key={i}
 											>
-												<Grayscale amount={isSoldOut ? 1 : 0}>
-													<FastImage
-														style={{ height: '100%' }}
-														source={{
-															uri: optimizeImage(img, 'h_258,c_limit'),
-															priority: FastImage.priority.normal,
-														}}
-													/>
-												</Grayscale>
+												<FastImage
+													style={{ height: '100%' }}
+													source={{
+														uri: optimizeImage(img, 'h_258,c_limit'),
+														priority: FastImage.priority.normal,
+													}}
+												/>
 											</View>
 										))}
 									</Swiper>
@@ -374,19 +346,17 @@ export const ProductOptionsUI = (props: any) => {
 														opacity: index === thumbsSwiper ? 1 : 0.8
 													}}
 												>
-													<Grayscale amount={isSoldOut ? 1 : 0}>
-														<OIcon
-															url={img}
-															style={{
-																borderColor: theme.colors.lightGray,
-																borderRadius: 8,
-																minHeight: '100%'
-															}}
-															width={56}
-															height={56}
-															cover
-														/>
-													</Grayscale>
+													<OIcon
+														url={img}
+														style={{
+															borderColor: theme.colors.lightGray,
+															borderRadius: 8,
+															minHeight: '100%'
+														}}
+														width={56}
+														height={56}
+														cover
+													/>
 												</View>
 											</TouchableOpacity>
 
@@ -410,13 +380,30 @@ export const ProductOptionsUI = (props: any) => {
 									</Placeholder>
 								) : (
 									<>
-										<OText
-											size={20}
-											lineHeight={30}
-											weight={'600'}
-											style={{ flex: 1, marginBottom: 5 }}>
-											{product?.name || productCart.name}
-										</OText>
+										<View style={{ flexDirection: 'row' }}>
+											<OText
+												size={20}
+												lineHeight={30}
+												weight={'600'}
+												style={{ flex: 1, marginBottom: 10 }}>
+												{product?.name || productCart.name}
+											</OText>
+											{product?.calories && (
+												<OText size={16} style={{ color: '#808080' }}>{product?.calories} cal
+												</OText>
+											)}
+										</View>
+										<View style={{ flexDirection: 'row', marginBottom: 10 }}>
+											<OText size={16} style={{ flex: I18nManager.isRTL ? 1 : 0 }} color={theme.colors.primary}>{productCart.price ? parsePrice(productCart.price) : ''}</OText>
+											{product?.offer_price && (
+												<OText style={{    fontSize: 14,
+													color: '#808080',
+													textDecorationLine: 'line-through',
+													marginLeft: 7,
+													marginRight: 7
+												}}>{parsePrice(product?.offer_price)}</OText>
+											)}
+										</View>
 										{((product?.sku && product?.sku !== '-1' && product?.sku !== '1') || (product?.estimated_person)) && (
 											<OText size={14} style={{ flex: I18nManager.isRTL ? 1 : 0 }} color={'#909BA9'} mBottom={7}>
 												{
@@ -431,13 +418,9 @@ export const ProductOptionsUI = (props: any) => {
 												}
 											</OText>
 										)}
-										{isHaveWeight ? (
-											<OText size={16} lineHeight={24} color={theme.colors.textNormal}>{parsePrice(pricePerWeightUnit)} / {product?.weight_unit}</OText>
-										) : (
-											<OText size={16} lineHeight={24} color={theme.colors.textNormal}>
-												{productCart.price ? parsePrice(productCart.price) : ''}
-											</OText>
-										)}
+										<OText size={16} lineHeight={24} color={theme.colors.textNormal}>
+											{productCart.price ? parsePrice(productCart.price) : ''}
+										</OText>
 									</>
 								)}
 							</ProductTitle>
@@ -522,7 +505,13 @@ export const ProductOptionsUI = (props: any) => {
 															{t('INGREDIENTS', 'Ingredients')}
 														</OText>
 													</SectionTitle>
-													<WrapperIngredients>
+													<WrapperIngredients
+														style={{
+															backgroundColor:
+																isSoldOut || maxProductQuantity <= 0
+																	? 'hsl(0, 0%, 72%)'
+																	: theme.colors.white,
+														}}>
 														{product?.ingredients.map((ingredient: any) => (
 															<ProductIngredient
 																key={ingredient.id}
@@ -531,7 +520,6 @@ export const ProductOptionsUI = (props: any) => {
 																	productCart.ingredients[`id:${ingredient.id}`]
 																}
 																onChange={handleChangeIngredientState}
-																isSoldOut={isSoldOut}
 															/>
 														))}
 													</WrapperIngredients>
@@ -569,7 +557,6 @@ export const ProductOptionsUI = (props: any) => {
 																					return (
 																						<ProductOptionSubOption
 																							key={suboption.id}
-																							isSoldOut={isSoldOut}
 																							onChange={
 																								handleChangeSuboptionState
 																							}
@@ -603,7 +590,13 @@ export const ProductOptionsUI = (props: any) => {
 															{t('INGREDIENTS', 'Ingredients')}
 														</OText>
 													</SectionTitle>
-													<WrapperIngredients>
+													<WrapperIngredients
+														style={{
+															backgroundColor:
+																isSoldOut || maxProductQuantity <= 0
+																	? 'hsl(0, 0%, 72%)'
+																	: theme.colors.white,
+														}}>
 														{product?.ingredients.map((ingredient: any) => (
 															<ProductIngredient
 																key={ingredient.id}
@@ -612,7 +605,6 @@ export const ProductOptionsUI = (props: any) => {
 																	productCart.ingredients[`id:${ingredient.id}`]
 																}
 																onChange={handleChangeIngredientState}
-																isSoldOut={isSoldOut}
 															/>
 														))}
 													</WrapperIngredients>
@@ -745,10 +737,8 @@ export const ProductOptionsUI = (props: any) => {
 							<OText
 								size={12}
 								lineHeight={18}
-								style={{ minWidth: 29, textAlign: 'center' }}
-							>
-								{qtyBy?.pieces && productCart.quantity}
-								{qtyBy?.weight_unit && productCart.quantity * product?.weight}
+								style={{ minWidth: 29, textAlign: 'center' }}>
+								{productCart.quantity}
 							</OText>
 							<TouchableOpacity
 								onPress={increment}
@@ -769,36 +759,6 @@ export const ProductOptionsUI = (props: any) => {
 									}
 								/>
 							</TouchableOpacity>
-							<WeightUnitSwitch>
-								<TouchableOpacity
-									onPress={() => handleSwitchQtyUnit('pieces')}
-								>
-									<WeightUnitItem active={qtyBy?.pieces}>
-										<OText
-											size={12}
-											lineHeight={18}
-											color={qtyBy?.pieces ? theme.colors.primary : theme.colors.textNormal}
-										>
-											{t('PIECES', 'pieces')}
-										</OText>
-									</WeightUnitItem>
-								</TouchableOpacity>
-								<View style={{ alignItems: 'flex-start' }}>
-									<TouchableOpacity
-										onPress={() => handleSwitchQtyUnit('weight_unit')}
-									>
-										<WeightUnitItem active={qtyBy?.weight_unit}>
-											<OText
-												size={12}
-												lineHeight={18}
-												color={qtyBy?.weight_unit ? theme.colors.primary : theme.colors.textNormal}
-											>
-												{product?.weight_unit}
-											</OText>
-										</WeightUnitItem>
-									</TouchableOpacity>
-								</View>
-							</WeightUnitSwitch>
 						</View>
 					)}
 					<View

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

@@ -78,15 +78,3 @@ export const ProductActions = styled.View`
 export const ExtraOptionWrap = styled.ScrollView`
 	margin-horizontal: -40px;
 `;
-
-export const WeightUnitSwitch = styled.View`
-  margin-left: 10px;
-`
-export const WeightUnitItem = styled.View`
-  padding: 1px 5px;
-  border-radius: 4px;
-  
-  ${({ active }: any) => active && css`
-    background-color: ${(props: any) => props.theme.colors.primary}20;
-  `}
-`

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

@@ -10,19 +10,18 @@ const ProductIngredientUI = (props: any) => {
 	const {
 		state,
 		ingredient,
-		toggleSelect,
-		isSoldOut
+		toggleSelect
 	} = props
 
 	const theme = useTheme();
 
 	return (
-		<Container disabled={isSoldOut} onPress={() => toggleSelect()}>
+		<Container onPress={() => toggleSelect()}>
 			<View>
-				{state?.selected && !isSoldOut ? (
+				{state?.selected ? (
 					<MaterialCommunityIcon name='checkbox-marked' color={theme.colors.primary} size={24} />
 				) : (
-					<MaterialCommunityIcon name='checkbox-blank-outline' color='#cbcbcb' size={24} />
+					<MaterialCommunityIcon name='checkbox-blank-outline' color={theme.colors.backgroundDark} size={24} />
 				)}
 			</View>
 			<OText mLeft={10}>

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

@@ -53,8 +53,8 @@ export const ProductOptionSubOptionUI = (props: any) => {
 	const price = option?.with_half_option && suboption?.half_price && state.position !== 'whole' ? suboption?.half_price : suboption?.price
 
 	return (
-		<Container>
-			<IconControl disabled={disabled} onPress={() => handleSuboptionClick()}>
+		<Container disabled={disabled}>
+			<IconControl onPress={() => handleSuboptionClick()}>
 				{((option?.min === 0 && option?.max === 1) || option?.max > 1) ? (
 					state?.selected ? (
 						<OIcon src={theme.images.general.check_act} color={theme.colors.primary} width={16} />
@@ -75,28 +75,28 @@ export const ProductOptionSubOptionUI = (props: any) => {
 			{showMessage && <OText size={10} mLeft={4} mRight={4} style={{ flex: 1, textAlign: 'center' }} color={theme.colors.primary}>{`${t('OPTIONS_MAX_LIMIT', 'Maximum options to choose')}: ${option?.max}`}</OText>}
 			{option?.allow_suboption_quantity && state?.selected && (
 				<QuantityControl>
-					<Checkbox disabled={disabled || state.quantity === 0} onPress={decrement}>
+					<Checkbox disabled={state.quantity === 0} onPress={decrement}>
 						<OIcon
 							src={theme.images.general.minus}
 							width={16}
-							color={state.quantity === 0 || disabled ? theme.colors.disabled : theme.colors.primary}
+							color={state.quantity === 0 ? theme.colors.disabled : theme.colors.primary}
 						/>
 					</Checkbox>
 					<OText mLeft={5} mRight={5}>
 						{state.quantity}
 					</OText>
-					<Checkbox disabled={disabled || disableIncrement} onPress={increment}>
+					<Checkbox disabled={disableIncrement} onPress={increment}>
 						<OIcon
 							src={theme.images.general.plus}
 							width={16}
-							color={disableIncrement || disabled ? theme.colors.disabled : theme.colors.primary}
+							color={disableIncrement ? theme.colors.disabled : theme.colors.primary}
 						/>
 					</Checkbox>
 				</QuantityControl>
 			)}
 			{option?.with_half_option && state?.selected && (
 				<PositionControl>
-					<Circle disabled={disabled} onPress={() => changePosition('left')}>
+					<Circle onPress={() => changePosition('left')}>
 						<OIcon
 							src={theme.images.general.half_l}
 							color={state.selected && state.position === 'left' ? theme.colors.primary : '#cbcbcb'}
@@ -104,14 +104,14 @@ export const ProductOptionSubOptionUI = (props: any) => {
 							style={styles.inverse}
 						/>
 					</Circle>
-					<Circle disabled={disabled} onPress={() => changePosition('whole')}>
+					<Circle onPress={() => changePosition('whole')}>
 						<OIcon
 							src={theme.images.general.half_f}
 							color={state.selected && state.position === 'whole' ? theme.colors.primary : '#cbcbcb'}
 							width={16}
 						/>
 					</Circle>
-					<Circle disabled={disabled} onPress={() => changePosition('right')}>
+					<Circle onPress={() => changePosition('right')}>
 						<OIcon
 							src={theme.images.general.half_r}
 							color={state.selected && state.position === 'right' ? theme.colors.primary : '#cbcbcb'}