Painel de chat
O painel de chat oferece troca de mensagens entre os participantes da sessão.
Localização
Fica no Tabs Panel (painel de abas), no lado direito da interface do editor.

Estrutura do painel
Lista de conversas
Mostra todas as conversas disponíveis:
| Elemento | Descrição |
|---|---|
| Group (grupo) | Ícone com várias pessoas, envia mensagens para todos os participantes |
| Direct chats (conversas diretas) | Avatares e nomes de cada participante |
| Online indicator (indicador de online) | Texto verde “Online” para usuários conectados |
| Unread badge (selo de não lidas) | Círculo vermelho com a contagem |
Sala de conversa

Quando uma conversa está selecionada:
| Componente | Posição | Descrição |
|---|---|---|
| Back arrow (seta de voltar) | Canto superior esquerdo | Volta para a lista de conversas |
| Avatar | Cabeçalho | Ícone do usuário ou do grupo |
| Name (nome) | Cabeçalho | “Group” ou o nome do participante |
| Status | Cabeçalho | “Online” quando conectado |
| PTT button (botão PTT) | Cabeçalho, à direita | Push-to-Talk, apertar para falar (só para o editor) |
| Messages (mensagens) | Corpo | Lista de mensagens com rolagem |
| Input (entrada) | Parte de baixo | Caixa de texto e envio |
Exibição das mensagens
Cada mensagem mostra:
- Sender name (nome do remetente) - Na primeira de uma sequência
- Avatar - Na primeira de uma sequência
- Message text (texto da mensagem) - Com detecção de links
- Time (horário) - Formato: “2:30 PM”
- Read indicator (indicador de leitura) - Marca de visto + “Read” nas mensagens diretas
Separadores de data
Formato: “December 17, 2025”
Push-to-Talk (PTT)
Disponível: quando o editor abre uma conversa direta com um participante online
| Estado | Ícone | Descrição |
|---|---|---|
| Disponível | i_ptt | Pressione e segure para falar |
| Ativo | Animação SiriWave | Fala em andamento |
| Indisponível | i_ptt_disabled | Participante offline |
Dica do PTT (indisponível): “Push-To-Talk is unavailable because guest is offline”
Arquivos anexos
Progresso do envio
- Miniatura de prévia do arquivo
- Nome e tamanho do arquivo
- Barra de progresso com porcentagem
- Botão de cancelar (ícone X)
Exibição dos arquivos
| Tipo de arquivo | Exibição |
|---|---|
| Imagens | Prévia em miniatura |
| Vídeos | Prévia em miniatura |
| Documentos | Ícone de documento + nome do arquivo + tamanho |
Estado vazio
Mensagem do chat em grupo vazio:
“Be the first one to write a message to the group”
Com a imagem de fundo do mensageiro.
Mensagens não lidas
Botão de rolar até o fim
- Botão azul redondo com uma seta para baixo
- Selo vermelho com a contagem de não lidas
- Aparece quando chegam mensagens novas enquanto você está mais acima na conversa
- Clique para rolar até o fim e marcar como lidas
Estilo
Balões de mensagem
| Tipo | Estilo |
|---|---|
| Enviada (usuário) | Fundo cinza, alinhada à direita |
| Recebida | Fundo em tom azulado, alinhada à esquerda |
Cabeçalho
- Contêiner arredondado (10px)
- Fundo cinza (modo escuro: #1E222B)
- Altura de 44px
Considerações para celular
- Layout com largura total
- Botão PTT otimizado para toque
- Sem espaçamento horizontal
- Altura do cabeçalho adaptada