@whatmore-repo/whatmore-reactnative-sdk 1.0.35 → 1.0.37

package/package.json

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

package/src/components/EventShoppingOverlay.js

@@ -4,6 +4,7 @@ import { getGlobalState, setGlobalState, useGlobalState } from '../globals/useAp
 import AppMuteUnmuteIcon from './commons/AppMuteUnmuteIcon.js';
 import ProductTileV1 from './product-tiles/ProductTileV1.js';
 import CrossIcon from '../icons/icon-components/CloseIcon.jsx';
+import Swiper from 'react-native-swiper'
 
 export default function EventShoppingOverlay(props) {
     var event = props.event;
@@ -33,7 +34,6 @@ export default function EventShoppingOverlay(props) {
             <View
                 style={{
                     width: '100%',
-                    height: 'auto',
                     flex: 1,
                     flexDirection: 'column',
                     justifyContent: 'space-between', alignItems: 'center', backgroundColor: 'transparent'
@@ -42,35 +42,32 @@ export default function EventShoppingOverlay(props) {
                 <TouchableOpacity
                     style={{
                         width: '100%',
-                        height: 'auto',
-                        flex: 1,
-                        flexDirection: 'row',
-                        justifyContent: 'center', alignItems: 'center', backgroundColor: 'transparent'
+                        flex: 1
                     }}
                     onPress={() => {
                         setGlobalState("isAppMuted", getGlobalState("isAppMuted") ? false : true);
                     }}
                 >
                 </TouchableOpacity>
-                <View
-                    // add style here to make it horizontally scrollable 
+                <View 
                     style={{
-                        width: '100%', height: 'auto',
-                        flexDirection: 'row', justifyContent: 'space-around', alignItems: 'center',
-                        paddingLeft: 10, paddingRight: 10, paddingBottom: 10
+                        height: 180,                        
+                        paddingLeft: 10, 
+                        paddingRight: 10, 
+                        paddingBottom: 10
                     }}
-                >
-                    {
-                        event.products.map((product, index) => {
-                            return (
-                                index == 0 && <ProductTileV1 setIsModalOpen={props.setIsModalOpen} key={index} onAction={props.onAction} event={event} product={product} />
-                            );
-                        })
-                    }
+                > 
+                    <Swiper 
+                        scrollViewProps={{
+                            scrollEventThrottle: 1
+                        }}
+                        autoplay={true} autoplayTimeout={4} index={0} horizontal={true} loop={false} showsPagination={false} >
+                        {event.products.map((product, index) => (
+                           <ProductTileV1 setIsModalOpen={props.setIsModalOpen} key={index} onAction={props.onAction} event={event} product={product} />
+                        ))}
+                    </Swiper>
                 </View>
             </View>
-
-
         </View>
     );
 

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

@@ -59,13 +59,13 @@ export default function ProductTileV1(props) {
                 duration={100} iterationCount={1}
                 easing="ease-out"
                 style={{
-                    width: '90%', // Adjust width as needed, e.g., '80%'
+                    width: '85%', // 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},
-                    shadowRadius: 20, elevation: 10
+                    shadowRadius: 20, elevation: 2
                 }}
             >
             <View
@@ -133,7 +133,7 @@ export default function ProductTileV1(props) {
 
                 <View style={{ flexDirection: 'row', width: '100%', justifyContent: 'center', alignItems: 'center'}}>
                     <ShopNow
-                        height={PRODUCT_TILE_TOTAL_HEIGHT * 0.3}
+                        height={PRODUCT_TILE_TOTAL_HEIGHT * 0.28}
                         fontSize={BASE_FONT_SIZE}
                         fontFamily={fontFamily}
                     />

package/src/utils/PriceUtils.js

@@ -1,5 +1,6 @@
 
 import getSymbolFromCurrency from 'currency-symbol-map'
+import { getGlobalState } from '../globals/useAppState_APP';
 
 function priceWithCommas(price){
     return price.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
@@ -23,6 +24,8 @@ export function getPriceStringWithCurrency(price, spaceString = "", currencyCode
     if(!price || typeof price == undefined){
         return "";
     }
+    const whatmoreShopId = getGlobalState('whatmoreShopId')
+    const finalCurrency = whatmoreShopId == "68234805419" ? "QAR": getSymbolFromCurrency(currencyCode ?? "INR")
 
-    return getSymbolFromCurrency(currencyCode ?? "INR") + spaceString + priceWithCommas(roundedPrice(price));
+    return finalCurrency + spaceString + priceWithCommas(roundedPrice(price));
 }