ProcessingPurchase.js

import React, { useEffect } from "react"
import useFetch from "./useFetch"

export default function ProcessingPurchase({
  send,
  context: { workshopData, ticketsToPurchase, stripeToken }
}) {
  let [charge, error] = useFetch("/purchaseWorkshop", {
    workshopId: workshopData.id,
    ticketsToPurchase,
    stripeTokenId: stripeToken.id,
    stripeEmail: stripeToken.email
  })

  useEffect(
    () => {
      if (charge) {
        send({ type: "SUCCESS", payload: charge })
      } else if (error) {
        send({ type: "ERROR", payload: error })
      }
    },
    [charge, error]
  )

  return <div>Processing Purchase</div>
}