aaa this is all completely wrong, jwt needs to be generated in api ro…

…ute and signed with private key from oauth :|

src/components/UserPanel/GooglePayBtn.tsx

@@ -0,0 +1,25 @@
+import SaveToGooglePay from '@google-pay/save-button-react';
+
+interface Props {
+  ticketJwt: string;
+}
+
+const GooglePayBtn = ({ ticketJwt }: Props) => {
+  const jwt = {
+    ticketHolderName: 'Nick',
+    ticketNumber: 'ticketIdHere',
+    id: 'prom.ticketIdHere',
+    classId: 'prom.classIdHere',
+    state: 'ACTIVE',
+    barcode: {
+      type: 'QR_CODE',
+      value: ticketJwt,
+      alternateText: 'Nick - ticketId',
+    },
+  } as const;
+  return (
+    <SaveToGooglePay jwt={jwt} />
+  );
+};
+
+export default GooglePayBtn;

src/components/UserPanel/HasTicket.tsx

@@ -2,6 +2,7 @@ import { Flex, Heading } from '@chakra-ui/react';
 import { useTicket } from 'util/ticketContext';
 import MoreInfo from './MoreInfo';
 import QR from './QR';
+import GooglePayBtn from './GooglePayBtn';
 
 const HasTicket: React.FC = () => {
   const { ticket } = useTicket();
@@ -10,6 +11,7 @@ const HasTicket: React.FC = () => {
       <Flex direction="column" align="center" justify="center" m={5}>
         <Heading as="h2" my={3}>Your Ticket</Heading>
         <QR jwt={ticket.jwt} />
+        <GooglePayBtn ticketJwt={ticket.jwt} />
       </Flex>
       <MoreInfo />
     </>