Merge branch 'main' into feature/get-attestation

apps/haus/src/app/api/attestation/route.ts

@@ -62,7 +62,9 @@ export async function POST(request: Request) {
     const newAttestationUID = await tx.wait()
     console.log('New attestation UID:', newAttestationUID)
 
-    return NextResponse.json(`New attestation UID: ${newAttestationUID}`)
+    return NextResponse.json({
+      attestation_id: newAttestationUID,
+    })
   } catch (error) {
     console.error('Error handling POST request', error)
     return NextResponse.json({ message: 'Something went wrong' }, { status: 500 })

apps/haus/src/components/confirm-ticket/index.tsx

@@ -1,20 +1,58 @@
 'use client'
-import { Box, Button, Container, Divider, IconButton, Stack, Typography } from '@mui/material'
+import Typography from '@mui/material/Typography'
+import Stack from '@mui/material/Stack'
+import IconButton from '@mui/material/IconButton'
+import Divider from '@mui/material/Divider'
+import Container from '@mui/material/Container'
+import Box from '@mui/material/Box'
 import React, { useContext } from 'react'
-import { useParams, useRouter } from 'next/navigation'
+import Image from 'next/image'
+import { useParams } from 'next/navigation'
 import ArrowBackIcon from '@mui/icons-material/ArrowBack'
 import LocationOnIcon from '@mui/icons-material/LocationOn'
 import EventIcon from '@mui/icons-material/Event'
 import { getEventById } from '@/utils/helper'
 import { TicketContext } from '@/store/ticket'
-import Image from 'next/image'
+// import { useConnect, useAccount, useEnsName } from 'wagmi'
+import { useAccount, useEnsName } from 'wagmi'
+import { useMutation } from '@tanstack/react-query'
+import VerifyWorldId from '../verify-world-id'
+import api from '@/services/api'
+import { useRouter } from 'next/router'
+
+function generateSeatNumber() {
+  const letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'
+  const letter = letters[Math.floor(Math.random() * letters.length)]
+  const number = ('000' + Math.floor(Math.random() * 1000)).slice(-3)
+  return letter + number
+}
 
 function ConfirmTicket({ setStep }: { setStep: (step: number) => void }) {
   const { id } = useParams<{ id: string }>()
   const event = getEventById(id)
-  const router = useRouter()
   const context = useContext(TicketContext)
-
+  // const { connectors, connect } = useConnect()
+  // const { address, connector, isConnected } = useAccount()
+  const { address } = useAccount()
+  const { data: ensName } = useEnsName({ address })
+  const router = useRouter()
+  const { mutateAsync: confirmOrder } = useMutation({
+    mutationFn: (payload: {
+      id: string
+      eventId: string
+      worldProof: string
+      holderName: string
+      type: string
+      seatNumber: string
+      entryFor: number
+      recipient: string
+    }) => {
+      return api.post<{ attestation_id: string }>(`/attestation/`, payload)
+    },
+    onSuccess: () => {
+      router.push(`/event/${id}/complate`)
+    },
+  })
   return (
     <Box
       py={4}
@@ -113,14 +151,36 @@ function ConfirmTicket({ setStep }: { setStep: (step: number) => void }) {
             direction="row"
             justifyContent="flex-end"
           >
-            <Button
-              sx={{ width: 120 }}
-              onClick={() => router.push(`/event/${id}/complate`)}
-              variant="contained"
-              size="large"
-            >
-              Pay
-            </Button>
+            <VerifyWorldId
+              label="Pay"
+              onSuccess={async (item) => {
+                // console.log('success', item)
+                console.log({
+                  id: event?.id || '',
+                  eventId: event?.id || '',
+                  worldProof: item.proof,
+                  holderName: ensName || '',
+                  type: event?.tickets[0].type || '',
+                  seatNumber: generateSeatNumber(),
+                  entryFor: 1,
+                  recipient: address || '',
+                })
+                // connect({ connector: connectors[0] })
+                const { data } = await confirmOrder({
+                  id: event?.id || '',
+                  eventId: event?.id || '',
+                  worldProof: item.proof,
+                  holderName: ensName || address || '',
+                  type: event?.tickets[0].type || '',
+                  seatNumber: generateSeatNumber(),
+                  entryFor: 1,
+                  recipient: address || '',
+                })
+
+                console.log('attestation_id: ', data?.attestation_id)
+              }}
+              onError={console.error}
+            />
           </Stack>
         </Stack>
       </Container>

apps/haus/src/components/login/index.tsx → apps/haus/src/components/verify-world-id/index.tsx

@@ -6,22 +6,22 @@ import Button from '@mui/material/Button'
 const app_id = process.env.NEXT_PUBLIC_WORLDID_CLIENT_ID as `app_${string}`
 const action = process.env.NEXT_PUBLIC_WORLDID_ACTION
 
-const Login = () => {
+const VerifyWorldId = ({
+  label,
+  onSuccess,
+  onError,
+}: {
+  label: string
+  onSuccess: (result: ISuccessResult) => void
+  onError: (error: IErrorState) => void
+}) => {
   if (!app_id) {
     throw new Error('app_id is not set in environment variables!')
   }
   if (!action) {
     throw new Error('action is not set in environment variables!')
   }
 
-  const onSuccess = (result: ISuccessResult) => {
-    console.log('onSuccess', result)
-  }
-
-  const onError = (error: IErrorState) => {
-    console.log('onError', error)
-  }
-
   const handleVerify = async (result: ISuccessResult) => {
     console.log('Proof received from IDKit, sending to backend:\n', JSON.stringify(result)) // Log the proof from IDKit to the console for visibility
     const data = await verify(result)
@@ -49,12 +49,13 @@ const Login = () => {
             size="medium"
             onClick={open}
           >
-            Verify with World ID
+            {label}
           </Button>
         )}
       </IDKitWidget>
     </div>
   )
 }
 
-export default Login
+export default VerifyWorldId
+

apps/haus/src/services/api.tsx

@@ -0,0 +1,17 @@
+import { create } from 'apisauce'
+
+const ENDPOINT_URL = `/api`
+
+// define the base URL
+const api = create({
+  baseURL: ENDPOINT_URL,
+  headers: {
+    Accept: 'application/json',
+    'Content-Type': 'application/json',
+  },
+  timeout: 30000,
+})
+
+export const setApiAuth = (token: string) => api.setHeader('Authorization', token)
+
+export default api

package.json

@@ -21,6 +21,7 @@
     "@mui/material": "^5.16.6",
     "@mui/material-nextjs": "^5.16.6",
     "@worldcoin/idkit": "^1.2.2",
+    "apisauce": "^3.0.1",
     "axios": "^1.7.3",
     "big.js": "^6.2.1",
     "ethers": "^6.13.2",