Merge pull request #9604 from neinteractiveliterature/fix-ticket-purc…

…hase-modal-error Fix an error a user is seeing with EventTicketPurchaseModal being incorrectly rendered
neinteractiveliterature · Oct 7, 2024 · 37a5fd5 · 37a5fd5
2 parents de383f6 + 2221a4d
commit 37a5fd5
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 10 deletions.
diff --git a/app/javascript/EventsApp/EventPage/EventTicketPurchaseModal.tsx b/app/javascript/EventsApp/EventPage/EventTicketPurchaseModal.tsx
@@ -36,7 +36,9 @@ export default function EventTicketPurchaseModal({
   const [orderEntry, setOrderEntry] = useState<{ id: string; order: OrderPaymentModalContentsProps['order'] }>();
   const humanizeTime = useHumanizeTime();
   const expiresAt = useISODateTimeInAppZone(signup?.expires_at ?? '');
-  const { data, error } = useSuspenseQuery(CurrentPendingOrderPaymentIntentClientSecretQueryDocument);
+  const { data, error } = useSuspenseQuery(CurrentPendingOrderPaymentIntentClientSecretQueryDocument, {
+    errorPolicy: 'ignore',
+  });
 
   const cancel = async () => {
     if (orderEntry) {
@@ -73,7 +75,7 @@ export default function EventTicketPurchaseModal({
         )}
         {orderEntry ? (
           <LazyStripeElementsContainer
-            options={{ clientSecret: data.convention.my_profile?.current_pending_order?.payment_intent_client_secret }}
+            options={{ clientSecret: data?.convention.my_profile?.current_pending_order?.payment_intent_client_secret }}
           >
             <OrderPaymentModalContents onCancel={cancelAsync} onComplete={complete} order={orderEntry.order} />
           </LazyStripeElementsContainer>

diff --git a/app/javascript/EventsApp/EventPage/RunCard.tsx b/app/javascript/EventsApp/EventPage/RunCard.tsx
@@ -240,14 +240,16 @@ function RunCard({
           </div>
         )}
       </div>
-      <EventTicketPurchaseModal
-        visible={eventTicketPurchaseModal.visible}
-        close={eventTicketPurchaseModal.close}
-        eventTitle={event.title ?? ''}
-        availableProducts={event.ticket_types.flatMap((ticketType) => ticketType.providing_products)}
-        run={eventTicketPurchaseModal.state?.run}
-        signup={eventTicketPurchaseModal.state?.signup}
-      />
+      {eventTicketPurchaseModal.visible && (
+        <EventTicketPurchaseModal
+          visible
+          close={eventTicketPurchaseModal.close}
+          eventTitle={event.title ?? ''}
+          availableProducts={event.ticket_types.flatMap((ticketType) => ticketType.providing_products)}
+          run={eventTicketPurchaseModal.state?.run}
+          signup={eventTicketPurchaseModal.state?.signup}
+        />
+      )}
     </>
   );
 }