Remove cart Element (#487)

* remove cart Element code and types
stripe · Apr 2, 2024 · 53bcc21 · 53bcc21
1 parent 86eaf3f
commit 53bcc21
Show file tree

Hide file tree

Showing 8 changed files with 7 additions and 570 deletions.
diff --git a/examples/hooks/10-Cart.js b/examples/hooks/10-Cart.js
diff --git a/src/components/Elements.test.tsx b/src/components/Elements.test.tsx
@@ -2,13 +2,7 @@ import React, {StrictMode} from 'react';
 import {render, act} from '@testing-library/react';
 import {renderHook} from '@testing-library/react-hooks';
 
-import {
-  Elements,
-  useElements,
-  ElementsConsumer,
-  useCartElement,
-  useCartElementState,
-} from './Elements';
+import {Elements, useElements, ElementsConsumer} from './Elements';
 import * as mocks from '../../test/mocks';
 import {useStripe} from './useStripe';
 
@@ -300,22 +294,6 @@ describe('Elements', () => {
     );
   });
 
-  test('throws when trying to call useCartElement outside of Elements context', () => {
-    const {result} = renderHook(() => useCartElement());
-
-    expect(result.error && result.error.message).toBe(
-      'Could not find Elements context; You need to wrap the part of your app that calls useCartElement() in an <Elements> provider.'
-    );
-  });
-
-  test('throws when trying to call useCartElementState outside of Elements context', () => {
-    const {result} = renderHook(() => useCartElementState());
-
-    expect(result.error && result.error.message).toBe(
-      'Could not find Elements context; You need to wrap the part of your app that calls useCartElementState() in an <Elements> provider.'
-    );
-  });
-
   describe('React.StrictMode', () => {
     test('creates elements twice in StrictMode', () => {
       const TestComponent = () => {

diff --git a/src/components/Elements.tsx b/src/components/Elements.tsx
@@ -41,33 +41,6 @@ export const parseElementsContext = (
   return ctx;
 };
 
-interface CartElementContextValue {
-  cart: stripeJs.StripeCartElement | null;
-  cartState: stripeJs.StripeCartElementPayloadEvent | null;
-  setCart: (cart: stripeJs.StripeCartElement | null) => void;
-  setCartState: (
-    cartState: stripeJs.StripeCartElementPayloadEvent | null
-  ) => void;
-}
-
-const CartElementContext = React.createContext<CartElementContextValue | null>(
-  null
-);
-CartElementContext.displayName = 'CartElementContext';
-
-export const parseCartElementContext = (
-  ctx: CartElementContextValue | null,
-  useCase: string
-): CartElementContextValue => {
-  if (!ctx) {
-    throw new Error(
-      `Could not find Elements context; You need to wrap the part of your app that ${useCase} in an <Elements> provider.`
-    );
-  }
-
-  return ctx;
-};
-
 interface ElementsProps {
   /**
    * A [Stripe object](https://stripe.com/docs/js/initializing) or a `Promise` resolving to a `Stripe` object.
@@ -110,14 +83,6 @@ export const Elements: FunctionComponent<PropsWithChildren<ElementsProps>> = (({
     rawStripeProp,
   ]);
 
-  const [cart, setCart] = React.useState<stripeJs.StripeCartElement | null>(
-    null
-  );
-  const [
-    cartState,
-    setCartState,
-  ] = React.useState<stripeJs.StripeCartElementPayloadEvent | null>(null);
-
   // For a sync stripe instance, initialize into context
   const [ctx, setContext] = React.useState<ElementsContextValue>(() => ({
     stripe: parsed.tag === 'sync' ? parsed.stripe : null,
@@ -191,13 +156,7 @@ export const Elements: FunctionComponent<PropsWithChildren<ElementsProps>> = (({
   }, [ctx.stripe]);
 
   return (
-    <ElementsContext.Provider value={ctx}>
-      <CartElementContext.Provider
-        value={{cart, setCart, cartState, setCartState}}
-      >
-        {children}
-      </CartElementContext.Provider>
-    </ElementsContext.Provider>
+    <ElementsContext.Provider value={ctx}>{children}</ElementsContext.Provider>
   );
 }) as FunctionComponent<PropsWithChildren<ElementsProps>>;
 
@@ -213,24 +172,6 @@ export const useElementsContextWithUseCase = (
   return parseElementsContext(ctx, useCaseMessage);
 };
 
-const DUMMY_CART_ELEMENT_CONTEXT: CartElementContextValue = {
-  cart: null,
-  cartState: null,
-  setCart: () => {},
-  setCartState: () => {},
-};
-
-export const useCartElementContextWithUseCase = (
-  useCaseMessage: string,
-  isInCustomCheckout = false
-): CartElementContextValue => {
-  const ctx = React.useContext(CartElementContext);
-  if (isInCustomCheckout) {
-    return DUMMY_CART_ELEMENT_CONTEXT;
-  }
-  return parseCartElementContext(ctx, useCaseMessage);
-};
-
 /**
  * @docs https://stripe.com/docs/stripe-js/react#useelements-hook
  */
@@ -239,24 +180,6 @@ export const useElements = (): stripeJs.StripeElements | null => {
   return elements;
 };
 
-/**
- * @docs https://stripe.com/docs/payments/checkout/cart-element
- */
-export const useCartElement = (): stripeJs.StripeCartElement | null => {
-  const {cart} = useCartElementContextWithUseCase('calls useCartElement()');
-  return cart;
-};
-
-/**
- * @docs https://stripe.com/docs/payments/checkout/cart-element
- */
-export const useCartElementState = (): stripeJs.StripeCartElementPayloadEvent | null => {
-  const {cartState} = useCartElementContextWithUseCase(
-    'calls useCartElementState()'
-  );
-  return cartState;
-};
-
 interface ElementsConsumerProps {
   children: (props: ElementsContextValue) => ReactNode;
 }