/**
 * OAuth callback page — refreshes user after OAuth redirect.
 *
 * ⚠️ AUTO-GENERATED BY PRISM - DO NOT EDIT
 */

import { useEffect, useState } from 'react';
import { useNavigate, useSearchParams } from 'react-router-dom';
import { useAuth } from '../../contexts/AuthContext';

export default function AuthCallback(): JSX.Element {
  const navigate = useNavigate();
  const [searchParams] = useSearchParams();
  const error = searchParams.get('error');
  const { refreshUser } = useAuth();
  const [loading, setLoading] = useState(!error);

  useEffect(() => {
    if (error) return;

    const handleCallback = async () => {
      await refreshUser();
      navigate('/', { replace: true });
    };

    handleCallback().finally(() => setLoading(false));
  }, [error, refreshUser, navigate]);

  if (loading) {
    return (
      <div className="min-h-screen bg-nordic-50 flex items-center justify-center py-12 px-4">
        <div className="w-full max-w-md mx-auto">
          <div className="bg-white rounded-lg shadow-lg p-8 text-center">
            <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-nordic-600 mx-auto mb-4" />
            <p className="text-nordic-600">Completing sign in...</p>
          </div>
        </div>
      </div>
    );
  }

  if (error) {
    return (
      <div className="min-h-screen bg-nordic-50 flex items-center justify-center py-12 px-4">
        <div className="w-full max-w-md mx-auto">
          <div className="bg-white rounded-lg shadow-lg p-8 text-center">
            <h2 className="text-2xl font-bold text-nordic-800 mb-4">Authentication Error</h2>
            <p className="text-red-600 mb-6">{error}</p>
            <button
              onClick={() => navigate('/login')}
              className="bg-nordic-600 text-white py-2 px-4 rounded-md hover:bg-nordic-700 transition-colors"
            >
              Back to login
            </button>
          </div>
        </div>
      </div>
    );
  }

  return null as unknown as JSX.Element;
}
