# 🔔 Configuração de Push Notifications

## Passo 1: Configurar VAPID Keys

### 1.1 Gerar VAPID Keys (se ainda não tiver)

Execute no diretório do backend:
```bash
cd packages/backend
bunx web-push generate-vapid-keys
```

Isso gerará duas chaves:
- **Public Key**: Segura para expor no frontend
- **Private Key**: Deve ser mantida em segredo, apenas no backend

### 1.2 Configurar no Convex (Backend)

As variáveis de ambiente no Convex são configuradas via dashboard ou CLI:

#### Opção A: Via Dashboard Convex
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 Convex
```bash
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"
```

### 1.3 Configurar no Frontend

Crie um arquivo `.env` no diretório `apps/web/` com:

```env
VITE_VAPID_PUBLIC_KEY=BDerX0lK_hBCLpC7EbuxoJb2EJ7bcCLaHWxkNumVbvrx9w0MmJduHxJOP3WBwBP-SpQGcueMOyHCv7LFK3KnQks
```

**Importante**: Reinicie o servidor de desenvolvimento após criar/modificar o `.env`.

## Passo 2: Configurar FRONTEND_URL

A variável `FRONTEND_URL` é usada nos templates de email para gerar links de volta ao sistema.

### Para Desenvolvimento:
```
FRONTEND_URL=http://localhost:5173
```

### Para Produção:
```
FRONTEND_URL=https://seu-dominio.com
```

## Passo 3: Testar Push Notifications

### 3.1 Registrar Subscription no Frontend

O sistema automaticamente solicita permissão e registra a subscription quando:
1. O usuário faz login
2. Acessa o chat pela primeira vez
3. O Service Worker é instalado

### 3.2 Verificar se está funcionando

1. Abra o DevTools do navegador (F12)
2. Vá na aba **Application** > **Service Workers**
3. Verifique se o Service Worker está registrado
4. Vá em **Application** > **Notifications**
5. Verifique se a permissão está concedida

### 3.3 Testar envio de push

1. Abra o chat em duas abas/janelas diferentes
2. Faça login com usuários diferentes
3. Envie uma mensagem de um usuário para o outro
4. A mensagem deve aparecer como notificação push na outra aba

## Troubleshooting

### Push notifications não funcionam

1. **Verificar VAPID keys**: Certifique-se de que as keys estão configuradas corretamente
2. **Verificar Service Worker**: O arquivo `sw.js` deve estar em `/static/sw.js`
3. **Verificar permissões**: O navegador deve ter permissão para notificações
4. **Verificar console**: Procure por erros no console do navegador e do Convex

### Erro "VAPID keys não configuradas"

- Verifique se as variáveis de ambiente estão configuradas no Convex
- Reinicie o servidor Convex após configurar as variáveis
- Verifique se os nomes das variáveis estão corretos (case-sensitive)

### Service Worker não registra

- Verifique se o arquivo `sw.js` existe em `apps/web/static/sw.js`
- Verifique se o servidor está servindo arquivos estáticos corretamente
- Limpe o cache do navegador e tente novamente

## Segurança

⚠️ **IMPORTANTE**:
- A **Private Key** nunca deve ser exposta no frontend
- Use variáveis de ambiente diferentes para desenvolvimento e produção
- Regenere as keys se suspeitar de comprometimento
- Mantenha as keys em segredo (não commite no Git)