Issue accessing context in client component

[j-Riv]

I'm currently using the demo store template as a base. I created some basic context and am trying to use it in the CartDetails.client component but for w/e reason it looks like context gets reset to the initial value when CartDetails.client is imported by another client component CartDrawer.client, but it works as expected when CartDetails.client is imported by a server component cart.server.

I have created a stackblitz to display and show what im talking about. I have a basic context that just sets the currentTier. Initial value is 0, when total cart cost is above 55 its set to 1, 65 its set to 2, 75 its set to 3 etc. If you add an item to cart that costs more than 55 the currentTier should change. I'm console logging the value in the CartDetails.client component which gets rendered on the cart page and the cart drawer.

The expected result should be that when cart cost is higher than 55, currentTier should be greater than 0. But what happens is that if you're on the cart page it works as expected. If you open the drawer it shows the initial value of 0. In any case you'd expect both values to match, since they are using context, but they do not.

Didn't see any open issues for this so decided to try the discussions before opening an issue in case im doing something wrong as this is my first try at using server components.

Thanks in advance for any help.

https://stackblitz.com/edit/shopify-hydrogen-n6zc7w?file=src/components/cart/CartDetails.client.jsx