import React, { useEffect } from 'react';
import { useNavigate, useSearchParams } from 'react-router-dom';
import { Box, CircularProgress, Typography } from '@mui/material';
import { useAuth } from '../../contexts/AuthContext';
import toast from 'react-hot-toast';

const GoogleCallback: React.FC = () => {
  const navigate = useNavigate();
  const [searchParams] = useSearchParams();
  const { handleGoogleCallback } = useAuth();

  useEffect(() => {
    const handleCallback = async () => {
      const token = searchParams.get('token');
      const error = searchParams.get('error');

      if (error) {
        toast.error('Google ile giriş yapılamadı: ' + error);
        navigate('/login');
        return;
      }

      if (token) {
        try {
          await handleGoogleCallback(token);
          toast.success('Google ile başarıyla giriş yapıldı!');
          navigate('/dashboard');
        } catch (error) {
          console.error('Google callback error:', error);
          toast.error('Giriş işlemi sırasında bir hata oluştu');
          navigate('/login');
        }
      } else {
        toast.error('Geçersiz callback');
        navigate('/login');
      }
    };

    handleCallback();
  }, [searchParams, navigate, handleGoogleCallback]);

  return (
    <Box
      sx={{
        display: 'flex',
        flexDirection: 'column',
        alignItems: 'center',
        justifyContent: 'center',
        minHeight: '100vh',
        gap: 2,
      }}
    >
      <CircularProgress size={60} />
      <Typography variant="h6" color="text.secondary">
        Google ile giriş yapılıyor...
      </Typography>
    </Box>
  );
};

export default GoogleCallback;