fix(herbatika): centralize storefront currency pricing

Author: KaiUweCZE

apps/herbatika/src/components/brands/use-brand-listing-controller.ts

@@ -3,7 +3,6 @@
 import { useRegionContext } from "@techsio/storefront-data/shared/region-context";
 import { useQueryStates } from "nuqs";
 import { useEffect, useMemo } from "react";
-import { resolveProductCurrencyCode } from "@/components/category/category-product-utils";
 import { useCategoryFacetItems } from "@/components/category/use-category-facet-items";
 import {
   buildCatalogProductsParams,
@@ -13,6 +12,7 @@ import {
 import { useCatalogProducts } from "@/lib/storefront/catalog-products";
 import { resolveErrorMessage } from "@/lib/storefront/error-utils";
 import { PLP_PAGE_SIZE, plpQueryParsers } from "@/lib/storefront/plp-query-state";
+import { resolveRegionCurrency } from "@/lib/storefront/region-selection";
 import {
   useCatalogListingInteractions,
   useCatalogListingPageBounds,
@@ -26,6 +26,7 @@ export function useBrandListingController({
   brandFacetId,
 }: UseBrandListingControllerProps) {
   const region = useRegionContext();
+  const regionCurrencyCode = resolveRegionCurrency(region);
   const [queryState, setQueryState] = useQueryStates(plpQueryParsers);
   const visibleQueryState = useMemo(
     () => ({
@@ -135,7 +136,7 @@ export function useBrandListingController({
       (catalogQuery.products.length > 0 || catalogQuery.query.isPlaceholderData),
     priceBounds: resolveCatalogPriceBounds(catalogQuery.facets.price),
     products: catalogQuery.products,
-    productsCurrencyCode: resolveProductCurrencyCode(catalogQuery.products),
+    productsCurrencyCode: regionCurrencyCode,
     queryState,
   };
 }

apps/herbatika/src/components/category/category-listing.helpers.ts

@@ -17,46 +17,3 @@ export const resolveCategoryRank = (
 
   return Number.MAX_SAFE_INTEGER;
 };
-
-const asRecord = (value: unknown): Record<string, unknown> | null => {
-  if (value && typeof value === "object" && !Array.isArray(value)) {
-    return value as Record<string, unknown>;
-  }
-
-  return null;
-};
-
-export const resolveProductPriceAmount = (
-  product: HttpTypes.StoreProduct,
-): number | null => {
-  const amount = product.variants?.[0]?.calculated_price?.calculated_amount;
-  return typeof amount === "number" && Number.isFinite(amount) ? amount : null;
-};
-
-export const resolveProductCurrencyCode = (
-  products: HttpTypes.StoreProduct[],
-): string => {
-  for (const product of products) {
-    const code = product.variants?.[0]?.calculated_price?.currency_code;
-    if (typeof code === "string" && code.length === 3) {
-      return code.toUpperCase();
-    }
-  }
-
-  return "EUR";
-};
-
-export const resolveProductInStock = (
-  product: HttpTypes.StoreProduct,
-): boolean => {
-  const metadata = asRecord(product.metadata);
-  const topOffer = asRecord(metadata?.top_offer);
-  const stock = asRecord(topOffer?.stock);
-  const amount = stock?.amount;
-
-  if (typeof amount === "number") {
-    return amount > 0;
-  }
-
-  return true;
-};

apps/herbatika/src/components/category/category-product-utils.ts

@@ -13,12 +13,12 @@ import {
 import {
   normalizeCategoryName,
   resolveCategoryRank,
-  resolveProductCurrencyCode,
 } from "@/components/category/category-product-utils";
 import { useCatalogProducts } from "@/lib/storefront/catalog-products";
 import {
   buildCatalogProductsParams,
   resolveCatalogActiveFilterCount,
+  resolveCatalogPriceBounds,
 } from "@/lib/storefront/catalog-query-state";
 import {
   STOREFRONT_CATEGORY_TREE_FIELDS,
@@ -32,20 +32,7 @@ import {
 } from "@/lib/storefront/plp-query-state";
 import { useCategoryFacetItems } from "@/components/category/use-category-facet-items";
 import { resolveErrorMessage } from "@/lib/storefront/error-utils";
-
-const resolvePriceBounds = (priceFacet: {
-  min: number | null;
-  max: number | null;
-}) => {
-  if (priceFacet.min === null && priceFacet.max === null) {
-    return null;
-  }
-
-  return {
-    min: priceFacet.min ?? 0,
-    max: priceFacet.max ?? priceFacet.min ?? 1,
-  };
-};
+import { resolveRegionCurrency } from "@/lib/storefront/region-selection";
 
 const resolveBreadcrumbItems = (
   slug: string,
@@ -103,6 +90,7 @@ export function useCategoryListingQueries({
   slug,
 }: UseCategoryListingQueriesProps) {
   const region = useRegionContext();
+  const regionCurrencyCode = resolveRegionCurrency(region);
   const categoriesQuery = useCategories({
     page: 1,
     limit: STOREFRONT_CATEGORY_TREE_LIMIT,
@@ -272,9 +260,9 @@ export function useCategoryListingQueries({
       categoriesQuery.isLoading ||
       catalogQuery.isLoading ||
       catalogFacetSeedQuery.isLoading,
-    priceBounds: resolvePriceBounds(catalogQuery.facets.price),
+    priceBounds: resolveCatalogPriceBounds(catalogQuery.facets.price),
     products: catalogQuery.products,
-    productsCurrencyCode: resolveProductCurrencyCode(catalogQuery.products),
+    productsCurrencyCode: regionCurrencyCode,
     showCategoryNotFound:
       !categoriesQuery.isLoading &&
       categoriesQuery.categories.length > 0 &&

apps/herbatika/src/components/category/use-category-listing-queries.ts

@@ -15,10 +15,7 @@ import { resolveErrorMessage } from "@/lib/storefront/error-utils";
 import { resolveFreeShippingThresholdAmount } from "@/lib/storefront/free-shipping";
 import { formatCurrencyAmount } from "@/lib/storefront/price-format";
 import { STOREFRONT_PRODUCT_DETAIL_FIELDS } from "@/lib/storefront/products";
-
-const resolveSupportedCurrency = (currencyCode: string): "EUR" | "CZK" => {
-  return currencyCode.toUpperCase() === "CZK" ? "CZK" : "EUR";
-};
+import { resolveSupportedCurrencyCode } from "@/lib/storefront/currency";
 
 type CheckoutCartStepSectionProps = {
   cartId?: string;
@@ -41,7 +38,7 @@ export function CheckoutCartStepSection({
 
   const isPending =
     updateLineItemMutation.isPending || removeLineItemMutation.isPending;
-  const supportedCurrencyCode = resolveSupportedCurrency(currencyCode);
+  const supportedCurrencyCode = resolveSupportedCurrencyCode(currencyCode);
   const freeShippingThresholdAmount =
     resolveFreeShippingThresholdAmount(supportedCurrencyCode);
   const missingAmount =

apps/herbatika/src/components/checkout/sections/checkout-cart-step-section.tsx

@@ -22,6 +22,8 @@ import {
   resolveEffectiveCheckoutAddressDetails,
 } from "@/lib/forms/checkout/address.form";
 import { resolveErrorMessage } from "@/lib/storefront/error-utils";
+import { resolveSupportedCurrencyCode } from "@/lib/storefront/currency";
+import { resolveRegionCurrency } from "@/lib/storefront/region-selection";
 import { storefront } from "@/lib/storefront/storefront";
 import { resolveHasStoredAddress } from "./checkout-address.utils";
 import { useCheckoutActions } from "./use-checkout-actions";
@@ -30,6 +32,7 @@ import { useCheckoutDetailsForm } from "./use-checkout-details-form";
 export function useCheckoutController() {
   const queryClient = useQueryClient();
   const region = useRegionContext();
+  const regionCurrencyCode = resolveRegionCurrency(region);
   const authQuery = useAuth();
   const [allowCartAutoCreate, setAllowCartAutoCreate] = useState(true);
   const [completedOrderId, setCompletedOrderId] = useState<string | null>(null);
@@ -186,9 +189,10 @@ export function useCheckoutController() {
     return saveAddressSucceededRef.current;
   };
 
-  const currencyCode = useMemo(() => {
-    return (cartQuery.cart?.currency_code ?? "eur").toUpperCase();
-  }, [cartQuery.cart?.currency_code]);
+  const currencyCode = resolveSupportedCurrencyCode(
+    cartQuery.cart?.currency_code,
+    regionCurrencyCode,
+  );
 
   const cartItems = cartQuery.cart?.items ?? [];
   const hasItems = cartQuery.itemCount > 0 || cartItems.length > 0;

apps/herbatika/src/components/checkout/use-checkout-controller.ts

@@ -13,6 +13,7 @@ import type { FocusEvent, FormEvent } from "react";
 import { useState } from "react";
 import { cartReadQueryOptions, useCart } from "@/lib/storefront/cart";
 import { resolveCartTotalAmount } from "@/lib/storefront/cart-calculations";
+import { resolveSupportedCurrencyCode } from "@/lib/storefront/currency";
 import { formatCurrencyAmount } from "@/lib/storefront/price-format";
 import { resolveRegionCurrency } from "@/lib/storefront/region-selection";
 import { HerbatikaAccountPopover } from "./header/herbatika-account-popover";
@@ -57,10 +58,14 @@ export function HerbatikaHeader() {
     },
   );
 
-  const currency = resolveRegionCurrency(region);
+  const regionCurrency = resolveRegionCurrency(region);
+  const cartCurrency = resolveSupportedCurrencyCode(
+    cart?.currency_code,
+    regionCurrency,
+  );
   const cartTotalLabel = formatCurrencyAmount(
     resolveCartTotalAmount(cart),
-    currency,
+    cartCurrency,
   );
 
   const handleSearchSubmit = (event: FormEvent<HTMLFormElement>) => {
@@ -101,7 +106,7 @@ export function HerbatikaHeader() {
         <div className="hidden w-full max-w-search-form flex-1 @header-desktop:block">
           <SearchAutocomplete
             countryCode={region?.country_code}
-            currencyCode={currency}
+            currencyCode={regionCurrency}
             onSubmit={handleSearchSubmit}
             regionId={region?.region_id}
             variant="desktop"
@@ -138,7 +143,7 @@ export function HerbatikaHeader() {
           <HerbatikaCartPopover
             cart={cart}
             cartTotalLabel={cartTotalLabel}
-            currencyCode={currency}
+            currencyCode={cartCurrency}
             itemCount={itemCount}
           />
         </Header.Actions>
@@ -170,7 +175,7 @@ export function HerbatikaHeader() {
       <div className="mx-auto w-full max-w-max-w px-header-lg pb-300 2xl:px-header-2xl @header-desktop:hidden">
         <SearchAutocomplete
           countryCode={region?.country_code}
-          currencyCode={currency}
+          currencyCode={regionCurrency}
           onSubmit={handleSearchSubmit}
           regionId={region?.region_id}
           variant="mobile"

apps/herbatika/src/components/herbatika-header.tsx

@@ -1,10 +1,12 @@
 "use client";
 
 import type { HttpTypes } from "@medusajs/types";
+import { useRegionContext } from "@techsio/storefront-data/shared/region-context";
 import { useEffect, useState } from "react";
 import { PRODUCT_FALLBACK_IMAGE } from "@/components/product-card/product-card.constants";
 import { resolvePriceState } from "@/components/product-card/product-card.pricing";
 import { resolveThumbnail } from "@/components/product-card/product-card.thumbnail";
+import { resolveRegionCurrency } from "@/lib/storefront/region-selection";
 
 export type HerbatikaProductCardBaseProps = {
   product: HttpTypes.StoreProduct;
@@ -16,8 +18,10 @@ export function useHerbatikaProductCardState(
   product: HttpTypes.StoreProduct,
   onImageError?: () => void,
 ) {
+  const region = useRegionContext();
+  const currencyCode = resolveRegionCurrency(region);
   const productHref = product.handle ? `/p/${product.handle}` : "/#";
-  const price = resolvePriceState(product);
+  const price = resolvePriceState(product, currencyCode);
   const thumbnail = resolveThumbnail(product);
   const [imageSrc, setImageSrc] = useState(thumbnail);
   const title = product.title || "Produkt";

apps/herbatika/src/components/herbatika-product-card.shared.ts

@@ -1,65 +1,58 @@
 import type { HttpTypes } from "@medusajs/types";
-import { formatCurrencyAmount } from "@/lib/storefront/price-format";
 import {
   DEFAULT_CURRENCY_CODE,
-  asCurrencyCode,
+  resolveSupportedCurrencyCode,
+} from "@/lib/storefront/currency";
+import { formatCurrencyAmount } from "@/lib/storefront/price-format";
+import {
   resolveProductTopOffer,
-  resolveTopOfferCurrentAmount,
-  resolveTopOfferOriginalAmount,
+  resolveStorefrontPrice,
 } from "@/lib/storefront/product-pricing";
 import type { ProductPriceState } from "./product-card.types";
 
 export const resolvePriceState = (
   product: HttpTypes.StoreProduct,
+  expectedCurrencyCode?: string | null,
 ): ProductPriceState => {
   const calculatedPrice = product.variants?.[0]?.calculated_price;
-  const calculatedAmount = calculatedPrice?.calculated_amount;
-  const calculatedOriginalAmount = calculatedPrice?.original_amount;
   const topOffer = resolveProductTopOffer(product);
-
-  const currentAmount =
-    typeof calculatedAmount === "number"
-      ? calculatedAmount
-      : resolveTopOfferCurrentAmount(topOffer);
-  const currencyCode =
-    asCurrencyCode(calculatedPrice?.currency_code) ??
-    asCurrencyCode(topOffer?.currency) ??
-    DEFAULT_CURRENCY_CODE;
-
-  const calculatedOriginal =
-    typeof calculatedOriginalAmount === "number" &&
-    typeof currentAmount === "number" &&
-    calculatedOriginalAmount > currentAmount
-      ? calculatedOriginalAmount
-      : null;
-  const offerOriginal = resolveTopOfferOriginalAmount({
-    currentAmount,
+  const price = resolveStorefrontPrice({
+    calculatedAmount: calculatedPrice?.calculated_amount,
+    calculatedCurrencyCode: calculatedPrice?.currency_code,
+    calculatedOriginalAmount: calculatedPrice?.original_amount,
+    expectedCurrencyCode,
     topOffer,
   });
-  const originalAmount = calculatedOriginal ?? offerOriginal;
 
-  if (typeof currentAmount !== "number") {
+  if (!price) {
     return {
       currentLabel: "Cena na vyžiadanie",
       originalLabel: null,
       currentAmount: null,
       originalAmount: null,
-      currencyCode,
+      currencyCode: resolveSupportedCurrencyCode(
+        expectedCurrencyCode,
+        DEFAULT_CURRENCY_CODE,
+      ),
     };
   }
 
-  const currentLabel = formatCurrencyAmount(currentAmount, currencyCode);
+  const currentLabel = formatCurrencyAmount(
+    price.currentAmount,
+    price.currencyCode,
+  );
   const originalLabel =
-    typeof originalAmount === "number" && originalAmount > currentAmount
-      ? formatCurrencyAmount(originalAmount, currencyCode)
+    typeof price.originalAmount === "number" &&
+    price.originalAmount > price.currentAmount
+      ? formatCurrencyAmount(price.originalAmount, price.currencyCode)
       : null;
 
   return {
     currentLabel,
     originalLabel,
-    currentAmount,
-    originalAmount,
-    currencyCode: currencyCode.toUpperCase(),
+    currentAmount: price.currentAmount,
+    originalAmount: price.originalAmount,
+    currencyCode: price.currencyCode,
   };
 };
 
@@ -75,7 +68,7 @@ export const resolveDiscountLabel = (
   }
 
   const discountAmount = price.originalAmount - price.currentAmount;
-  return `–${formatCurrencyAmount(discountAmount, price.currencyCode)}`;
+  return `-${formatCurrencyAmount(discountAmount, price.currencyCode)}`;
 };
 
 export const getProductPriceLabel = (