@whatmore-repo/whatmore-reactnative-sdk 1.0.13 → 1.0.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@whatmore-repo/whatmore-reactnative-sdk",
-  "version": "1.0.13",
+  "version": "1.0.15",
   "description": "",
   "private": false,
   "main": "index.js",
@@ -12,9 +12,7 @@
   ],
   "dependencies": {
     "currency-symbol-map": "^5.1.0",
-    "react": "18.2.0",
     "react-hooks-global-state": "^2.1.0",
-    "react-native": "^0.71.13",
     "react-native-animatable": "^1.3.3",
     "react-native-intersection-observer": "^0.0.9",
     "react-native-svg": "^13.10.0",
@@ -24,6 +22,10 @@
   "devDependencies": {
     "@babel/core": "^7.20.0"
   },
+  "peerDependencies": {
+    "react": "^18.2.0",
+    "react-native": "^0.72.1"
+  },
   "author": "Shyam",
   "license": "ISC"
 }

package/src/components/EventShoppingOverlay.js

@@ -6,7 +6,6 @@ import ProductTileV1 from './product-tiles/ProductTileV1.js';
 
 export default function EventShoppingOverlay(props) {
     var event = props.event;
-
     return (
         <View 
             style={{
@@ -61,8 +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} event={event} product={product} />
                             );
                         })
                     }

package/src/components/EventsVerticalSwipeView.js

@@ -5,11 +5,16 @@ import Swiper from 'react-native-swiper'
 import { InView } from 'react-native-intersection-observer'
 import EventShoppingView from './EventShoppingView.js';
 import { setGlobalState } from '../globals/useAppState_APP.js';
+import {handleAction} from '@appmaker-xyz/react-native';
 
 export default function EventsVerticalSwipeView(props) {
     const [modalVisible, setModalVisible] = React.useState(true);
     var events = props.events;
-
+    function customAction(){
+        handleAction({
+            action: "OPEN_WHATMORE_SHOPPABLE"
+        })
+    }
     return (
             <Modal 
                 style={{
@@ -33,6 +38,7 @@ export default function EventsVerticalSwipeView(props) {
                     loadMinimalSize={1}
                     index={props.initialEventIndex}
                     onIndexChanged={(index) => { 
+                        customAction()
                         setGlobalState('verticalSwiperViewActiveIndex', index);
                     }}
 

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

@@ -9,6 +9,7 @@ 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';
 
 export default function ProductTileV1(props) {
     const event = props.event;
@@ -50,13 +51,20 @@ export default function ProductTileV1(props) {
             setProductVariantComparePrice(optionPriceDetails['compare_price']);
         }
     }
-
-
+    function handleClick(){
+        handleAction({
+            action: "OPEN_PRODUCT",
+            params:{
+                productId: 'gid://shopify/Product/' + product.client_product_id
+            }
+        })
+    }
     return (
         <TouchableWithoutFeedback
             onPress={() => {
                 setTileTapAnimate(true);
                 navigateToProductPage(product, brandDomainContext, whatmoreShopId);
+                handleClick();
             }}
         >
             <Animatable.View
@@ -82,7 +90,6 @@ export default function ProductTileV1(props) {
                 style={{
                     width: '100%', height: 'auto',
                     flexDirection: 'column', justifyContent: 'flex-start', alignItems: 'center',
-                    overflow: 'hidden',
                     borderRadius: 5, overflow: 'hidden',
                     shadowColor: 'black', shadowOpacity: 1, shadowOffset: {width: 0, height: 0},
                     shadowRadius: 20, elevation: 10
@@ -106,20 +113,25 @@ export default function ProductTileV1(props) {
 
                 </Image>
                 <View
+
                     style={{
-                        width: 'auto', height: 'auto',
+                        width: '100%', height: 'auto',
+                        maxWidth: '100%',
                         flexDirection: 'column', justifyContent: 'space-between', alignItems: 'flex-start',
-                        paddingLeft: 10, paddingRight: 10
+                        paddingLeft: 10, paddingRight: 10, overflow: 'hidden',flex: 1, flexWrap: 'wrap'
                     }}
                 >
                     <Text
                         numberOfLines={2} 
                         ellipsizeMode='tail'
                         style={{
+                            
                             fontWeight: 'normal',
                             fontFamily: whatmorePrimaryFont,
                             fontSize: BASE_FONT_SIZE * 1,
-                            color: 'black'  
+                            color: 'black',
+                            overflow: 'hidden',
+                            
                         }}
                     >
                     {product.title.toString()}