feat(core): Add currency selector to header #1912

bookernath · 2025-01-16T04:16:48Z

What/Why?

Adds currency selector following the same pattern used for locale selector
Establishes new currencyCode httpOnly cookie
New lib functions to customize/extend currency selection
Moved cart to a lib as well while I was at it
Decorates all queries that touch pricing to include currency code
- ... except Cart and Orders, as currency lives on those models directly

Only transactional currencies are supported for now, because we don't have a way to render prices for the cart for a display currency from the API. Theoretically we could use the exchange rate we have access to in the API to calculate the prices within next.js, but my preference would be for all monetary values, even estimates, to come from the API. So for now, I have filtered the list of currencies to only the transactional ones.

Todo

Handle default currency properly once exposed in GQL API
Run the mutation to change the currency of an active cart if the currency is changed (handle display vs transactional currencies properly)
Update VIBES Add currency form makeswift/vibes#472
~~Consider adding a middleware to set this cookie with a query param such as ?setCurrency=USD for the benefit of deep linking and crawlers~~
- Can be a future PR
Add translations

Testing

Preview deployment:

currency.mov

changeset-bot · 2025-01-16T04:16:52Z

🦋 Changeset detected

Latest commit: 8ba35ed

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@bigcommerce/catalyst-core	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

vercel · 2025-01-16T04:16:53Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
catalyst-canary	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jan 22, 2025 3:25am

4 Skipped Deployments

Name	Status	Preview	Updated (UTC)
catalyst	⬜️ Ignored (Inspect)		Jan 22, 2025 3:25am
catalyst-au	⬜️ Ignored (Inspect)	Visit Preview	Jan 22, 2025 3:25am
catalyst-soul	⬜️ Ignored (Inspect)	Visit Preview	Jan 22, 2025 3:25am
catalyst-uk	⬜️ Ignored (Inspect)	Visit Preview	Jan 22, 2025 3:25am

core/components/header/index.tsx

core/components/header/schema.ts

core/vibes/soul/primitives/navigation/index.tsx

chanceaclark · 2025-01-16T15:35:05Z

core/vibes/soul/primitives/navigation/index.tsx

🍹 Just make sure we have a corresponding PR in VIBES

core/components/header/index.tsx

chanceaclark · 2025-01-16T15:40:40Z

When it's ready to merge, don't forget a changelog 🙏

core/components/header/_actions/switch-currency.ts

Co-Authored-By: Chancellor Clark <[email protected]>

syncs with bigcommerce/catalyst#1912

github-actions · 2025-01-22T04:30:30Z

⚡️🏠 Lighthouse report

Lighthouse ran against https://catalyst-canary-1f3eij9x7-bigcommerce-platform.vercel.app

🖥️ Desktop

We ran Lighthouse against the changes on a desktop and produced this report. Here's the summary:

Category	Score
🟢 Performance	99
🟢 Accessibility	92
🟠 Best practices	78
🟠 SEO	82

📱 Mobile

We ran Lighthouse against the changes on a mobile and produced this report. Here's the summary:

Category	Score
🟠 Performance	89
🟢 Accessibility	92
🟠 Best practices	78
🟠 SEO	85

* Add currency selector Co-Authored-By: Chancellor Clark <[email protected]> * Abstract cart cookie handling to a common lib * Change currency of cart * Only show transactional currencies in switcher (for now) * Use default currency when there is no preference specified in cookie * Add cart ID + version to key to invalidate cart on currency change --------- Co-authored-by: Chancellor Clark <[email protected]>

bookernath added the do not merge label Jan 16, 2025

bookernath requested a review from a team as a code owner January 16, 2025 04:16

bookernath commented Jan 16, 2025

View reviewed changes

core/components/header/index.tsx Outdated Show resolved Hide resolved

bookernath force-pushed the currency-selector branch from 6e87363 to 8d669d2 Compare January 16, 2025 04:24

vercel bot deployed to Preview – catalyst-canary January 16, 2025 04:26 View deployment

bookernath force-pushed the currency-selector branch from 8d669d2 to 4761df8 Compare January 16, 2025 04:27

vercel bot deployed to Preview – catalyst-canary January 16, 2025 04:29 View deployment

bookernath force-pushed the currency-selector branch from 4761df8 to c2001f2 Compare January 16, 2025 05:02

vercel bot had a problem deploying to Preview – catalyst-canary January 16, 2025 05:03 Failure

bookernath force-pushed the currency-selector branch from c2001f2 to 4a5c4d2 Compare January 16, 2025 05:21

vercel bot deployed to Preview – catalyst-canary January 16, 2025 05:23 View deployment

bookernath force-pushed the currency-selector branch from 4a5c4d2 to b6b3570 Compare January 16, 2025 05:29

vercel bot had a problem deploying to Preview – catalyst-canary January 16, 2025 05:30 Failure

bookernath force-pushed the currency-selector branch from b6b3570 to e9f736b Compare January 16, 2025 05:32

bookernath commented Jan 16, 2025

View reviewed changes

core/components/header/schema.ts Outdated Show resolved Hide resolved

vercel bot deployed to Preview – catalyst-canary January 16, 2025 05:34 View deployment

chanceaclark reviewed Jan 16, 2025

View reviewed changes

vercel bot deployed to Preview – catalyst-canary January 16, 2025 17:49 View deployment

vercel bot deployed to Preview – catalyst-canary January 16, 2025 17:58 View deployment

bookernath force-pushed the currency-selector branch from 8f540e6 to 65d9c19 Compare January 16, 2025 21:03

vercel bot deployed to Preview – catalyst-canary January 16, 2025 21:05 View deployment

bookernath force-pushed the currency-selector branch 2 times, most recently from 11e4a96 to 7bf4c24 Compare January 16, 2025 21:07

vercel bot deployed to Preview – catalyst-canary January 16, 2025 21:09 View deployment

bookernath force-pushed the currency-selector branch from 7bf4c24 to 4b1fb73 Compare January 16, 2025 21:11

vercel bot deployed to Preview – catalyst-canary January 16, 2025 21:13 View deployment

bookernath force-pushed the currency-selector branch from 4b1fb73 to ef050b0 Compare January 16, 2025 21:15

jorgemoya reviewed Jan 17, 2025

View reviewed changes

core/components/header/_actions/switch-currency.ts Show resolved Hide resolved

bookernath force-pushed the currency-selector branch from 3e61ff7 to 66d04bb Compare January 17, 2025 22:40

vercel bot deployed to Preview – catalyst-canary January 17, 2025 22:42 View deployment

vercel bot deployed to Preview – catalyst-canary January 22, 2025 02:54 View deployment

bookernath removed the do not merge label Jan 22, 2025

bookernath force-pushed the currency-selector branch from 14196de to 5fe16fc Compare January 22, 2025 03:17

vercel bot deployed to Preview – catalyst-canary January 22, 2025 03:18 View deployment

bookernath force-pushed the currency-selector branch from 5fe16fc to 8ba35ed Compare January 22, 2025 03:22

bookernath and others added 6 commits January 21, 2025 21:24

Add currency selector

aaeb87f

Co-Authored-By: Chancellor Clark <[email protected]>

Abstract cart cookie handling to a common lib

f4113cc

Change currency of cart

d1ce5da

Only show transactional currencies in switcher (for now)

90e1f04

Use default currency when there is no preference specified in cookie

3d24d1e

Add cart ID + version to key to invalidate cart on currency change

707fe92

vercel bot deployed to Preview – catalyst-canary January 22, 2025 03:24 View deployment

bookernath force-pushed the currency-selector branch from 8ba35ed to 707fe92 Compare January 22, 2025 03:24

vercel bot deployed to Preview – catalyst-canary January 22, 2025 03:25 View deployment

bookernath added a commit to bookernath/vibes that referenced this pull request Jan 22, 2025

Add currency form

f8e9897

syncs with bigcommerce/catalyst#1912

bookernath added a commit to bookernath/vibes that referenced this pull request Jan 22, 2025

Add currency form

75afc35

syncs with bigcommerce/catalyst#1912

bookernath mentioned this pull request Jan 22, 2025

Add currency form makeswift/vibes#472

Closed

bookernath added this pull request to the merge queue Jan 22, 2025

Merged via the queue into canary with commit da2a462 Jan 22, 2025
9 checks passed

bookernath deleted the currency-selector branch January 22, 2025 04:27

github-actions bot mentioned this pull request Jan 21, 2025

Version Packages #1892

Open

github-actions bot mentioned this pull request Feb 4, 2025

Version Packages daniel-isaacs/catalyst-di#2

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(core): Add currency selector to header #1912

feat(core): Add currency selector to header #1912

bookernath commented Jan 16, 2025 •

edited

Loading

changeset-bot bot commented Jan 16, 2025 •

edited

Loading

vercel bot commented Jan 16, 2025 •

edited

Loading

chanceaclark Jan 16, 2025

chanceaclark commented Jan 16, 2025

github-actions bot commented Jan 22, 2025

feat(core): Add currency selector to header #1912

feat(core): Add currency selector to header #1912

Conversation

bookernath commented Jan 16, 2025 • edited Loading

What/Why?

Todo

Testing

changeset-bot bot commented Jan 16, 2025 • edited Loading

🦋 Changeset detected

vercel bot commented Jan 16, 2025 • edited Loading

chanceaclark Jan 16, 2025

Choose a reason for hiding this comment

chanceaclark commented Jan 16, 2025

github-actions bot commented Jan 22, 2025

⚡️🏠 Lighthouse report

🖥️ Desktop

📱 Mobile

bookernath commented Jan 16, 2025 •

edited

Loading

changeset-bot bot commented Jan 16, 2025 •

edited

Loading

vercel bot commented Jan 16, 2025 •

edited

Loading