Use example payment method plugin for demo site

Signed-off-by: Chloe <pinkcloudvnn@gmail.com>

packages/opencommerce/.env.template

@@ -3,4 +3,3 @@ COMMERCE_PROVIDER=@vercel/commerce-opencommerce
 OPENCOMMERCE_STOREFRONT_API_URL=
 OPENCOMMERCE_PRIMARY_SHOP_ID=
 OPENCOMMERCE_IMAGE_DOMAIN=
-OPENCOMMERCE_STRIPE_API_KEY=

packages/opencommerce/src/api/endpoints/checkout/submit-checkout.ts

@@ -1,16 +1,9 @@
-import Stripe from 'stripe'
-
-import type { CardFields } from '../../../types/customer/card'
 import { LineItem } from '../../../types/cart'
 import placeOrder from '../../mutations/place-order'
 import setEmailOnAnonymousCart from '../../mutations/set-email-on-anonymous-cart'
 import getCartCookie from '../../utils/get-cart-cookie'
 import type { CheckoutEndpoint } from '.'
 
-const stripe = new Stripe(process.env.OPENCOMMERCE_STRIPE_API_KEY as string, {
-  apiVersion: '2020-08-27',
-})
-
 const submitCheckout: CheckoutEndpoint['handlers']['submitCheckout'] = async ({
   res,
   body: { item, cartId },
@@ -27,37 +20,13 @@ const submitCheckout: CheckoutEndpoint['handlers']['submitCheckout'] = async ({
     },
   })
 
-  const card = item.card as CardFields
-
-  const pm = await stripe.paymentMethods.create({
-    type: 'card',
-    card: {
-      number: card.cardNumber,
-      exp_month: Number(card.cardExpireDate.split('/')[0]),
-      exp_year: Number(card.cardExpireDate.split('/')[1]),
-      cvc: card.cardCvc,
-    },
-  } as Stripe.PaymentMethodCreateParams)
-
-  const result = await stripe.paymentIntents.create({
-    confirm: true,
-    amount: Math.round(item.checkout.cart.checkout.summary.total.amount * 100),
-    currency: item.checkout.cart.currency.code,
-    capture_method: 'manual',
-    metadata: {
-      integration_check: 'accept_a_payment',
-    },
-    payment_method: pm.id,
-  })
-
-  if (result.status === 'succeeded' || result.status === 'requires_capture') {
   const { data } = await fetch(placeOrder, {
     variables: {
       input: {
         payments: {
-            data: { stripePaymentIntentId: result.id },
+          data: { fullName: 'Open Commerce Demo Site' },
           amount: item.checkout.cart.checkout.summary.total.amount,
-            method: 'stripe_payment_intent',
+          method: 'iou_example',
         },
         order: {
           cartId,
@@ -89,7 +58,7 @@ const submitCheckout: CheckoutEndpoint['handlers']['submitCheckout'] = async ({
     getCartCookie(cartCookie),
     getCartCookie(anonymousCartTokenCookie),
   ])
-  }
+
   res.status(200).json({ data: null, errors: [] })
 }
 

site/.env.template

@@ -53,7 +53,6 @@ NEXT_PUBLIC_COMMERCEJS_DEPLOYMENT_URL=
 OPENCOMMERCE_STOREFRONT_API_URL=
 OPENCOMMERCE_PRIMARY_SHOP_ID=
 OPENCOMMERCE_IMAGE_DOMAIN=
-OPENCOMMERCE_STRIPE_API_KEY=
 
 SFCC_CLIENT_ID=
 SFCC_CLIENT_SECRET=

site/components/checkout/PaymentMethodView/PaymentMethodView.tsx

@@ -68,7 +68,6 @@ const PaymentMethodView: FC = () => {
                   name="cardNumber"
                   className={s.input}
                   defaultValue={cardFields.cardNumber}
-                  required
                 />
               </div>
               <div className={cn(s.fieldset, 'col-span-3')}>
@@ -78,7 +77,6 @@ const PaymentMethodView: FC = () => {
                   className={s.input}
                   placeholder="MM/YY"
                   defaultValue={cardFields.cardExpireDate}
-                  required
                 />
               </div>
               <div className={cn(s.fieldset, 'col-span-2')}>
@@ -87,7 +85,6 @@ const PaymentMethodView: FC = () => {
                   name="cardCvc"
                   className={s.input}
                   defaultValue={cardFields.cardCvc}
-                  required
                 />
               </div>
             </div>