feat(GCOM-1538): add StoreCredit placeholder component, allow checkou…

…t when total of the cart is 0
graphcommerce-org · Jan 16, 2025 · 3e91863 · 3e91863
1 parent ca72332
commit 3e91863
Show file tree

Hide file tree

Showing 9 changed files with 32 additions and 6 deletions.
diff --git a/.changeset/smooth-dolls-destroy.md b/.changeset/smooth-dolls-destroy.md
@@ -0,0 +1,8 @@
+---
+'@graphcommerce/magento-graphcms': minor
+'@graphcommerce/magento-open-source': minor
+'@graphcommerce/magento-cart': minor
+'@graphcommerce/magento-customer': minor
+---
+
+add StoreCredit placeholder component, allow checkout when total of the cart is 0
diff --git a/examples/magento-graphcms/pages/account/index.tsx b/examples/magento-graphcms/pages/account/index.tsx
@@ -8,6 +8,7 @@ import {
   getCustomerAccountIsDisabled,
   OrderStateLabelInline,
   SignOutForm,
+  StoreCreditAccountMenuItem,
   useCustomerQuery,
   WaitForCustomer,
 } from '@graphcommerce/magento-customer'
@@ -126,6 +127,7 @@ function AccountIndexPage() {
                 '&:hover': { background: theme.palette.background.paper },
               })}
             />
+            <StoreCreditAccountMenuItem customer={customer} />
             {import.meta.graphCommerce.magentoVersion >= 246 &&
               import.meta.graphCommerce.customerDeleteEnabled && (
                 <AccountMenuItem

diff --git a/examples/magento-graphcms/pages/cart.tsx b/examples/magento-graphcms/pages/cart.tsx
@@ -79,8 +79,11 @@ function CartPage() {
         {hasItems ? (
           <>
             <Container maxWidth='md'>
-              <CartItemsActionCards cart={data.cart} sx={{ position: 'relative', zIndex: 1 }} />
-              <CouponAccordion key='couponform' sx={(theme) => ({ mt: theme.spacings.md })} />
+              <CartItemsActionCards
+                cart={data.cart}
+                sx={(theme) => ({ position: 'relative', zIndex: 1, mb: theme.spacings.md })}
+              />
+              <CouponAccordion key='couponform' />
               <CartTotals containerMargin sx={{ typography: 'body1' }} />
               <ApolloCartErrorAlert error={error} />
             </Container>

diff --git a/examples/magento-open-source/.gitignore b/examples/magento-open-source/.gitignore
@@ -33,4 +33,5 @@ yarn-error.log*
 
 # managed by: graphcommerce
 pages/.well-known/assetlinks.json.tsx
+pages/account/store-credit.tsx
 # end managed by: graphcommerce
diff --git a/examples/magento-open-source/pages/cart.tsx b/examples/magento-open-source/pages/cart.tsx
@@ -80,8 +80,11 @@ function CartPage() {
         {hasItems ? (
           <>
             <Container maxWidth='md'>
-              <CartItemsActionCards cart={data.cart} sx={{ position: 'relative', zIndex: 1 }} />
-              <CouponAccordion key='couponform' sx={(theme) => ({ mt: theme.spacings.md })} />
+              <CartItemsActionCards
+                cart={data.cart}
+                sx={(theme) => ({ position: 'relative', zIndex: 1, mb: theme.spacings.md })}
+              />
+              <CouponAccordion key='couponform' />
               <CartTotals containerMargin sx={{ typography: 'body1' }} />
               <ApolloCartErrorAlert error={error} />
             </Container>

diff --git a/packages/magento-cart/components/CartStartCheckout/CartStartCheckout.tsx b/packages/magento-cart/components/CartStartCheckout/CartStartCheckout.tsx
@@ -40,7 +40,7 @@ export function CartStartCheckout(props: CartStartCheckoutProps) {
   } = props
 
   const shouldLoginToContinue = useCheckoutShouldLoginToContinue()
-  const hasTotals = (cart?.prices?.grand_total?.value ?? 0) > 0
+  const hasTotals = (cart?.prices?.grand_total?.value ?? 0) > 0 || !!cart?.items?.length
   const hasErrors = cart?.items?.some((item) => (item?.errors?.length ?? 0) > 0)
 
   return (

diff --git a/packages/magento-cart/components/CartStartCheckout/CartStartCheckoutLinkOrButton.tsx b/packages/magento-cart/components/CartStartCheckout/CartStartCheckoutLinkOrButton.tsx
@@ -28,7 +28,7 @@ export function CartStartCheckoutLinkOrButton(props: CartStartCheckoutLinkOrButt
 
   const shouldLoginToContinue = useCheckoutShouldLoginToContinue()
 
-  const hasTotals = (cart?.prices?.grand_total?.value ?? 0) > 0
+  const hasTotals = (cart?.prices?.grand_total?.value ?? 0) > 0 || !!cart?.items?.length
   const hasErrors = cart?.items?.some((item) => (item?.errors?.length ?? 0) > 0)
 
   return (

diff --git a/...ges/magento-customer/components/StoreCreditAccountMenuItem/StoreCreditAccountMenuItem.tsx b/...ges/magento-customer/components/StoreCreditAccountMenuItem/StoreCreditAccountMenuItem.tsx
@@ -0,0 +1,8 @@
+import type { AccountDashboardQuery } from '../../graphql/AccountDashboard.gql'
+
+export type StoreCreditAccountMenuItemProps = AccountDashboardQuery
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export function StoreCreditAccountMenuItem(props: StoreCreditAccountMenuItemProps) {
+  return null
+}
diff --git a/packages/magento-customer/components/index.ts b/packages/magento-customer/components/index.ts
@@ -47,6 +47,7 @@ export * from './SignOutForm/SignOutForm'
 export * from './SignUpForm/SignUp.gql'
 export * from './SignUpForm/SignUpForm'
 export * from './SignUpForm/SignUpFormInline'
+export * from './StoreCreditAccountMenuItem/StoreCreditAccountMenuItem'
 export * from './UpdateCustomerEmailForm/UpdateCustomerEmailForm'
 export * from './UpdateDefaultAddressForm/UpdateDefaultAddressForm'
 export * from './WaitForCustomer/WaitForCustomer'