Comments (6)
two options
- downgrade to ReactQuery 4
pnpm add @trpc/server @trpc/client @trpc/react-query @trpc/next @tanstack/react-query@^4.18.0 zod
or
- useEffect in the auth-callback
const authCallbackQuery = trpc.authCallback.useQuery(undefined, {
retry: true,
retryDelay: 500,
});
// Handle success
useEffect(() => {
if (authCallbackQuery.data?.success) {
router.push(origin ? `/${origin}` : "/dashboard");
}
}, [authCallbackQuery.data, router, origin]);
// Handle error
useEffect(() => {
if (authCallbackQuery.error?.data?.code === "UNAUTHORIZED") {
router.push("/sign-in");
}
}, [authCallbackQuery.error, router]);
from quill.
This worked for me (useEffect, like @farnell mentioned)
"use client" import { useEffect } from 'react'; // Import useEffect 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') // Store the query result in a variable const { data, error, isSuccess, isError } = trpc.authCallback.useQuery(undefined, { retry: true, retryDelay: 500, }); // Handle success in useEffect useEffect(() => { if (isSuccess && data?.success) { router.push(origin ? `/${origin}` : '/dashboard'); } }, [isSuccess, data, router, origin]); // Handle error in useEffect useEffect(() => { if (isError && error.data?.code === 'UNAUTHORIZED') { router.push('/sign-in'); } }, [isError, error, router]); 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
MMMM THANK U THIS WORKED
from quill.
from quill.
same issue
No overload matches this call.
Overload 1 of 2, '(input: void, opts: DefinedUseTRPCQueryOptions<{ success: boolean; }, { success: boolean; }, TRPCClientErrorLike<{ errorShape: DefaultErrorShape; transformer: false; }>, { ...; }>): DefinedUseTRPCQueryResult<...>', gave the following error.
Object literal may only specify known properties, and 'onSuccess' does not exist in type 'DefinedUseTRPCQueryOptions<{ success: boolean; }, { success: boolean; }, TRPCClientErrorLike<{ errorShape: DefaultErrorShape; transformer: false; }>, { success: boolean; }>'.
Overload 2 of 2, '(input: void, opts?: UseTRPCQueryOptions<{ success: boolean; }, { success: boolean; }, TRPCClientErrorLike<{ input: void; output: { success: boolean; }; transformer: false; errorShape: DefaultErrorShape; }>, { ...; }> | undefined):
from quill.
This worked for me (useEffect, like @farnell mentioned)
"use client"
import { useEffect } from 'react'; // Import useEffect
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')
// Store the query result in a variable
const { data, error, isSuccess, isError } = trpc.authCallback.useQuery(undefined, {
retry: true,
retryDelay: 500,
});
// Handle success in useEffect
useEffect(() => {
if (isSuccess && data?.success) {
router.push(origin ? `/${origin}` : '/dashboard');
}
}, [isSuccess, data, router, origin]);
// Handle error in useEffect
useEffect(() => {
if (isError && error.data?.code === 'UNAUTHORIZED') {
router.push('/sign-in');
}
}, [isError, error, router]);
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
from quill.
This worked for me (useEffect, like @farnell mentioned)
"use client" import { useEffect } from 'react'; // Import useEffect 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') // Store the query result in a variable const { data, error, isSuccess, isError } = trpc.authCallback.useQuery(undefined, { retry: true, retryDelay: 500, }); // Handle success in useEffect useEffect(() => { if (isSuccess && data?.success) { router.push(origin ? `/${origin}` : '/dashboard'); } }, [isSuccess, data, router, origin]); // Handle error in useEffect useEffect(() => { if (isError && error.data?.code === 'UNAUTHORIZED') { router.push('/sign-in'); } }, [isError, error, router]); 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
Thank You , Error Solved
from quill.
Related Issues (20)
- Minor question HOT 2
- connect to pinecone db have some error, how to fix them?thx.
- send Message function not working HOT 2
- Anyone facing any issue or need a upgraded?
- 'user' is possibly 'null'.ts(18047) const user: KindeUser | null HOT 2
- When I try to upgrade my subscription, it doesn't upgrade. HOT 1
- The logged-in user is not showing in Prisma Studio. HOT 2
- ChatWrapper / getFileUploadStatus: Property status does not exist on type HOT 4
- Cannot find module langchain/dist/document_loaders/fs/pdf or its corresponding type declarations HOT 1
- Error [InsufficientQuotaError]: 429 HOT 1
- The logged-in user is not showing in Prisma Studio. im using Neon console HOT 1
- Property 'status' does not exist on type 'Query<{ status: UploadStatus; }, TRPCClientErrorLike<{ input: { fileId: string; }; output: { status: UploadStatus; }; transformer: false; errorShape: DefaultErrorShape; }>, { ...; }, any>'.ts(2339) HOT 3
- Image Source error in image-loader.js HOT 4
- Property 'id' does not exist on type 'KindeUser | null'.ts(2339) on src\app\api\message\route.ts HOT 5
- Object literal may only specify known properties, and 'environment' does not exist in type 'PineconeConfiguration'.ts(2353) HOT 1
- what is the issue why im not able to chat with pdf HOT 8
- i am new which database to connect? (free) HOT 2
- Issue when uploading PDF in dashboard. PDF upload error HOT 3
- Dashboard doesn't get loaded at all after logging in
- Property 'given_name' does not exist on type 'Promise<KindeUser | null> \src\components\Navbar.tsx HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from quill.