50 lines
1.5 KiB
TypeScript
50 lines
1.5 KiB
TypeScript
import React, { useEffect } from 'react';
|
|
import { useNavigate, useSearchParams } from 'react-router-dom';
|
|
import { useAuth } from '../../contexts/AuthContext';
|
|
import toast from 'react-hot-toast';
|
|
import logger from '../../utils/logger';
|
|
|
|
const OAuthCallback: React.FC = () => {
|
|
const navigate = useNavigate();
|
|
const [searchParams] = useSearchParams();
|
|
const { handleOAuthCallback } = useAuth();
|
|
|
|
useEffect(() => {
|
|
const token = searchParams.get('token');
|
|
const provider = searchParams.get('provider');
|
|
const error = searchParams.get('error');
|
|
|
|
if (error) {
|
|
toast.error('OAuth authentication failed');
|
|
navigate('/login');
|
|
return;
|
|
}
|
|
|
|
if (token && provider) {
|
|
handleOAuthCallback(token, provider)
|
|
.then(() => {
|
|
toast.success(`Successfully logged in with ${provider}`);
|
|
navigate('/dashboard');
|
|
})
|
|
.catch((error: any) => {
|
|
logger.error('OAuth callback error:', error);
|
|
toast.error('Authentication failed');
|
|
navigate('/login');
|
|
});
|
|
} else {
|
|
toast.error('Invalid OAuth callback');
|
|
navigate('/login');
|
|
}
|
|
}, [searchParams, navigate, handleOAuthCallback]);
|
|
|
|
return (
|
|
<div className="min-h-screen flex items-center justify-center bg-gray-50">
|
|
<div className="text-center">
|
|
<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-blue-600 mx-auto"></div>
|
|
<p className="mt-4 text-gray-600">Processing authentication...</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default OAuthCallback; |