import axios from 'axios';

import { useEffect, useRef, useState } from 'react';

import type { QualityMetrics } from '@/Components/ContentEditor/QualityScoreSidebar';

interface UseQualityScoreOptions {
  content: string;
  siteUrl: string;
  siteId: number;
  enabled?: boolean;
  debounceMs?: number;
}

interface UseQualityScoreReturn {
  metrics: QualityMetrics | null;
  isLoading: boolean;
  error: string | null;
}

export function useQualityScore({
  content,
  siteUrl,
  siteId,
  enabled = true,
  debounceMs = 500,
}: UseQualityScoreOptions): UseQualityScoreReturn {
  const [metrics, setMetrics] = useState<QualityMetrics | null>(null);
  const [isLoading, setIsLoading] = useState(false);
  const [error, setError] = useState<string | null>(null);
  const abortControllerRef = useRef<AbortController | null>(null);
  const debounceTimerRef = useRef<NodeJS.Timeout | null>(null);

  useEffect(() => {
    // Clear any pending debounce timer
    if (debounceTimerRef.current) {
      clearTimeout(debounceTimerRef.current);
    }

    // Abort any pending request
    if (abortControllerRef.current) {
      abortControllerRef.current.abort();
    }

    // Don't fetch if disabled or content is empty
    if (!enabled || !content.trim()) {
      setMetrics(null);
      setIsLoading(false);
      setError(null);
      return;
    }

    // Set loading state immediately
    setIsLoading(true);
    setError(null);

    // Debounce the API call
    debounceTimerRef.current = setTimeout(() => {
      const abortController = new AbortController();
      abortControllerRef.current = abortController;

      const fetchQualityMetrics = async () => {
        try {
          const response = await axios.post<QualityMetrics>(
            route('content-editor.analyze', { site: siteId }),
            {
              content,
              site_url: siteUrl,
            },
            {
              signal: abortController.signal,
            },
          );

          if (!abortController.signal.aborted) {
            setMetrics(response.data);
            setIsLoading(false);
            setError(null);
          }
        } catch (err) {
          if (!abortController.signal.aborted) {
            setIsLoading(false);
            if (axios.isAxiosError(err) && err.response) {
              setError(err.response.data.message || 'Failed to analyze content');
            } else {
              setError('Failed to analyze content');
            }
          }
        }
      };

      fetchQualityMetrics();
    }, debounceMs);

    // Cleanup function
    return () => {
      if (debounceTimerRef.current) {
        clearTimeout(debounceTimerRef.current);
      }
      if (abortControllerRef.current) {
        abortControllerRef.current.abort();
      }
    };
  }, [content, siteUrl, siteId, enabled, debounceMs]);

  return { metrics, isLoading, error };
}