localhost:3000 api trpc authCallback

Question

I trying following some project not sure which part i have miss out, i was trying sign-up account not working only keep loading setting up account.

i using Kinde handles user authentication, authorization, and other identity-related functionalities, using prsima and sycn with local database mysql.

auth-callback

"use client"

import { useRouter, useSearchParams } from 'next/navigation'
import { trpc } from '../\_trpc/client'
import { Loader2 } from 'lucide-react'

const Page = () =\> {
const router = useRouter()

const searchParams = useSearchParams()
const origin = searchParams.get('origin')

trpc.authCallback.useQuery(undefined, {
onSuccess: ({ success }) =\> {
if (success) {
// user is synced to db
router.push(origin ? `/${origin}` : '/dashboard')
}
},
onError: (err) =\> {
if (err.data?.code === 'UNAUTHORIZED') {
router.push('/sign-in')
}
},
retry: true,
retryDelay: 500,
})

return (
\<div className='w-full mt-24 flex justify-center'\>
\<div className='flex flex-col items-center gap-2'\>
\<Loader2 className='h-8 w-8 animate-spin text-zinc-800' /\>
\<h3 className='font-semibold text-xl'\>
Setting up your account...
\</h3\>
\<p\>You will be redirected automatically.\</p\>
\</div\>
\</div\>
)
}

export default Page

this is example i manage synced db.

.env
DATABASE_URL='mysql://username:randompassword@localhost:3306/test'

mysql table appear same id, email and the following.

generator client {
  provider = "prisma-client-js"
}


datasource db {
  provider     = "mysql"
  url          = env("DATABASE_URL")"
}

model User {
  id        String @id @unique //matches kinde user id
  email     String @unique

  stripeCustomerId       String?   @unique @map(name: "stripe_customer_id")
  stripeSubscriptionId   String?   @unique @map(name: "stripe_subscription_id")
  stripePriceId          String?   @map(name: "stripe_price_id")
  stripeCurrentPeriodEnd DateTime? @map(name: "stripe_current_period_end")
}

Tyring setup account this appear

enter image description here

expect to resolved sign-in or sign-up account able to sync with local database.