M4TCH.AI

M4TCH.AI

WebSockets & REST

Chat em Tempo Real

A comunicação instantânea do M4TCH.AI é gerenciada pela MessagesScreen.tsx. Ela mescla o poder das rotas RESTful para carregar o histórico com a eficiência do Socket.io para entregar mensagens e notificações na mesma fração de segundo.

Engenharia de Frontend: Atualização Otimista

Para garantir que o app pareça "mais rápido que a internet", utilizamos duas lógicas cruciais no handleSend e no WebSockets:

Na Sala de Bate-Papo

Ao enviar a mensagem, o balão já aparece na tela instantaneamente e faz o scroll para o fim (scrollToEnd), mesmo antes da resposta do servidor.

Na Lista de Contatos

O contato que recebeu ou enviou a mensagem é "arrancado" de onde estiver e colocado no topo da fila (unshift) imediatamente.

1. Eventos do WebSockets (Socket.io)

CONNECTION ws://62.72.51.220:3000

Inicializada no AppProvider. Mantém um túnel TCP aberto com o servidor NodeJS para evitar o overhead de requisições HTTP.

LISTENER new_message

O hook useEffect da tela escuta ativamente este evento.

Se matchId == payload.match_id: Anexa o balão na conversa atual.
Caso contrário: Adiciona badge rosa unread_count + 1 na lista de contatos.

2. Endpoints RESTful (Carga Base)

GET /api/chat/contacts/{userId}

Carrega a lista mestre de conexões. Traz a foto, o nome e a última mensagem trocada. A UI exibe um estado vazio premium ("Nenhuma conversa") caso o array volte limpo.

Response (Array)
{
  "ok": true,
  "contacts": [
    {
      "match_id": 99,
      "partner_name": "Isabella",
      "partner_photo": "url_da_foto.jpg",
      "last_message": "Oi! Que legal o seu perfil.",
      "last_message_time": "2026-03-20T10:15:00.000Z",
      "unread_count": 2
    }
  ]
}
GET /api/chat/history/{matchId}

Quando o usuário entra em uma sala específica (passando o matchId via Route Params), este endpoint busca o array do histórico. Logo em seguida, o app dispara a rota /api/chat/read/{matchId} em background para limpar a badge rosa de não lidas localmente e no banco.

POST /api/chat/send

Acionado pelo botão do gradiente no input da sala. O backend registra a mensagem na base de dados, emite um aviso para o servidor de notificações Push da Apple e dispara o broadcast via Sockets.

Request Body
{
  "match_id": 99,
  "sender_id": 42,
  "content": "Que lugar incrível é esse da foto?"
}
Response
{
  "ok": true,
  "messageId": 1054
}