Files
sgse-app/PASSO_A_PASSO_CONFIGURACAO.md
deyvisonwanderley 12db52a8a7 refactor: enhance chat components with type safety and response functionality
- Updated type definitions in ChatWindow and MessageList components for better type safety.
- Improved MessageInput to handle message responses, including a preview feature for replying to messages.
- Enhanced the chat message handling logic to support message references and improve user interaction.
- Refactored notification utility functions to support push notifications and rate limiting for email sending.
- Updated backend schema to accommodate new features related to message responses and notifications.
2025-11-04 20:36:01 -03:00

4.0 KiB

📋 Passo a Passo - Configuração Completa

Passo 1: Configurar VAPID Keys

1.1 Configurar no Convex (Backend)

Opção A: Via Dashboard (Recomendado)

  1. Acesse https://dashboard.convex.dev
  2. Selecione seu projeto
  3. Vá em Settings > Environment Variables
  4. Adicione as seguintes variáveis:
VAPID_PUBLIC_KEY=BDerX0lK_hBCLpC7EbuxoJb2EJ7bcCLaHWxkNumVbvrx9w0MmJduHxJOP3WBwBP-SpQGcueMOyHCv7LFK3KnQks
VAPID_PRIVATE_KEY=KWkJLMxCuCPQQiRXIJEt06G4pTdW0FaUN_vMyY02sc4
FRONTEND_URL=http://localhost:5173

Opção B: Via CLI

Execute do diretório raiz do projeto:

cd packages/backend
npx convex env set VAPID_PUBLIC_KEY "BDerX0lK_hBCLpC7EbuxoJb2EJ7bcCLaHWxkNumVbvrx9w0MmJduHxJOP3WBwBP-SpQGcueMOyHCv7LFK3KnQks"
npx convex env set VAPID_PRIVATE_KEY "KWkJLMxCuCPQQiRXIJEt06G4pTdW0FaUN_vMyY02sc4"
npx convex env set FRONTEND_URL "http://localhost:5173"

Opção C: Usar Script Automático

Execute na raiz do projeto:

.\scripts\configurar-push-notifications.ps1

1.2 Configurar no Frontend

Crie o arquivo apps/web/.env com:

VITE_VAPID_PUBLIC_KEY=BDerX0lK_hBCLpC7EbuxoJb2EJ7bcCLaHWxkNumVbvrx9w0MmJduHxJOP3WBwBP-SpQGcueMOyHCv7LFK3KnQks

Importante: Reinicie o servidor frontend após criar/modificar o .env

Passo 2: Configurar FRONTEND_URL

A variável FRONTEND_URL já foi configurada no Passo 1.1. Ela é usada nos templates de email para gerar links de volta ao sistema.

Para Desenvolvimento:

FRONTEND_URL=http://localhost:5173

Para Produção (quando fizer deploy):

FRONTEND_URL=https://seu-dominio.com

Passo 3: Testar Funcionalidades

3.1 Verificar Configuração Inicial

  1. Inicie o Convex (se não estiver rodando):

    cd packages/backend
    bun run dev
    
  2. Inicie o Frontend (se não estiver rodando):

    cd apps/web
    bun run dev
    
  3. Verifique as variáveis de ambiente:

    • No Convex Dashboard: Settings > Environment Variables
    • No Frontend: Verifique se apps/web/.env existe

3.2 Testar Push Notifications

  1. Abra http://localhost:5173 no navegador
  2. Faça login no sistema
  3. Abra DevTools (F12) > Application > Service Workers
  4. Verifique se sw.js está registrado
  5. Verifique se a permissão de notificações foi solicitada

3.3 Testar Chat Completo

Siga o guia completo em GUIA_TESTE_PUSH_NOTIFICATIONS.md para testar:

  • Push notifications
  • Edição de mensagens
  • Soft delete
  • Respostas encadeadas
  • Preview de links
  • Busca full-text

🔍 Verificação Rápida

Execute estes comandos para verificar:

Verificar Variáveis no Convex:

cd packages/backend
npx convex env list

Deve mostrar:

  • VAPID_PUBLIC_KEY
  • VAPID_PRIVATE_KEY
  • FRONTEND_URL

Verificar Frontend:

cd apps/web
# Verifique se o arquivo .env existe
cat .env

🐛 Troubleshooting

Problema: Variáveis não aparecem no Convex

Solução:

  • Certifique-se de estar no projeto correto no dashboard
  • Reinicie o servidor Convex após configurar
  • Use npx convex env list para verificar

Problema: Frontend não encontra VAPID_PUBLIC_KEY

Solução:

  • Verifique se o arquivo .env está em apps/web/.env
  • Verifique se a variável começa com VITE_
  • Reinicie o servidor frontend
  • Limpe o cache do navegador

Problema: Service Worker não registra

Solução:

  • Verifique se apps/web/static/sw.js existe
  • Abra DevTools > Application > Service Workers
  • Clique em "Unregister" e recarregue a página
  • Verifique o console para erros

📝 Checklist Final

  • VAPID keys configuradas no Convex
  • FRONTEND_URL configurada no Convex
  • VITE_VAPID_PUBLIC_KEY no .env do frontend
  • Convex rodando
  • Frontend rodando
  • Service Worker registrado
  • Permissão de notificações concedida
  • Push notifications funcionando
  • Todas as funcionalidades testadas

🎉 Pronto!

Após completar os 3 passos, o sistema estará totalmente configurado e pronto para uso!