From d2b9dd672545f2242344af667c82ee353f1b46ed Mon Sep 17 00:00:00 2001
From: Nick <hello@nicholasg.me>
Date: Thu, 17 Mar 2022 21:17:47 +0000
Subject: [PATCH] aaa this is all completely wrong, jwt needs to be generated
 in api route and signed with private key from oauth :|

---
 src/components/UserPanel/GooglePayBtn.tsx | 25 +++++++++++++++++++++++
 src/components/UserPanel/HasTicket.tsx    |  2 ++
 2 files changed, 27 insertions(+)
 create mode 100644 src/components/UserPanel/GooglePayBtn.tsx

diff --git a/src/components/UserPanel/GooglePayBtn.tsx b/src/components/UserPanel/GooglePayBtn.tsx
new file mode 100644
index 0000000..2c71459
--- /dev/null
+++ b/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;
diff --git a/src/components/UserPanel/HasTicket.tsx b/src/components/UserPanel/HasTicket.tsx
index e2cc588..16121af 100644
--- a/src/components/UserPanel/HasTicket.tsx
+++ b/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 />
     </>