Fix: Improve WhatsApp instance and group creation logic

Analyze and fix the logic for WhatsApp instance and group creation, ensuring correct instance detection based on user email and status. Also, check for any exposed API keys or sensitive information.
2025-06-21 15:18:42 +00:00 · 2025-06-21 15:18:42 +00:00 · 61e154ed02
commit 61e154ed02
parent 8bedfeb33c
5 changed files with 191 additions and 105 deletions
--- a/src/components/whatsappGroups/CreateGroupForm.tsx
+++ b/src/components/whatsappGroups/CreateGroupForm.tsx
@ -4,6 +4,7 @@ import { useGroupCreation } from '@/hooks/whatsappGroups/useGroupCreation';
 import LoadingState from './LoadingState';
 import NoInstanceState from './NoInstanceState';
 import GroupCreationForm from './GroupCreationForm';
+import { useEffect } from 'react';

 interface CreateGroupFormProps {
  userEmail: string;
@ -11,18 +12,47 @@ interface CreateGroupFormProps {
 }

 const CreateGroupForm = ({ userEmail, onSuccess }: CreateGroupFormProps) => {
-  const { hasWhatsAppInstance, checkingInstance, userInstance } = useWhatsAppInstanceVerification(userEmail);
+  const { 
+    hasWhatsAppInstance, 
+    checkingInstance, 
+    userInstance, 
+    recheckInstance 
+  } = useWhatsAppInstanceVerification(userEmail);
+  
  const { cadastrando, handleCadastrarGrupo } = useGroupCreation(userEmail, onSuccess);

+  // Re-verificar a instância quando o componente for montado ou quando houver mudanças
+  useEffect(() => {
+    console.log('🔄 [GRUPO] CreateGroupForm montado, verificando instância');
+    recheckInstance();
+  }, [userEmail]);
+
+  // Log detalhado do estado atual
+  useEffect(() => {
+    console.log('📊 [GRUPO] Estado atual do CreateGroupForm:', {
+      userEmail,
+      hasWhatsAppInstance,
+      checkingInstance,
+      userInstance,
+      instanceStatus: userInstance?.status_instancia,
+      instanceName: userInstance?.instancia_zap
+    });
+  }, [userEmail, hasWhatsAppInstance, checkingInstance, userInstance]);
+
  if (checkingInstance) {
+    console.log('⏳ [GRUPO] Verificando instância WhatsApp...');
    return <LoadingState message="Verificando instância WhatsApp..." />;
  }

  if (!hasWhatsAppInstance) {
+    console.log('❌ [GRUPO] Instância WhatsApp não encontrada ou não conectada');
    return <NoInstanceState userInstance={userInstance} />;
  }

+  console.log('✅ [GRUPO] Instância válida encontrada, mostrando formulário de criação');
+
  const handleSubmit = (nomeGrupo: string) => {
+    console.log('🚀 [GRUPO] Iniciando criação de grupo:', nomeGrupo);
    handleCadastrarGrupo(nomeGrupo, userInstance);
  };

--- a/src/components/whatsappGroups/NoInstanceState.tsx
+++ b/src/components/whatsappGroups/NoInstanceState.tsx
@ -1,7 +1,9 @@

 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
 import { Alert, AlertDescription } from '@/components/ui/alert';
-import { AlertCircle } from 'lucide-react';
+import { MessageCircle, AlertTriangle } from 'lucide-react';
+import { Button } from '@/components/ui/button';
+import { useNavigate } from 'react-router-dom';

 interface NoInstanceStateProps {
  userInstance: {
@ -12,35 +14,72 @@ interface NoInstanceStateProps {
 }

 const NoInstanceState = ({ userInstance }: NoInstanceStateProps) => {
+  const navigate = useNavigate();
+
+  const handleGoToWhatsApp = () => {
+    navigate('/whatsapp');
+  };
+
  return (
    <Card>
      <CardHeader>
-        <CardTitle>Cadastrar novo grupo</CardTitle>
+        <div className="flex items-center mb-2">
+          <AlertTriangle className="h-6 w-6 mr-2 text-orange-600" />
+          <CardTitle>WhatsApp não conectado</CardTitle>
+        </div>
        <CardDescription>
-          Para criar um grupo é necessário ter uma instância do WhatsApp conectada
+          Para criar grupos, você precisa ter uma instância WhatsApp conectada
        </CardDescription>
      </CardHeader>
-      <CardContent>
-        <Alert>
-          <AlertCircle className="h-4 w-4" />
+      <CardContent className="space-y-4">
+        <Alert variant="destructive">
+          <MessageCircle className="h-4 w-4" />
          <AlertDescription>
-            {userInstance && userInstance.instancia_zap && userInstance.status_instancia !== 'conectado' ? (
-              <>
-                Sua instância WhatsApp <strong>{userInstance.instancia_zap}</strong> está <strong>desconectada</strong>. 
-                Acesse o menu "Conectar WhatsApp" e escaneie o QR Code para conectar sua instância.
-                <br />
-                <span className="text-sm text-gray-600 mt-2 block">
-                  Status atual: {userInstance.status_instancia}
-                </span>
-              </>
+            {userInstance ? (
+              userInstance.status_instancia === 'desconectado' ? (
+                <>
+                  Sua instância WhatsApp está <strong>desconectada</strong>. 
+                  Você precisa reconectar para criar grupos.
+                </>
+              ) : (
+                <>
+                  Instância encontrada, mas status: <strong>{userInstance.status_instancia || 'desconhecido'}</strong>. 
+                  Para criar grupos, o status deve ser "conectado".
+                </>
+              )
            ) : (
-              <>
-                Para criar um grupo é necessário ter sua instância do WhatsApp conectada. 
-                Acesse o menu "Conectar WhatsApp" e realize a conexão primeiro.
-              </>
+              'Nenhuma instância WhatsApp encontrada. Você precisa criar e conectar uma instância primeiro.'
            )}
          </AlertDescription>
        </Alert>
+
+        {userInstance && (
+          <div className="bg-gray-50 p-4 rounded-lg">
+            <h4 className="font-medium text-gray-900 mb-2">Status da sua instância:</h4>
+            <div className="space-y-1 text-sm text-gray-600">
+              <p><strong>Instância:</strong> {userInstance.instancia_zap || 'Não configurada'}</p>
+              <p><strong>Status:</strong> {userInstance.status_instancia || 'Desconhecido'}</p>
+              <p><strong>WhatsApp:</strong> {userInstance.whatsapp || 'Não configurado'}</p>
+            </div>
+          </div>
+        )}
+
+        <div className="flex flex-col sm:flex-row gap-3">
+          <Button onClick={handleGoToWhatsApp} className="flex-1">
+            <MessageCircle className="h-4 w-4 mr-2" />
+            {userInstance ? 'Reconectar WhatsApp' : 'Conectar WhatsApp'}
+          </Button>
+        </div>
+
+        <div className="bg-blue-50 p-4 rounded-lg">
+          <h4 className="font-medium text-blue-900 mb-2">Como resolver:</h4>
+          <ol className="list-decimal list-inside space-y-1 text-sm text-blue-800">
+            <li>Vá para a página "Conectar WhatsApp"</li>
+            <li>{userInstance ? 'Reconecte sua instância existente' : 'Crie uma nova instância WhatsApp'}</li>
+            <li>Escaneie o QR Code com seu celular</li>
+            <li>Volte aqui para criar grupos</li>
+          </ol>
+        </div>
      </CardContent>
    </Card>
  );
--- a/src/hooks/whatsapp/useInstanceCreation.ts
+++ b/src/hooks/whatsapp/useInstanceCreation.ts
@ -59,28 +59,28 @@ export const useInstanceCreation = (
    setLoading(true);

    try {
-      console.log(`🚀 Iniciando criação de instância com nome ${instanceName} e número ${fullPhoneNumber}`);
+      console.log(`🚀 [INSTÂNCIA] Iniciando criação de instância com nome ${instanceName} e número ${fullPhoneNumber}`);
      
      // 1. Criar instância na API
-      console.log('📡 Passo 1: Criando instância na API...');
+      console.log('📡 [INSTÂNCIA] Passo 1: Criando instância na API...');
      const data = await createWhatsAppInstance(instanceName, fullPhoneNumber);
-      console.log('✅ Resposta da API de criação de instância:', data);
+      console.log('✅ [INSTÂNCIA] Resposta da API de criação de instância:', data);

      // 2. Atualizar o banco de dados com status "conectado"
-      console.log('💾 Passo 2: Atualizando banco de dados...');
+      console.log('💾 [INSTÂNCIA] Passo 2: Atualizando banco de dados...');
      await updateUserWhatsAppInstance(userEmail, {
        instanceName,
        status: 'conectado'
      });
-      console.log('✅ Instância registrada no banco de dados com status "conectado"');
+      console.log('✅ [INSTÂNCIA] Instância registrada no banco de dados com status "conectado"');

      // 3. Ativar o workflow do usuário no n8n
-      console.log('🔄 Passo 3: Ativando workflow do usuário no n8n...');
+      console.log('🔄 [INSTÂNCIA] Passo 3: Ativando workflow do usuário no n8n...');
      try {
        await activateUserWorkflow(userEmail);
-        console.log('✅ Workflow ativado com sucesso no n8n');
+        console.log('✅ [INSTÂNCIA] Workflow ativado com sucesso no n8n');
      } catch (workflowError) {
-        console.error('⚠️ Erro ao ativar workflow, mas instância foi criada:', workflowError);
+        console.error('⚠️ [INSTÂNCIA] Erro ao ativar workflow, mas instância foi criada:', workflowError);
        toast({
          title: "Aviso",
          description: "Instância criada, mas houve um problema ao ativar a automação. Entre em contato com o suporte.",
@ -99,7 +99,7 @@ export const useInstanceCreation = (
        connectionState: 'closed'
      };
      
-      console.log('✅ Nova instância criada:', newInstance);
+      console.log('✅ [INSTÂNCIA] Nova instância criada:', newInstance);
      
      // 5. Atualizar estado para evitar nova criação
      setHasExistingInstance(true);
@ -111,15 +111,20 @@ export const useInstanceCreation = (
      // 6. Notificar componente pai
      onInstanceCreated(newInstance);
      
+      // 7. Forçar um pequeno delay para garantir que o banco foi atualizado
+      console.log('⏳ [INSTÂNCIA] Aguardando propagação das mudanças no banco...');
+      await new Promise(resolve => setTimeout(resolve, 2000));
+      
      toast({
        title: "Sucesso!",
-        description: "Instância do WhatsApp criada e ativada com sucesso!"
+        description: "Instância do WhatsApp criada e ativada com sucesso! Agora você pode criar grupos.",
+        duration: 5000
      });
      
      return true;
      
    } catch (error) {
-      console.error("💥 Erro ao criar instância WhatsApp:", error);
+      console.error("💥 [INSTÂNCIA] Erro ao criar instância WhatsApp:", error);
      
      // Se houve erro na API, tentar reverter no banco de dados
      try {
@ -127,9 +132,9 @@ export const useInstanceCreation = (
          instanceName: '',
          status: 'desconectado'
        });
-        console.log('🔄 Instância removida do banco devido ao erro na API');
+        console.log('🔄 [INSTÂNCIA] Instância removida do banco devido ao erro na API');
      } catch (dbError) {
-        console.error('❌ Erro ao reverter instância no banco:', dbError);
+        console.error('❌ [INSTÂNCIA] Erro ao reverter instância no banco:', dbError);
      }
      
      toast({
--- a/src/hooks/whatsappGroups/useWhatsAppInstanceVerification.ts
+++ b/src/hooks/whatsappGroups/useWhatsAppInstanceVerification.ts
@ -13,64 +13,71 @@ export const useWhatsAppInstanceVerification = (userEmail: string) => {
  const [checkingInstance, setCheckingInstance] = useState<boolean>(true);
  const [userInstance, setUserInstance] = useState<WhatsAppInstanceData | null>(null);

-  useEffect(() => {
-    const checkUserInstance = async () => {
-      if (!userEmail) {
-        console.log('❌ Email do usuário não fornecido');
-        setCheckingInstance(false);
-        return;
-      }
+  const checkUserInstance = async () => {
+    if (!userEmail) {
+      console.log('❌ Email do usuário não fornecido');
+      setCheckingInstance(false);
+      return;
+    }
+    
+    setCheckingInstance(true);
+    try {
+      console.log('🔍 [GRUPO] Verificando instância para criação de grupo:', userEmail);
      
-      setCheckingInstance(true);
-      try {
-        console.log('🔍 Verificando instância para criação de grupo:', userEmail);
+      const instanceData = await getUserWhatsAppInstance(userEmail);
+      console.log('📋 [GRUPO] Dados da instância encontrados:', instanceData);
+      
+      if (instanceData) {
+        // Verificação correta: deve ter instancia_zap igual ao email E status conectado
+        const hasValidInstance = !!(
+          instanceData && 
+          instanceData.instancia_zap && 
+          instanceData.instancia_zap.trim() !== '' &&
+          instanceData.instancia_zap !== 'null' &&
+          instanceData.instancia_zap !== null &&
+          instanceData.instancia_zap.toLowerCase() === userEmail.toLowerCase() &&
+          instanceData.status_instancia === 'conectado'
+        );
        
-        const instanceData = await getUserWhatsAppInstance(userEmail);
-        console.log('📋 Dados da instância encontrados:', instanceData);
+        console.log('✅ [GRUPO] Instância válida para criar grupos:', hasValidInstance, {
+          instancia_zap: instanceData.instancia_zap,
+          status_instancia: instanceData.status_instancia,
+          userEmail: userEmail,
+          instanceMatchesEmail: instanceData.instancia_zap?.toLowerCase() === userEmail.toLowerCase(),
+          isConnected: instanceData.status_instancia === 'conectado',
+          hasValidInstance
+        });
        
-        if (instanceData) {
-          // Verificação correta: deve ter instancia_zap igual ao email E status conectado
-          const hasValidInstance = !!(
-            instanceData && 
-            instanceData.instancia_zap && 
-            instanceData.instancia_zap.trim() !== '' &&
-            instanceData.instancia_zap !== 'null' &&
-            instanceData.instancia_zap !== null &&
-            instanceData.instancia_zap.toLowerCase() === userEmail.toLowerCase() &&
-            instanceData.status_instancia === 'conectado'
-          );
-          
-          console.log('✅ Instância válida para criar grupos:', hasValidInstance, {
-            instancia_zap: instanceData.instancia_zap,
-            status_instancia: instanceData.status_instancia,
-            userEmail: userEmail,
-            instanceMatchesEmail: instanceData.instancia_zap?.toLowerCase() === userEmail.toLowerCase(),
-            isConnected: instanceData.status_instancia === 'conectado',
-            hasValidInstance
-          });
-          
-          setHasWhatsAppInstance(hasValidInstance);
-          setUserInstance(instanceData);
-        } else {
-          console.log('❌ Nenhuma instância encontrada');
-          setHasWhatsAppInstance(false);
-          setUserInstance(null);
-        }
-      } catch (error) {
-        console.error('❌ Erro ao verificar instância do usuário:', error);
+        setHasWhatsAppInstance(hasValidInstance);
+        setUserInstance(instanceData);
+      } else {
+        console.log('❌ [GRUPO] Nenhuma instância encontrada');
        setHasWhatsAppInstance(false);
        setUserInstance(null);
-      } finally {
-        setCheckingInstance(false);
      }
-    };
+    } catch (error) {
+      console.error('❌ [GRUPO] Erro ao verificar instância do usuário:', error);
+      setHasWhatsAppInstance(false);
+      setUserInstance(null);
+    } finally {
+      setCheckingInstance(false);
+    }
+  };

+  useEffect(() => {
    checkUserInstance();
  }, [userEmail]);

+  // Função para forçar re-verificação (útil quando o status da instância muda)
+  const recheckInstance = () => {
+    console.log('🔄 [GRUPO] Forçando re-verificação da instância');
+    checkUserInstance();
+  };
+
  return {
    hasWhatsAppInstance,
    checkingInstance,
-    userInstance
+    userInstance,
+    recheckInstance
  };
 };
--- a/src/services/whatsAppGroupCreationService.ts
+++ b/src/services/whatsAppGroupCreationService.ts
@ -1,3 +1,4 @@
+
 import { supabase } from "@/integrations/supabase/client";

 interface CreateGroupResponse {
@ -15,37 +16,37 @@ export async function createWhatsAppGroup(
  groupName: string
 ): Promise<CreateGroupResponse> {
  try {
-    const url = `https://evolutionapi2.innova1001.com.br/group/create/${userEmail}`;
+    console.log('🚀 Iniciando criação de grupo via API Evolution');
+    console.log('📧 Email do usuário:', userEmail);
+    console.log('🏷️ Nome do grupo:', groupName);
    
-    const requestBody = {
-      subject: groupName,
-      description: "Finance Home seu controle sem complicação",
-      participants: ["5561992444275"]
-    };
-    
-    console.log('Criando grupo WhatsApp:', { url, requestBody });
-    
-    const response = await fetch(url, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-        'apikey': 'beeb77fbd7f48f91db2cd539a573c130'
-      },
-      body: JSON.stringify(requestBody)
+    // Usar a edge function para fazer a requisição segura
+    const { data, error } = await supabase.functions.invoke('whatsapp-api', {
+      body: {
+        endpoint: `/group/create/${encodeURIComponent(userEmail)}`,
+        method: 'POST',
+        body: {
+          subject: groupName,
+          description: "Finance Home seu controle sem complicação",
+          participants: ["5561992444275"]
+        }
+      }
    });
    
-    if (!response.ok) {
-      const errorText = await response.text();
-      console.error('Erro na resposta da API:', response.status, errorText);
-      throw new Error(`Falha ao criar grupo: ${response.status} - ${errorText}`);
+    if (error) {
+      console.error('❌ Erro na edge function:', error);
+      throw new Error(`Falha ao criar grupo: ${error.message}`);
    }
    
-    const data = await response.json();
-    console.log('Grupo criado com sucesso:', data);
+    if (data.error) {
+      console.error('❌ Erro da API Evolution:', data.error);
+      throw new Error(`Falha ao criar grupo: ${data.error}`);
+    }
    
+    console.log('✅ Grupo criado com sucesso:', data);
    return data;
  } catch (error) {
-    console.error('Erro ao criar grupo WhatsApp:', error);
+    console.error('❌ Erro ao criar grupo WhatsApp:', error);
    throw error;
  }
 }
@ -58,19 +59,23 @@ export async function updateGroupRemoteJid(
  remoteJid: string
 ): Promise<void> {
  try {
+    console.log('💾 Atualizando remote_jid no banco de dados');
+    console.log('🆔 Group ID:', groupId);
+    console.log('📱 Remote JID:', remoteJid);
+    
    const { error } = await supabase
      .from('grupos_whatsapp')
      .update({ remote_jid: remoteJid })
      .eq('id', groupId);
    
    if (error) {
-      console.error('Erro ao atualizar remote_jid:', error);
+      console.error('❌ Erro ao atualizar remote_jid:', error);
      throw error;
    }
    
-    console.log(`Remote JID atualizado para o grupo ${groupId}: ${remoteJid}`);
+    console.log('✅ Remote JID atualizado com sucesso');
  } catch (error) {
-    console.error('Erro ao atualizar remote_jid no banco:', error);
+    console.error('❌ Erro ao atualizar remote_jid no banco:', error);
    throw error;
  }
 }