diy-template-components 0.2.69 → 0.2.71

package/build/index.es.js

@@ -2068,7 +2068,9 @@ function PageRenderer$1({
   isTutorWebsite = false,
   extraProps,
   hideLogin,
-  isCustomWebsite
+  isCustomWebsite,
+  countryCode,
+  currencySymbol
 }) {
   const theme = useMemo(() => getTheme(color, font), [color, font]);
   const navList = header?.navs;
@@ -2089,8 +2091,10 @@ function PageRenderer$1({
     extraProps,
     hideLogin,
     isCustomWebsite,
-    _id
-  }), [isMobile, isLandingPages, layout, baseURLs, hashToken, isPreview, isEdit, templateId, navList, isMasterTemplate, basePath, validations, isTutorWebsite, extraProps, hideLogin, _id]);
+    _id,
+    countryCode,
+    currencySymbol
+  }), [isMobile, isLandingPages, layout, baseURLs, hashToken, isPreview, isEdit, templateId, navList, isMasterTemplate, basePath, validations, isTutorWebsite, extraProps, hideLogin, _id, countryCode, currencySymbol]);
   const Wrapper = SectionWrapper || Fragment;
   return /*#__PURE__*/React.createElement(ThemeProvider, {
     theme: theme
@@ -2853,7 +2857,7 @@ const useSectionStyles$6 = createUseStyles(theme => ({
     // paddingBottom: '35rem',
     paddingBottom: ({
       isCustomWebsite
-    }) => isCustomWebsite ? '45%' : 'unset',
+    }) => isCustomWebsite ? '55%' : 'unset',
     backgroundSize: 'cover',
     backgroundPosition: 'center center'
   },
@@ -5646,8 +5650,61 @@ function getShortenedSubstring(name, length, allowDots = true) {
   return '';
 }
 
+const formatCurrency = (countryCode, value, currencySymbol) => {
+  let formattedValue = Number(value);
+  const getFormattedValue = (countryCode, currencySymbol, value) => {
+    return new Intl.NumberFormat(countryCode, {
+      // style: "currency",
+      // currency: currency,
+      minimumFractionDigits: 0,
+      maximumFractionDigits: 0
+    }).format(value);
+  };
+  const getFormattedFractionValue = (countryCode, currencySymbol, value) => {
+    return new Intl.NumberFormat(countryCode, {
+      minimumFractionDigits: 2,
+      maximumFractionDigits: 2
+    }).format(value);
+  };
+  let func = getFormattedValue;
+  if (countryCode === 'IN' || countryCode === 'SG') {
+    if (value % 1 !== 0) {
+      func = getFormattedFractionValue;
+    }
+  }
+
+  // India
+  if (countryCode === 'IN') {
+    formattedValue = `₹ ${func('en-IN', 'INR', value)}`;
+  }
+  // Vietnam
+  else if (countryCode === 'VI' || countryCode === 'VN') {
+    if (currencySymbol === '$') {
+      formattedValue = `$ ${func('en-US', 'USD', value)}`;
+    } else {
+      formattedValue = `${func('vi-VN', 'VND', value)} đ`;
+      formattedValue = formattedValue.replace(/[.]/g, ',');
+    }
+  }
+  // South Korea
+  else if (countryCode === 'KR') {
+    if (currencySymbol === '$') {
+      formattedValue = `$ ${func('en-US', 'USD', value)}`;
+    } else {
+      formattedValue = `${func('ko-KR', 'KRW', value)} 원`;
+    }
+  }
+  // Singapore
+  else if (countryCode === 'SG') {
+    formattedValue = `S$ ${func('en-SG', 'SGD', value)}`;
+  }
+  return formattedValue;
+};
+
 function CourseCard({
-  card
+  card,
+  countryCode,
+  currencySymbol
 }) {
   const classes = useCourseStyles();
   const {
@@ -5655,6 +5712,10 @@ function CourseCard({
   } = useContext(PageContext);
   const discount = parseInt((card?.price - card?.finalPrice) / card?.price * 100).toFixed(2);
   const defaultCardImg = 'https://cp-assets-public.s3.ap-south-1.amazonaws.com/cams/cards-icon/default_course.png';
+  const price = formatCurrency(countryCode, card?.price, currencySymbol);
+  const finalPrice = formatCurrency(countryCode, card?.finalPrice, currencySymbol);
+  const buyNowText = countryCode === 'KR' ? '이 강좌를 수강하세요.' : 'Buy Now';
+  const offText = countryCode === 'KR' ? '할인' : 'OFF';
   return /*#__PURE__*/React.createElement("div", {
     className: classes.singleCard
   }, /*#__PURE__*/React.createElement("div", {
@@ -5689,14 +5750,14 @@ function CourseCard({
     className: classes.courseCardPriceContainer
   }, /*#__PURE__*/React.createElement("div", {
     className: classes.courseCardPrice
-  }, '₹', card?.finalPrice), card?.price !== card?.finalPrice ? /*#__PURE__*/React.createElement("div", {
+  }, finalPrice), card?.price !== card?.finalPrice ? /*#__PURE__*/React.createElement("div", {
     className: classes.courseCardStrikePrice
-  }, /*#__PURE__*/React.createElement("span", null, '₹', card?.price), ' ', discount > 0 && discount + '% OFF') : null), /*#__PURE__*/React.createElement("a", {
+  }, /*#__PURE__*/React.createElement("span", null, price), " ", discount > 0 && discount + `% ${offText}`) : null), /*#__PURE__*/React.createElement("a", {
     className: classes.coursesAnchorTag,
     href: isEdit ? null : card?.shareableLink
   }, /*#__PURE__*/React.createElement("div", {
     className: classes.courseCardBuyBtn
-  }, "Buy Now")))));
+  }, buyNowText)))));
 }
 
 function courses({
@@ -5710,7 +5771,9 @@ function courses({
     baseURLs,
     hashToken,
     isMasterTemplate,
-    isEdit
+    isEdit,
+    countryCode,
+    currencySymbol
   } = useContext(PageContext);
   const [cardList, setCardList] = useState(null);
   const [errored, setErrored] = useState(false);
@@ -5800,7 +5863,9 @@ function courses({
     }
   })), !showShimmer ? /*#__PURE__*/React.createElement(Wrapper, wrapperProps, cardList != null ? cardList?.map((card, index) => /*#__PURE__*/React.createElement(CourseCard, {
     key: index,
-    card: card
+    card: card,
+    countryCode: countryCode,
+    currencySymbol: currencySymbol
   })) : fallBackImages?.map((dt, ind) => {
     return /*#__PURE__*/React.createElement(Fragment, {
       key: ind
@@ -8827,6 +8892,8 @@ function PageRenderer({
   SectionWrapper,
   isMasterTemplate,
   basePath,
+  countryCode,
+  currencySymbol,
   isPreview,
   isEdit,
   sectionPlaceholder,
@@ -8854,8 +8921,10 @@ function PageRenderer({
     extraProps,
     hideLogin,
     isCustomWebsite,
-    _id
-  }), [isMobile, isLandingPages, layout, baseURLs, hashToken, isPreview, isEdit, templateId, navList, isMasterTemplate, basePath, validations, isTutorWebsite, extraProps, hideLogin, _id]);
+    _id,
+    countryCode,
+    currencySymbol
+  }), [isMobile, isLandingPages, layout, baseURLs, hashToken, isPreview, isEdit, templateId, navList, isMasterTemplate, basePath, validations, isTutorWebsite, extraProps, hideLogin, _id, countryCode, currencySymbol]);
   const Wrapper = SectionWrapper || Fragment;
   return /*#__PURE__*/React.createElement(ThemeProvider, {
     theme: theme