- Add /auth/callback/google and /auth/callback/zalo pages that extract tokens from query params and persist them via the auth store - Add handleOAuthCallback method to Zustand auth store - Update middleware to allow /auth/callback/* as public routes - Show OAuth error messages on login page when redirected back Co-Authored-By: Paperclip <noreply@paperclip.ing>
56 lines
1.6 KiB
TypeScript
56 lines
1.6 KiB
TypeScript
'use client';
|
|
|
|
import { useEffect, useRef } from 'react';
|
|
import { useRouter, useSearchParams } from 'next/navigation';
|
|
import { Loader2 } from 'lucide-react';
|
|
import { useAuthStore } from '@/lib/auth-store';
|
|
|
|
export default function GoogleCallbackPage() {
|
|
const router = useRouter();
|
|
const searchParams = useSearchParams();
|
|
const { handleOAuthCallback } = useAuthStore();
|
|
const processed = useRef(false);
|
|
|
|
useEffect(() => {
|
|
if (processed.current) return;
|
|
processed.current = true;
|
|
|
|
const accessToken = searchParams.get('accessToken');
|
|
const refreshToken = searchParams.get('refreshToken');
|
|
const expiresIn = searchParams.get('expiresIn');
|
|
const error = searchParams.get('error');
|
|
|
|
if (error) {
|
|
router.replace(`/login?error=${encodeURIComponent(error)}`);
|
|
return;
|
|
}
|
|
|
|
if (!accessToken || !refreshToken) {
|
|
router.replace('/login?error=oauth_failed');
|
|
return;
|
|
}
|
|
|
|
handleOAuthCallback({
|
|
accessToken,
|
|
refreshToken,
|
|
expiresIn: expiresIn ? Number(expiresIn) : 900,
|
|
})
|
|
.then(() => {
|
|
const redirect = searchParams.get('redirect') || '/dashboard';
|
|
router.replace(redirect);
|
|
})
|
|
.catch(() => {
|
|
router.replace('/login?error=oauth_failed');
|
|
});
|
|
}, [searchParams, handleOAuthCallback, router]);
|
|
|
|
return (
|
|
<div className="flex min-h-screen items-center justify-center">
|
|
<div className="text-center">
|
|
<Loader2 className="mx-auto h-8 w-8 animate-spin text-primary" />
|
|
<p className="mt-4 text-sm text-muted-foreground">Đang xử lý đăng nhập Google...</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|