diff --git a/components/cart/CartSidebarView/CartSidebarView.tsx b/components/cart/CartSidebarView/CartSidebarView.tsx
index 2d4cfc724..5be6b64cd 100644
--- a/components/cart/CartSidebarView/CartSidebarView.tsx
+++ b/components/cart/CartSidebarView/CartSidebarView.tsx
@@ -4,17 +4,35 @@ import { UserNav } from '@components/core'
import { Button } from '@components/ui'
import { ArrowLeft, Bag, Cross, Check } from '@components/icon'
import { useUI } from '@components/ui/context'
+import { useCommerce } from '@lib/bigcommerce'
import useCart from '@lib/bigcommerce/cart/use-cart'
import CartItem from '../CartItem'
import useOpenCheckout from '@lib/bigcommerce/cart/use-open-checkout'
+import formatPrice from 'utils/format-price'
const CartSidebarView: FC = () => {
+ const { locale } = useCommerce()
const { data, isEmpty } = useCart()
const openCheckout = useOpenCheckout()
const { closeSidebar } = useUI()
- const items = data?.line_items.physical_items ?? []
const handleClose = () => closeSidebar()
+ const items = data?.line_items.physical_items ?? []
+ const subTotal = data
+ ? formatPrice({
+ amount: data.base_amount,
+ currencyCode: data.currency.code,
+ locale,
+ })
+ : 0
+ const total = data
+ ? formatPrice({
+ amount: data.cart_amount,
+ currencyCode: data.currency.code,
+ locale,
+ })
+ : 0
+
console.log('CART', data, isEmpty)
// This should come from the API via hook I guess
@@ -96,11 +114,11 @@ const CartSidebarView: FC = () => {
-
Subtotal
- $100
+ {subTotal}
-
Taxes
- $9.99
+ Calculated at checkout
-
Estimated Shipping
@@ -109,7 +127,7 @@ const CartSidebarView: FC = () => {
Total
- $1320.23
+ {total}