From ccd7d683868d7cd2a3a7b6501b792fa9d3f571c9 Mon Sep 17 00:00:00 2001 From: Jevy Larano <32891190+jrlarano@users.noreply.github.com> Date: Tue, 4 Jun 2024 17:17:14 +0800 Subject: [PATCH] Add price from prefix --- .../components/common/offer-overview.styl | 8 +++++++- .../core-ui/components/common/offer-overview.ts | 16 ++++++++++++++-- lib/kits/core-ui/components/helpers/component.ts | 1 + locales/da_DK.ts | 3 ++- locales/en_US.ts | 3 ++- locales/nb_NO.ts | 3 ++- locales/sv_SE.ts | 3 ++- 7 files changed, 30 insertions(+), 7 deletions(-) diff --git a/lib/kits/core-ui/components/common/offer-overview.styl b/lib/kits/core-ui/components/common/offer-overview.styl index be827b1c..dda3237a 100644 --- a/lib/kits/core-ui/components/common/offer-overview.styl +++ b/lib/kits/core-ui/components/common/offer-overview.styl @@ -188,8 +188,14 @@ font-size 0.8rem .sgn-offer-price - font-size 2.5em + font-size 2.5rem font-weight 500 + display flex + align-items baseline + font-variant-numeric inherit + + .sgn-offer-price-from + font-size 1.25rem .sgn-offer-img padding 1.25rem diff --git a/lib/kits/core-ui/components/common/offer-overview.ts b/lib/kits/core-ui/components/common/offer-overview.ts index 8b6069d8..6fbc468e 100644 --- a/lib/kits/core-ui/components/common/offer-overview.ts +++ b/lib/kits/core-ui/components/common/offer-overview.ts @@ -96,6 +96,9 @@ const defaultTemplateV2 = `\
+ {{#priceFrom}} + {{priceFrom}} + {{/priceFrom}} {{price}}
@@ -166,7 +169,8 @@ const OfferOverview = ({ localeCode: translate('locale_code'), currency: translate('publication_viewer_currency'), addToShoppingList: translate('publication_viewer_add_to_shopping_list'), - visitWebshopLink: translate('publication_viewer_visit_webshop_link') + visitWebshopLink: translate('publication_viewer_visit_webshop_link'), + priceFrom: translate('publication_viewer_offer_price_from') }; const render = async () => { @@ -206,6 +210,7 @@ const OfferOverview = ({ }; const transformProducts = (products) => { + const {localeCode, currency} = translations; const storedPublicationOffers = clientLocalStorage.get('publication-saved-offers') || []; @@ -215,6 +220,7 @@ const OfferOverview = ({ ); return { ...product, + price: formatPrice(product?.price, localeCode, currency), quantity: matchingOffer ? matchingOffer.quantity : 0 }; }); @@ -226,14 +232,20 @@ const OfferOverview = ({ publicationId, products }) => { - const {localeCode, currency} = translations; + const {localeCode, currency, priceFrom} = translations; const {offer: incitoOffer} = await fetchOffer({viewId, publicationId}); offer = incitoOffer; offer.products = transformProducts(products); + const hasPriceFrom = products.some((product, i, arr) => { + if (i === 0) return false; + return product.price !== arr[i - 1].price; + }); + return { ...offer, heading: offer.name, + priceFrom: hasPriceFrom ? priceFrom : '', price: formatPrice( offer?.price, localeCode, diff --git a/lib/kits/core-ui/components/helpers/component.ts b/lib/kits/core-ui/components/helpers/component.ts index a81f58fe..987f1384 100644 --- a/lib/kits/core-ui/components/helpers/component.ts +++ b/lib/kits/core-ui/components/helpers/component.ts @@ -65,6 +65,7 @@ export const formatPrice = (price, localeCode = 'en_US', currency = 'USD') => { }) .format(price) .replace(currency, '') + .replace('kr.', '') .trim(); }; diff --git a/locales/da_DK.ts b/locales/da_DK.ts index ad7a2a62..3e700845 100644 --- a/locales/da_DK.ts +++ b/locales/da_DK.ts @@ -21,5 +21,6 @@ export default { publication_viewer_add_to_shopping_list: 'Tilføj til indkøbsliste', publication_viewer_visit_webshop_link: 'Besøg webshoplink', publication_viewer_upcoming: 'Kommende', - publication_viewer_hotspot_decoration_link: 'Læs mere' + publication_viewer_hotspot_decoration_link: 'Læs mere', + publication_viewer_offer_price_from: 'Fra' }; diff --git a/locales/en_US.ts b/locales/en_US.ts index fbcf186d..6082e90b 100644 --- a/locales/en_US.ts +++ b/locales/en_US.ts @@ -21,5 +21,6 @@ export default { publication_viewer_add_to_shopping_list: 'Add to Shopping List', publication_viewer_visit_webshop_link: 'Visit Webshop Link', publication_viewer_upcoming: 'Upcoming', - publication_viewer_hotspot_decoration_link: 'Read more' + publication_viewer_hotspot_decoration_link: 'Read more', + publication_viewer_offer_price_from: 'From' }; diff --git a/locales/nb_NO.ts b/locales/nb_NO.ts index 7017b70c..45213a3b 100644 --- a/locales/nb_NO.ts +++ b/locales/nb_NO.ts @@ -22,5 +22,6 @@ export default { publication_viewer_add_to_shopping_list: 'Legg til handleliste', publication_viewer_visit_webshop_link: 'Besøk nettbutikklink', publication_viewer_upcoming: 'Påkommende', - publication_viewer_hotspot_decoration_link: 'Les mer' + publication_viewer_hotspot_decoration_link: 'Les mer', + publication_viewer_offer_price_from: 'Fra' }; diff --git a/locales/sv_SE.ts b/locales/sv_SE.ts index c6952c11..0eb4466d 100644 --- a/locales/sv_SE.ts +++ b/locales/sv_SE.ts @@ -21,5 +21,6 @@ export default { publication_viewer_add_to_shopping_list: 'Lägg till inköpslista', publication_viewer_visit_webshop_link: 'Besök webbshoplänk', publication_viewer_upcoming: 'Kommende', - publication_viewer_hotspot_decoration_link: 'Läs mer' + publication_viewer_hotspot_decoration_link: 'Läs mer', + publication_viewer_offer_price_from: 'Från' };