Componente de Banner da Página de Redirecionamento de Login e/ou Grupo

Este componente permite que você redirecione os usuários para onde quiser após o login e também permite que você coloque um banner de boas-vindas na página de grupos ( /g ).

Ele é construído com ambas as partes independentes, então você pode redirecionar para onde quiser ou usá-lo apenas para colocar um banner na página de grupos. O comportamento padrão é redirecionar novos usuários para a página de grupos, onde um banner de boas-vindas os incentiva a participar de grupos para ajudá-los a se engajar com sua comunidade.

Você também pode usar este componente para redirecionar usuários abaixo de um certo nível de confiança para uma página no login, ou usuários que ingressaram em menos de uma quantidade de grupos que você selecionar.

Redirecionamento de Primeiro Login

Um componente de tema do Discourse que redireciona usuários sem afiliação a grupos para uma página personalizada e exibe um banner de boas-vindas personalizável.

Funcionalidades

  • :counterclockwise_arrows_button: Redirecionamento Inteligente - Redireciona usuários sem afiliação a grupos para uma página personalizada no login
  • :artist_palette: Banner Personalizável - Banner de boas-vindas colorido na página de grupos
  • :gear: Totalmente Configurável - Habilita/desabilita o redirecionamento e o banner independentemente
  • :bust_in_silhouette: Lógica Baseada em Grupo - Para de redirecionar assim que o usuário entra em qualquer grupo
  • :bullseye: Consciência de Nível de Confiança - A visibilidade do banner pode ser restrita por nível de confiança
  • :rainbow: Gradiente Arco-Íris - Fundo com gradiente de 6 cores atraente (com alternância para cor sólida)
  • :mobile_phone: Responsivo para Dispositivos Móveis - O banner se adapta a telas de celular

Instalação

  1. No console de administração do Discourse, vá para Personalizar → Temas → Componentes e clique em Instalar

  2. Escolha De um repositório Git e cole:

    https://github.com/focallocal/first-login-redirect
    
  3. Uma vez instalado, adicione o componente ao seu tema ativo

Como Funciona

Lógica de Redirecionamento

  • Verifica se o usuário é membro de algum grupo
  • Detecta quando ele navega para a página inicial
  • Redireciona para a URL configurada (padrão: /g)
  • Para de redirecionar assim que ele entra em qualquer grupo
  • Pode ser desabilitado independentemente do banner

Banner de Boas-Vindas

  • Exibido na página de índice de grupos (/g) por padrão
  • A visibilidade é controlada pelas configurações de nível de confiança
  • Pode ser desabilitado independentemente do redirecionamento
  • Ocultado automaticamente assim que o usuário atinge o Nível de Confiança 1
  • Posicionado no topo da lista de grupos usando o outlet before-groups-index

Personalização

Configurações de Tema (Painel de Administração)

Toda a personalização pode ser feita no painel de administração do Discourse sem editar o código!

  1. Vá para Admin → Personalizar → Temas
  2. Clique no seu tema que inclui este componente
  3. Vá para Configurações e encontre a seção “Redirecionamento de Primeiro Login”

Configurações Disponíveis:

Configurações de Redirecionamento:

  • Habilitar Redirecionamento: Liga/desliga o recurso de redirecionamento (padrão: true)
  • Mínimo de Grupos Necessários: Quantos grupos criados pelo usuário ele deve ingressar antes que o redirecionamento pare (padrão: 1)
    • Grupos automáticos (como trust_level_0, everyone) não contam
  • URL de Redirecionamento: Para onde enviar usuários sem grupos (padrão: /g)
    • Exemplos: /g (grupos), /categories, /about, /latest

Configurações do Banner:

  • Mostrar Banner: Liga/desliga o banner (padrão: true)
  • Nível de Confiança Mínimo: Nível de confiança mínimo para ver o banner (0-4, padrão: 0)
  • Nível de Confiança Máximo: Nível de confiança máximo para ver o banner (0-4, padrão: 4)
  • Título do Banner: Texto principal grande
  • Subtítulo do Banner: Texto explicativo menor

Tipografia:

  • Tamanho da Fonte do Título: Tamanho do título principal (padrão: 2.5em)
  • Tamanho da Fonte do Subtítulo: Tamanho do subtítulo (padrão: 1.25em)
  • Sombra do Texto Habilitada: Alterna a sombra do texto para legibilidade
  • Brilho do Texto Habilitado: Alterna o efeito de brilho externo

Cores:

  • Usar Gradiente: Habilita/desabilita o gradiente (se desabilitado, usa cor sólida)
  • Cor do Gradiente 1-6: Personalize cada cor no gradiente
    • Padrão: Rosa → Laranja → Amarelo → Verde → Ciano
    • Defina “Usar Gradiente” como DESLIGADO para cor sólida usando a Cor 1

Layout:

  • Preenchimento do Banner: Espaço dentro do banner (padrão: 3rem 2rem)
  • Raio da Borda: Arredondamento dos cantos (padrão: 12px, use 0 para quadrado)

Exemplos

Mostrar apenas para TL0 (novos usuários):
Defina Nível de Confiança Mínimo = 0, Nível de Confiança Máximo = 0

Mostrar para todos, exceto administradores:
Defina Nível de Confiança Mínimo = 0, Nível de Confiança Máximo = 3

Banner de Cor Sólida:
Desligue “Usar Gradiente” e defina Cor 1 para sua cor desejada (ex: #FF5722 para laranja).

Gradiente de Duas Cores:
Ligue “Usar Gradiente” e defina as cores 1-3 para uma cor, e as cores 4-6 para outra.

Texto Maior:
Defina o título para 3em e o subtítulo para 1.5em.

Sem Efeitos:
Desabilite tanto “Sombra do Texto” quanto “Brilho do Texto” para texto plano.

Desabilitar Redirecionamento (Apenas Banner)

Exclua ou comente o arquivo:
javascripts/discourse/api-initializers/first-login-redirect.js

Alterar Requisito de Nível de Confiança

Em ambos os arquivos inicializadores, altere:

currentUser.trust_level === 0

para:

currentUser.trust_level <= 1  // TL0 e TL1

Detalhes Técnicos

  • Versão da API: 1.8.0 (API moderna do Discourse)
  • Tipo de Componente: Componente Glimmer com template tag
  • Plugin Outlet: before-groups-index
  • Compatibilidade: Discourse 2.8.0+

Solução de Problemas

P: Redirecionamento não está funcionando
R: Limpe o sessionStorage do seu navegador e teste com uma conta nova de Nível de Confiança 0

P: Banner não está aparecendo no teste
R: Verifique se você está na rota /g e logado como um usuário TL0, ou verifique os valores que você definiu no admin. Verifique o console do navegador em busca de erros.

P: Loop de redirecionamento
R: A verificação do sessionStorage deve evitar isso. Se ocorrer, limpe o cache do navegador e o sessionStorage.

Licença

MIT — Movimento pela Felicidade Pública

Olá, vejo que você já criou alguns Componentes de Tema. Você consideraria ingressar no grupo @theme_authors, para que possa criar tópicos na categoria #componente-de-tema? Obrigado.

1 curtida

Eu sou mais um gerente de projetos, mas a IA está facilitando muito a criação com um código mais conciso, então, claro. Obrigado.