All files / src/sections/PayBuilder/Checkout/components PhysicalTicketsSection.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
 
 
 
 
 
 
 
 
 
 
 
 
 
 
46x
14x
14x
 
3x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import { Stack } from "@mui/material";
import { TicketIcon } from "@phosphor-icons/react";
import GiveText from "@shared/Text/GiveText";
import CheckoutDetailsSectionItem from "./CheckoutDetailsSectionItem";
import useCheckFormType from "@sections/PayBuilder/components/hooks/useCheckFormType";
 
// Event-only Checkout-tab section, saved as the product's
// printedMaterialsEnabled flag. Distinct from DeliverySection, which stays the
// delivery_address checkout param — the mockups show both on events.
// Self-gates on event, like ParticipantDetailsSection.
//
// Note: the backing products.printed_materials_enabled column (givesync-api#7133)
// must be deployed to the same environment, or saving the toggle is silently
// discarded by the API.
const PhysicalTicketsSection = () => {
  const { isEvent } = useCheckFormType();
  if (!isEvent) return null;
 
  return (
    <Stack gap="12px" data-testid="physical-tickets-section">
      <Stack direction="row" spacing={2}>
        <TicketIcon size={24} />
        <GiveText variant="bodyL">
          Do you want to offer physical tickets?
        </GiveText>
      </Stack>
      <CheckoutDetailsSectionItem
        label="Yes, include"
        name="physicalTickets"
        secondaryText="Printed tickets will be provided to the customer."
      />
    </Stack>
  );
};
 
export default PhysicalTicketsSection;