2 Gerenciamento de Estado

Rafael Lopes edited this page 2026-06-02 09:08:14 -03:00

Table of Contents

• Gerenciamento de Estado
• Visao geral
• Sessao
• Chat
• WhatsApp Socket
• Painel administrativo
• Services HTTP
• Diretriz

Gerenciamento de Estado

Visao geral

O frontend nao usa Redux, Zustand ou Context global amplo.

O estado e mantido de forma local por:

• useState;
• useEffect;
• hooks especificos por modulo;
• sessionStorage para sessao autenticada.

Sessao

Arquivo:

src/modules/auth/services/sessionService.js

Responsavel por:

• ler usuario atual;
• ler token atual;
• identificar perfil;
• limpar sessao.

Chat

Arquivo principal:

src/modules/chat/hooks/useChat.js

Concentra:

• contatos/conversas;
• mensagens por contato;
• conversa ativa;
• envio de mensagem;
• assumir/liberar/fechar atendimento;
• transferencia;
• carregamento de midia.

WhatsApp Socket

Arquivo:

src/shared/hooks/useWhatsappSocket.js

Mantem estado de:

• conexao;
• QR Code;
• status do WhatsApp;
• ultima mensagem recebida.

Painel administrativo

O modulo management usa estado local por tela/componente.

Servicos em src/modules/management/services fazem a comunicacao com a API e retornam dados normalizados.

Services HTTP

Arquivo principal:

src/shared/services/apiClient.js

Responsavel por:

• montar URL a partir de VITE_API_URL;
• aplicar Content-Type: application/json quando necessario;
• fazer parse de JSON/texto;
• padronizar mensagens de erro;
• preservar status e payload no erro.

O Bearer Token nao fica espalhado pelos services. Ele e anexado pelo interceptor:

src/shared/services/authFetch.js

Quando a API retorna 401, a sessao e limpa e o usuario volta para /login.

Diretriz

Antes de adicionar uma ferramenta global de estado, prefira:

1. estado local na tela;
2. hook especifico do modulo;
3. service para API;
4. somente depois avaliar estado global.