CODEWITHSUNDEEP
javascriptreactjslocalizationcurrency-formatting
jrad09
jrad09

Reputation: 65

JavaScript/React - Currency Formatting For Canadian French

I'm attempting to write a function that says, "if the URL contains /fr, apply the french formatting to the pricing. Otherwise, if URL contains /en, keep the default pricing".

In Canadian French, the numbers are formatted a bit differently. Example: 19 304,45 $ instead of $19,304.45.

My below attempt isn't working. How can I correct my code to make it work properly?

formatPrice function:

export function formatPrice(price: any) {
  const language = window.location.pathname.includes("/fr") ? "fr" : "en";
  const options = {
    style: "currency",
    currency: "CAD",
    minimumFractionDigits: 2,
    maximumFractionDigits: 2,
  };

  return price.toLocaleString(language, options);
}

Usage:

<Td className="align-right reg-price">
    ${formatPrice(Number(equipment["regular-price"]?.text).toLocaleString())}
</Td>
<Td className="align-right sale-price">
    <strong>${formatPrice(Number(equipment["sale-price"]?.text).toLocaleString())}</strong>
</Td>

Upvotes: 1

Views: 122

Answers (0)

Related Questions