Implement WhatsApp connection flow
- Updated database on instance creation. - Added n8n workflow activation. - Filtered instance display by user email.
This commit is contained in:
gpt-engineer-app[bot]
parent
020ba4d396
commit
ec390787c6
@ -7,7 +7,7 @@ import { Label } from '@/components/ui/label';
|
||||
import { MessageCircle, AlertCircle } from 'lucide-react';
|
||||
import { useToast } from '@/hooks/use-toast';
|
||||
import { createWhatsAppInstance } from '@/services/whatsAppService';
|
||||
import { updateUserWhatsAppInstance, getUserWhatsAppInstance } from '@/services/whatsAppInstanceService';
|
||||
import { updateUserWhatsAppInstance, getUserWhatsAppInstance, activateUserWorkflow } from '@/services/whatsAppInstanceService';
|
||||
import { WhatsAppInstance } from '@/types/whatsAppTypes';
|
||||
import { Alert, AlertDescription } from '@/components/ui/alert';
|
||||
|
||||
@ -104,17 +104,34 @@ const CreateInstanceForm = ({
|
||||
setLoading(true);
|
||||
|
||||
try {
|
||||
console.log(`Criando instância com nome ${instanceName} e número ${phoneNumber}`);
|
||||
console.log(`🚀 Iniciando criação de instância com nome ${instanceName} e número ${phoneNumber}`);
|
||||
|
||||
// 1. Primeiro atualizar o banco de dados com a instância
|
||||
await updateUserWhatsAppInstance(userEmail, instanceName, 'desconectado');
|
||||
console.log('Instância registrada no banco de dados');
|
||||
|
||||
// 2. Criar instância na API
|
||||
// 1. Criar instância na API
|
||||
console.log('📡 Passo 1: Criando instância na API...');
|
||||
const data = await createWhatsAppInstance(instanceName, phoneNumber);
|
||||
console.log('Resposta da API de criação de instância:', data);
|
||||
console.log('✅ Resposta da API de criação de instância:', data);
|
||||
|
||||
// 3. Criar objeto da instância
|
||||
// 2. Atualizar o banco de dados com status "conectado"
|
||||
console.log('💾 Passo 2: Atualizando banco de dados...');
|
||||
await updateUserWhatsAppInstance(userEmail, instanceName, 'conectado');
|
||||
console.log('✅ 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...');
|
||||
try {
|
||||
await activateUserWorkflow(userEmail);
|
||||
console.log('✅ Workflow ativado com sucesso no n8n');
|
||||
} catch (workflowError) {
|
||||
console.error('⚠️ Erro ao ativar workflow, mas instância foi criada:', workflowError);
|
||||
// Não bloquear o fluxo se o workflow falhar, apenas loggar
|
||||
toast({
|
||||
title: "Aviso",
|
||||
description: "Instância criada, mas houve um problema ao ativar a automação. Entre em contato com o suporte.",
|
||||
variant: "destructive",
|
||||
});
|
||||
}
|
||||
|
||||
// 4. Criar objeto da instância
|
||||
const newInstance: WhatsAppInstance = {
|
||||
instanceName,
|
||||
instanceId: instanceName,
|
||||
@ -125,31 +142,31 @@ const CreateInstanceForm = ({
|
||||
connectionState: 'closed'
|
||||
};
|
||||
|
||||
console.log('Nova instância criada:', newInstance);
|
||||
console.log('✅ Nova instância criada:', newInstance);
|
||||
|
||||
// 4. Atualizar estado para evitar nova criação
|
||||
// 5. Atualizar estado para evitar nova criação
|
||||
setHasExistingInstance(true);
|
||||
|
||||
// 5. Notificar componente pai
|
||||
// 6. Notificar componente pai
|
||||
onInstanceCreated(newInstance);
|
||||
|
||||
toast({
|
||||
title: "Sucesso!",
|
||||
description: "Instância do WhatsApp criada com sucesso!"
|
||||
description: "Instância do WhatsApp criada e ativada com sucesso!"
|
||||
});
|
||||
|
||||
// Reset form fields
|
||||
setPhoneNumber('');
|
||||
|
||||
} catch (error) {
|
||||
console.error("Erro ao criar instância WhatsApp:", error);
|
||||
console.error("💥 Erro ao criar instância WhatsApp:", error);
|
||||
|
||||
// Se houve erro na API, remover do banco de dados
|
||||
// Se houve erro na API, tentar reverter no banco de dados
|
||||
try {
|
||||
await updateUserWhatsAppInstance(userEmail, '', 'desconectado');
|
||||
console.log('Instância removida do banco devido ao erro na API');
|
||||
console.log('🔄 Instância removida do banco devido ao erro na API');
|
||||
} catch (dbError) {
|
||||
console.error('Erro ao remover instância do banco:', dbError);
|
||||
console.error('❌ Erro ao reverter instância no banco:', dbError);
|
||||
}
|
||||
|
||||
toast({
|
||||
@ -260,6 +277,7 @@ const CreateInstanceForm = ({
|
||||
<li>• Apenas uma instância por usuário é permitida</li>
|
||||
<li>• O nome da instância será seu email de login</li>
|
||||
<li>• Após criar, você precisará escanear o QR Code para conectar</li>
|
||||
<li>• Sua automação financeira será ativada automaticamente</li>
|
||||
</ul>
|
||||
</div>
|
||||
</CardContent>
|
||||
|
||||
@ -3,6 +3,8 @@ import { useInstanceState } from './whatsApp/useInstanceState';
|
||||
import { useInstanceOperations } from './whatsApp/useInstanceOperations';
|
||||
import { useInstanceStatusCheck } from './whatsApp/useInstanceStatusCheck';
|
||||
import { useInstanceRefresh } from './whatsApp/useInstanceRefresh';
|
||||
import { WhatsAppInstance } from '@/types/whatsAppTypes';
|
||||
import { useMemo } from 'react';
|
||||
|
||||
export const useWhatsAppInstances = () => {
|
||||
const {
|
||||
@ -34,8 +36,28 @@ export const useWhatsAppInstances = () => {
|
||||
setIsRefreshing
|
||||
);
|
||||
|
||||
// Filtrar instâncias para mostrar apenas as do usuário logado
|
||||
const filteredInstances = useMemo(() => {
|
||||
const userEmail = localStorage.getItem('userEmail');
|
||||
if (!userEmail) {
|
||||
console.log('❌ Email do usuário não encontrado, retornando lista vazia');
|
||||
return [];
|
||||
}
|
||||
|
||||
const filtered = instances.filter((instance: WhatsAppInstance) => {
|
||||
// Comparar o instanceName com o email do usuário
|
||||
// Como o instanceName é o email do usuário, podemos fazer a comparação direta
|
||||
const isUserInstance = instance.instanceName === userEmail;
|
||||
console.log(`🔍 Verificando instância ${instance.instanceName} para usuário ${userEmail}: ${isUserInstance ? 'INCLUIR' : 'EXCLUIR'}`);
|
||||
return isUserInstance;
|
||||
});
|
||||
|
||||
console.log(`📋 Total de instâncias: ${instances.length}, Filtradas para usuário ${userEmail}: ${filtered.length}`);
|
||||
return filtered;
|
||||
}, [instances]);
|
||||
|
||||
return {
|
||||
instances,
|
||||
instances: filteredInstances, // Retornar instâncias filtradas
|
||||
isRefreshing,
|
||||
currentUserId,
|
||||
addInstance,
|
||||
|
||||
@ -57,7 +57,7 @@ const WhatsApp = () => {
|
||||
|
||||
// Handler para quando o usuário cria uma nova instância
|
||||
const handleInstanceCreated = (newInstance: WhatsAppInstance) => {
|
||||
console.log('New instance to be added:', newInstance);
|
||||
console.log('🎉 Nova instância criada:', newInstance);
|
||||
addInstance(newInstance);
|
||||
setInstanceFound(true);
|
||||
setShowCreateForm(false);
|
||||
@ -82,7 +82,7 @@ const WhatsApp = () => {
|
||||
|
||||
// Handler for when an instance is deleted
|
||||
const handleDeleteInstanceWrapper = (instanceId: string) => {
|
||||
console.log(`Instance deletion requested for ID: ${instanceId}`);
|
||||
console.log(`🗑️ Solicitação de exclusão da instância ID: ${instanceId}`);
|
||||
const instanceToDelete = instances.find(i => i.instanceId === instanceId);
|
||||
if (instanceToDelete) {
|
||||
handleDeleteInstance(instanceId, instanceToDelete.instanceName);
|
||||
@ -93,18 +93,26 @@ const WhatsApp = () => {
|
||||
setShowCreateForm(true);
|
||||
}
|
||||
} else {
|
||||
console.error(`Instance with ID ${instanceId} not found for deletion`);
|
||||
console.error(`❌ Instância com ID ${instanceId} não encontrada para exclusão`);
|
||||
}
|
||||
};
|
||||
|
||||
// Check if we have any instances to show
|
||||
const hasInstances = Array.isArray(instances) && instances.length > 0;
|
||||
const userEmail = localStorage.getItem('userEmail') || '';
|
||||
|
||||
return (
|
||||
<Layout>
|
||||
<div className="space-y-6">
|
||||
<div className="flex justify-between items-center">
|
||||
<h1 className="text-2xl font-bold tracking-tight">Conectar WhatsApp</h1>
|
||||
<div>
|
||||
<h1 className="text-2xl font-bold tracking-tight">Conectar WhatsApp</h1>
|
||||
{userEmail && (
|
||||
<p className="text-sm text-muted-foreground mt-1">
|
||||
Mostrando instâncias para: <strong>{userEmail}</strong>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Update List Button - Always visible */}
|
||||
<Button
|
||||
|
||||
@ -169,3 +169,59 @@ export async function getUserDebugInfo(userEmail: string): Promise<any> {
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Ativa o workflow do usuário no n8n
|
||||
*/
|
||||
export async function activateUserWorkflow(userEmail: string): Promise<void> {
|
||||
try {
|
||||
console.log(`🔄 Iniciando ativação do workflow para usuário: ${userEmail}`);
|
||||
|
||||
// Primeiro, buscar o workflow_id do usuário
|
||||
const { data: userData, error: fetchError } = await supabase
|
||||
.from('usuarios')
|
||||
.select('workflow_id')
|
||||
.eq('email', userEmail.trim().toLowerCase())
|
||||
.single();
|
||||
|
||||
if (fetchError) {
|
||||
console.error('❌ Erro ao buscar workflow_id do usuário:', fetchError);
|
||||
throw new Error(`Erro ao buscar workflow_id: ${fetchError.message}`);
|
||||
}
|
||||
|
||||
if (!userData || !userData.workflow_id) {
|
||||
console.error('⚠️ Usuário não possui workflow_id configurado');
|
||||
throw new Error('Usuário não possui workflow configurado');
|
||||
}
|
||||
|
||||
const workflowId = userData.workflow_id;
|
||||
console.log(`📋 Workflow ID encontrado: ${workflowId}`);
|
||||
|
||||
// Fazer a requisição para ativar o workflow
|
||||
const activationUrl = `https://n8n.innova1001.com.br/api/v1/workflows/${workflowId}/activate`;
|
||||
console.log(`🔗 URL de ativação: ${activationUrl}`);
|
||||
|
||||
const response = await fetch(activationUrl, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'X-N8N-API-KEY': 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiI2YmM4MjQxOS0zZTk1LTRiYmMtODMwMy0xODAzZjk4YmQ4YjciLCJpc3MiOiJuOG4iLCJhdWQiOiJwdWJsaWMtYXBpIiwiaWF0IjoxNzQ5MjA2NTk1fQ.-5mUcQNbVTjAUyneSun9a-3xpwGEMFHSkK4k59W11wk',
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
});
|
||||
|
||||
console.log(`📡 Status da resposta da ativação: ${response.status}`);
|
||||
|
||||
if (!response.ok) {
|
||||
const errorText = await response.text();
|
||||
console.error(`❌ Erro ao ativar workflow: ${response.status} - ${errorText}`);
|
||||
throw new Error(`Erro ao ativar workflow: ${response.status} - ${errorText}`);
|
||||
}
|
||||
|
||||
const responseData = await response.json();
|
||||
console.log('✅ Workflow ativado com sucesso:', responseData);
|
||||
|
||||
} catch (error) {
|
||||
console.error('💥 Erro crítico ao ativar workflow do usuário:', error);
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user