'use client';

import { useEffect, useState } from 'react';
import { useParams, useRouter } from 'next/navigation';
import { Loader2 } from 'lucide-react';
import { api } from '@/lib/api';

/**
 * Fallback route: /crm/{uuid} → /crm/deal/{number}
 * Handles old UUID-based links and browser cache after route migration.
 */
export default function CrmDealFallback() {
  const params = useParams();
  const router = useRouter();
  const id = params.id as string;
  const [error, setError] = useState(false);

  useEffect(() => {
    // If it's already a number, redirect directly
    if (/^\d+$/.test(id)) {
      router.replace(`/crm/deal/${id}`);
      return;
    }

    // UUID — look up the deal to get its number
    api
      .get<{ number?: number }>(`/crm/deals/${id}`)
      .then((deal) => {
        if (deal?.number != null) {
          router.replace(`/crm/deal/${deal.number}`);
        } else {
          setError(true);
        }
      })
      .catch(() => {
        setError(true);
      });
  }, [id, router]);

  if (error) {
    return (
      <div className="bg-error/10 text-error rounded-xl p-6 text-center">
        <p>Сделка не найдена</p>
        <button onClick={() => router.push('/crm/deal/kanban')} className="mt-2 text-sm underline">
          Вернуться к списку
        </button>
      </div>
    );
  }

  return (
    <div className="flex items-center justify-center py-20">
      <Loader2 className="h-8 w-8 animate-spin text-primary" />
    </div>
  );
}
