@whatmore-repo/whatmore-reactnative-sdk 1.0.17 → 1.0.19

package/index.js

@@ -24,7 +24,7 @@ export function WhatmoreBase(props){
     // );
 
     return (
-      <WhatmoreRootComponent shopId={props.shopId} />
+      <WhatmoreRootComponent shopId={props.shopId} onAction={props.onAction} />
     );
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@whatmore-repo/whatmore-reactnative-sdk",
-  "version": "1.0.17",
+  "version": "1.0.19",
   "description": "",
   "private": false,
   "main": "index.js",

package/src/components/EventClickComponent.js

@@ -22,7 +22,7 @@ export default function EventClickComponent(props) {
             {
                 modalUsed
                 ?
-                    <EventsVerticalSwipeView events={props.events} initialEventIndex={props.initialEventIndex} />
+                    <EventsVerticalSwipeView events={props.events} onAction={props.onAction} initialEventIndex={props.initialEventIndex} />
                 :
                     <EventsVerticalSwipeViewNoModal events={props.events} initialEventIndex={props.initialEventIndex} />
             }

package/src/components/EventShoppingOverlay.js

@@ -60,7 +60,7 @@ export default function EventShoppingOverlay(props) {
                     {
                         event.products.map((product, index) => {
                             return (
-                                index == 0 && <ProductTileV1 key={index} event={event} product={product} />
+                               index == 0 && <ProductTileV1 key={index} setModalVisible={props.setModalVisible} onAction={props.onAction} event={event} product={product} />
                             );
                         })
                     }

package/src/components/EventShoppingView.js

@@ -29,7 +29,7 @@ export default function EventShoppingView(props) {
                     backgroundColor: 'transparent',
                 }}
             >
-                <EventShoppingOverlay event={event} />
+                <EventShoppingOverlay setModalVisible={props.setModalVisible} event={event} onAction={props.onAction} />
             </View>
         </View>
     );

package/src/components/EventsVerticalSwipeView.js

@@ -48,7 +48,7 @@ export default function EventsVerticalSwipeView(props) {
                                         backgroundColor: 'transparent'
                                     }}
                                 >
-                                    <EventShoppingView event={event} eventIndex={eventIndex}  />
+                                    <EventShoppingView setModalVisible={setModalVisible} onAction={props.onAction} event={event} eventIndex={eventIndex}  />
                                 </View> 
                             )
                         })

package/src/components/WhatmoreRootComponent.js

@@ -84,6 +84,6 @@ export default function WhatmoreRootComponent(props) {
     logEventData && console.log("valid events size : " + data.length);
 
     return (
-        <EventClickComponent events={data} initialEventIndex={0} /> 
+        <EventClickComponent events={data} initialEventIndex={0} onAction={props.onAction} /> 
       );
 }

package/src/components/cta-buttons/AddToCartButton.jsx

@@ -129,7 +129,7 @@ function AddToCartInitialButton(props){
                         color: 'white'
                     }}
                 >
-                     {"SHOP NOW"} 
+                     {"ADD TO CART"} 
                 </Text>
             </View>
         </TouchableOpacity>

package/src/components/cta-buttons/ShopNowButton.jsx

@@ -26,15 +26,15 @@ function ShopNow(props){
             <View 
                 style={{
                     width: '100%',
-                    height: 'auto',
+                    height: '100%',
                     alignItems: 'center',
                     justifyContent: 'center',
-                    paddingVertical: 5
+                    // paddingVertical: 5
                 }}
             >
                 <Text
                     style={{
-                        fontSize: 26,
+                        fontSize: props.fontSize,
                         fontWeight: 'bold',
                         fontFamily: whatmorePrimaryFont,
                         color: 'white'

package/src/components/product-tiles/ProductPriceBadge.js

@@ -28,7 +28,7 @@ export default function ProductPriceBadge(props) {
                     color: color
                 }}
             >
-                {getPriceStringWithCurrency(product.price)}
+                {getPriceStringWithCurrency(product.price, "",product.currency ?? "INR")}
             </Text>
             <Text
                 numberOfLines={1} 
@@ -43,7 +43,7 @@ export default function ProductPriceBadge(props) {
                     fontSize: fontSize
                 }}
             >
-                {getPriceStringWithCurrency(product.compare_price)}
+                {getPriceStringWithCurrency(product.compare_price, "", product.currency ?? "INR")}
             </Text>
             
         </View>

package/src/components/product-tiles/ProductTileV1.js

@@ -1,36 +1,19 @@
-import { getGlobalState, setGlobalState, useGlobalState } from '../../globals/useAppState_APP.js';
+import { getGlobalState } from '../../globals/useAppState_APP.js';
 import { Image, Text} from 'react-native';
 import ProductPriceBadge from './ProductPriceBadge.js';
 
-import React, { useEffect, useRef, useState } from 'react';
-import { View, TouchableOpacity, ScrollView, Dimensions, TouchableWithoutFeedback } from 'react-native';
-import SelectVariantComponent from './SelectVariantComponent';
+import React, { useEffect, useState } from 'react';
+import { View, Dimensions, TouchableWithoutFeedback } from 'react-native';
 import useAddToCartStates from '../../hooks/useAddToCartStates.js';
-import AddToCartButton from '../cta-buttons/AddToCartButton.jsx';
 import * as Animatable from 'react-native-animatable';
-import { navigateToProductPage } from '../../api/navigation-commands/NavigationCommands.js';
-import {handleAction} from '@appmaker-xyz/react-native';
 import ShopNow from '../cta-buttons/ShopNowButton.jsx';
 
 export default function ProductTileV1(props) {
     const event = props.event;
     const product = props.product;
-
-    const [cartState, productVariantOptions, initiateVariantSelection, initiateAtcApiCall, getPriceDetailsFromSelectedOption, initiateAtcCartIconClickAction] = useAddToCartStates(0, product, props.event);
-    const [selectedOptions, setSelectedOptions] = useState(null);
     const [tileTapAnimate, setTileTapAnimate] = useState(false);
-
-    const [productVariantPrice, setProductVariantPrice] = useState(parseFloat(product.price));
-    const [productVariantComparePrice, setProductVariantComparePrice] = useState(parseFloat(product.compare_price));
-
-    const whatmorePrimaryColor = getGlobalState('whatmorePrimaryColor');
     const whatmorePrimaryFont = getGlobalState('whatmorePrimaryFont');
-
-    const brandDomainContext = getGlobalState('brandDomainContext');
-    const whatmoreShopId = getGlobalState('whatmoreShopId');
-
     const PRODUCT_TILE_TOTAL_HEIGHT = Dimensions.get('window').height * 0.2;
-    const SELECT_VARIANT_TILE_HEIGHT_FACTOR = 3.0;
     const BASE_FONT_SIZE = 20;
 
     useEffect(() => {
@@ -41,19 +24,11 @@ export default function ProductTileV1(props) {
         }
     }, [tileTapAnimate]);
 
-    function _updateSelectedOptions(_selectedOptions){
-        setSelectedOptions(_selectedOptions);
-
-        // set price to selected option
-        const optionPriceDetails = getPriceDetailsFromSelectedOption(_selectedOptions);
 
-        if(optionPriceDetails){
-            setProductVariantPrice(optionPriceDetails['price']);
-            setProductVariantComparePrice(optionPriceDetails['compare_price']);
-        }
-    }
     function handleClick(){
-        handleAction({
+       console.log('click')
+       props.setModalVisible(false);
+       props.onAction({
             action: "OPEN_PRODUCT",
             params:{
                 productId: 'gid://shopify/Product/' + product.client_product_id
@@ -64,7 +39,7 @@ export default function ProductTileV1(props) {
         <TouchableWithoutFeedback
             onPress={() => {
                 setTileTapAnimate(true);
-                navigateToProductPage(product, brandDomainContext, whatmoreShopId);
+                // navigateToProductPage(product, brandDomainContext, whatmoreShopId);
                 handleClick();
             }}
         >
@@ -89,7 +64,9 @@ export default function ProductTileV1(props) {
                 duration={100} iterationCount={1}
                 easing="ease-out"
                 style={{
-                    width: '100%', height: 'auto',
+                    width: '90%', // Adjust width as needed, e.g., '80%'
+                    alignSelf: 'center', 
+                     height: 'auto',
                     flexDirection: 'column', justifyContent: 'flex-start', alignItems: 'center',
                     borderRadius: 5, overflow: 'hidden',
                     shadowColor: 'black', shadowOpacity: 1, shadowOffset: {width: 0, height: 0},
@@ -129,7 +106,7 @@ export default function ProductTileV1(props) {
                             
                             fontWeight: 'normal',
                             fontFamily: whatmorePrimaryFont,
-                            fontSize: BASE_FONT_SIZE * 1,
+                            fontSize: BASE_FONT_SIZE * 0.9,
                             color: 'black',
                             overflow: 'hidden',
                             
@@ -144,10 +121,7 @@ export default function ProductTileV1(props) {
                         }}
                     ></View>
 
-                    <ProductPriceBadge product={product} event={event} fontSize={BASE_FONT_SIZE * 1} color={'black'} /> 
-                    {/* <Text>
-                        {product.price.toString()}
-                    </Text> */}
+                    <ProductPriceBadge product={product} event={event} fontSize={BASE_FONT_SIZE * 0.9} color={'black'} /> 
                 </View>
 
 
@@ -156,46 +130,17 @@ export default function ProductTileV1(props) {
             <View 
                 style={{
                     width: '100%', height: 'auto',
-                    backgroundColor: '#ffffffdd',
+                    backgroundColor: '#fff',
                     overflow: 'hidden'
                 }}
             
             >
-                {cartState['state'] === "awaitingVariantSelection" && productVariantOptions &&
-                    <ScrollView
-                        style={{
-                            width: '100%',
-                            height: 'auto',
-                            marginTop: 5,
-                            marginBottom: 10,
-                            maxHeight: PRODUCT_TILE_TOTAL_HEIGHT * SELECT_VARIANT_TILE_HEIGHT_FACTOR
-                        }}
-                    >
-                        <Animatable.View
-                            animation="fadeIn" 
-                            duration={500} iterationCount={1}
-                            easing="ease-in-out"
-                            style={{
-                                height: 'auto', width: '100%'
-                            }}
-                        >
-                            <SelectVariantComponent 
-                                width='100%'
-                                height='auto'
-                                event={event}
-                                product={product}
-                                productVariantOptions={productVariantOptions}
-                                baseFontSize={BASE_FONT_SIZE * 0.9}
-                                onOptionSelected={_updateSelectedOptions}
-                            />
-                        </Animatable.View>
-                    </ScrollView>
-                }
 
                 <View style={{ flexDirection: 'row', width: '100%', justifyContent: 'center', alignItems: 'center'}}>
                     <ShopNow
                         height={PRODUCT_TILE_TOTAL_HEIGHT * 0.3}
                         onClick={handleClick}
+                        fontSize={BASE_FONT_SIZE*1.1}
                     />
                 </View>
             </View>            

package/src/components/video-player/AppVideoPlayer.js

@@ -35,7 +35,7 @@ export default function AppVideoPlayer(props) {
                     right: 0,
                     width: '100%', height: '100%'
                 }}
-                onLoad={handleLoad} // Call handleLoad when video is loaded
+                onLoad={handleLoad}
             />
     </>
     )

package/src/utils/PriceUtils.js

@@ -13,7 +13,7 @@ function roundedPrice(price){
         if(priceAsString.split('.')[0].length >= 4){
             return parseInt(price);
         }
-        return price.toFixed(2);
+        return parseFloat(price)?.toFixed(2);
     }
 
     return parseInt(price);