fix: Reported new donation flow issues

podkrepi-bg · Nov 24, 2024 · 9c32a8b · 9c32a8b
1 parent 9dfbca6
commit 9c32a8b
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 4 deletions.
diff --git a/src/components/client/donation-flow/DonationFlowForm.tsx b/src/components/client/donation-flow/DonationFlowForm.tsx
@@ -125,6 +125,7 @@ export function DonationFlowForm() {
   const cancelSetupIntentMutation = useCancelSetupIntent()
   const paymentMethodSectionRef = React.useRef<HTMLDivElement>(null)
   const authenticationSectionRef = React.useRef<HTMLDivElement>(null)
+  const stripeChargeRef = React.useRef<string>(idempotencyKey)
   const [showCancelDialog, setShowCancelDialog] = React.useState(false)
   const [submitPaymentLoading, setSubmitPaymentLoading] = React.useState(false)
   const { data: { user: person } = { user: null } } = useCurrentPerson()
@@ -197,7 +198,7 @@ export function DonationFlowForm() {
             campaign,
             values,
             session,
-            idempotencyKey,
+            stripeChargeRef.current,
           )
           router.push(
             `${window.location.origin}${routes.campaigns.donationStatus(campaign.slug)}?p_status=${
@@ -210,7 +211,7 @@ export function DonationFlowForm() {
             type: 'invalid_request_error',
             message: (error as StripeError).message ?? t('step.summary.alerts.error'),
           })
-
+          stripeChargeRef.current = crypto.randomUUID()
           return
         }
 

diff --git a/src/components/client/donation-flow/alerts/AlertsColumn.tsx b/src/components/client/donation-flow/alerts/AlertsColumn.tsx
@@ -60,6 +60,7 @@ function AlertsColumn({
     <>
       {updatedRefArray.map((ref, index) => {
         const alert = alerts[ref.current?.id as keyof typeof alerts]
+        if (!alert) return null
         return <AnchoredAlert key={index} sectionRef={ref} {...alert} />
       })}
     </>

diff --git a/src/components/client/donation-flow/contexts/DonationFlowProvider.tsx b/src/components/client/donation-flow/contexts/DonationFlowProvider.tsx
@@ -10,7 +10,7 @@ type DonationContext = {
   paymentError: StripeError | null
   setPaymentError: React.Dispatch<React.SetStateAction<StripeError | null>>
   campaign: CampaignResponse
-  stripe: StripeType | null
+  stripe: Promise<StripeType | null>
   idempotencyKey: string
 }
 

diff --git a/src/service/stripeClient.ts b/src/service/stripeClient.ts
@@ -4,4 +4,4 @@ const {
   publicRuntimeConfig: { STRIPE_PUBLISHABLE_KEY },
 } = getConfig()
 
-export const stripe = await loadStripe(STRIPE_PUBLISHABLE_KEY)
+export const stripe = loadStripe(STRIPE_PUBLISHABLE_KEY)