"use client";

import { useState } from "react";
import { getCurrentUserWithRetry, databases } from "@/lib/appwrite";
import { Query } from "appwrite";

const DiagnosticoPage = () => {
  const [resultado, setResultado] = useState<any>(null);
  const [loading, setLoading] = useState(false);

  const executarDiagnostico = async () => {
    setLoading(true);
    const diagnostico: any = {
      timestamp: new Date().toISOString(),
      etapas: [],
      dados: {},
    };

    try {
      // 1. Verificar usuário autenticado
      diagnostico.etapas.push("🔍 Verificando autenticação...");
      const user = await getCurrentUserWithRetry();

      if (!user) {
        diagnostico.etapas.push("❌ Usuário não autenticado");
        setResultado(diagnostico);
        setLoading(false);
        return;
      }

      diagnostico.etapas.push(
        `✅ Usuário autenticado: ${user.name} (${user.$id})`
      );
      diagnostico.dados.usuario = {
        id: user.$id,
        name: user.name,
        email: user.email,
      };

      // 2. Buscar na base de dados
      diagnostico.etapas.push("🔍 Buscando na base de dados...");

      const databaseId = process.env.NEXT_PUBLIC_APPWRITE_DATABASE_ID!;
      const collectionId =
        process.env.NEXT_PUBLIC_APPWRITE_COLLECTION_USUARIOS_ID!;

      const response = await databases.listDocuments(databaseId, collectionId, [
        Query.equal("auth-id-appwrite", user.$id),
        Query.limit(1),
      ]);

      diagnostico.dados.consulta = {
        total: response.total,
        documentos: response.documents.length,
      };

      if (response.documents.length === 0) {
        diagnostico.etapas.push("❌ Usuário não encontrado na base de dados");

        // Vamos tentar listar TODOS os usuários para ver se existe algum problema
        diagnostico.etapas.push("🔍 Listando todos os usuários para debug...");
        const todosUsuarios = await databases.listDocuments(
          databaseId,
          collectionId,
          [Query.limit(100)]
        );

        diagnostico.dados.todosUsuarios = todosUsuarios.documents.map(
          (doc) => ({
            id: doc.$id,
            authId: doc["auth-id-appwrite"],
            nomeCivil: doc["nome-civil"],
            email: doc.email,
          })
        );

        diagnostico.etapas.push(
          `📊 Total de usuários na base: ${todosUsuarios.total}`
        );
      } else {
        const userDoc = response.documents[0];
        diagnostico.etapas.push(
          `✅ Usuário encontrado na base de dados (ID: ${userDoc.$id})`
        );

        diagnostico.dados.usuarioDoc = {
          id: userDoc.$id,
          nomeCivil: userDoc["nome-civil"],
          cpf: userDoc.cpf,
          email: userDoc.email,
          authId: userDoc["auth-id-appwrite"],
          enderecos: userDoc.enderecos,
          empresas: userDoc.empresas,
          createdAt: userDoc.$createdAt,
          updatedAt: userDoc.$updatedAt,
        };

        // Verificar completude
        const camposObrigatorios = ["nome-civil", "cpf"];
        const camposFaltantes = camposObrigatorios.filter(
          (campo) => !userDoc[campo] || userDoc[campo].toString().trim() === ""
        );

        const temEndereco =
          userDoc.enderecos &&
          Array.isArray(userDoc.enderecos) &&
          userDoc.enderecos.length > 0;
        const temEmpresa =
          userDoc.empresas &&
          Array.isArray(userDoc.empresas) &&
          userDoc.empresas.length > 0;

        diagnostico.dados.validacao = {
          camposFaltantes,
          temEndereco,
          temEmpresa,
          registroCompleto: camposFaltantes.length === 0 && temEndereco,
        };

        if (camposFaltantes.length > 0) {
          diagnostico.etapas.push(
            `⚠️ Campos obrigatórios faltantes: ${camposFaltantes.join(", ")}`
          );
        }

        if (!temEndereco) {
          diagnostico.etapas.push("⚠️ Nenhum endereço encontrado");
        }

        if (!temEmpresa) {
          diagnostico.etapas.push("⚠️ Nenhuma empresa encontrada");
        }

        if (camposFaltantes.length === 0 && temEndereco) {
          diagnostico.etapas.push("✅ Registro está COMPLETO");
        } else {
          diagnostico.etapas.push("❌ Registro está INCOMPLETO");
        }
      }

      // 3. Verificar sessionStorage
      const flagRegistro = sessionStorage.getItem("registro-completado");
      diagnostico.dados.sessionStorage = {
        flagRegistro,
        isRecente: flagRegistro
          ? Date.now() - parseInt(flagRegistro) < 30000
          : false,
      };

      if (flagRegistro) {
        const tempoDecorrido = Date.now() - parseInt(flagRegistro);
        diagnostico.etapas.push(
          `🕒 Flag de registro encontrada há ${Math.round(
            tempoDecorrido / 1000
          )}s`
        );
      } else {
        diagnostico.etapas.push("🕒 Nenhuma flag de registro encontrada");
      }
    } catch (error: any) {
      diagnostico.etapas.push(`💥 ERRO: ${error.message}`);
      diagnostico.dados.erro = error;
    }

    setResultado(diagnostico);
    setLoading(false);
  };

  const limparSessionStorage = () => {
    sessionStorage.removeItem("registro-completado");
    alert("SessionStorage limpo!");
  };

  return (
    <div className="min-h-screen bg-gray-50 p-4">
      <div className="max-w-4xl mx-auto">
        <div className="bg-white rounded-lg shadow-lg p-6">
          <h1 className="text-2xl font-bold mb-4">🔬 Diagnóstico Completo</h1>

          <div className="space-x-2 mb-6">
            <button
              onClick={executarDiagnostico}
              disabled={loading}
              className="px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700 disabled:opacity-50"
            >
              {loading ? "⏳ Executando..." : "🔍 Executar Diagnóstico"}
            </button>

            <button
              onClick={limparSessionStorage}
              className="px-4 py-2 bg-red-600 text-white rounded hover:bg-red-700"
            >
              🗑️ Limpar SessionStorage
            </button>
          </div>

          {resultado && (
            <div className="space-y-4">
              <div className="bg-gray-900 text-green-400 p-4 rounded font-mono text-sm">
                <h3 className="text-white mb-2">📝 Log de Execução:</h3>
                {resultado.etapas.map((etapa: string, index: number) => (
                  <div key={index}>{etapa}</div>
                ))}
              </div>

              <div className="bg-blue-50 p-4 rounded">
                <h3 className="font-bold mb-2">📊 Dados Coletados:</h3>
                <pre className="text-xs overflow-auto max-h-96 bg-white p-2 rounded border">
                  {JSON.stringify(resultado.dados, null, 2)}
                </pre>
              </div>
            </div>
          )}
        </div>
      </div>
    </div>
  );
};

export default DiagnosticoPage;
