Seletor de Locales do Cabeçalho

Componente de tema
1

|||
| — | — | — |
| :information_source: |Resumo|Header Locale Selector adiciona um seletor de idioma ao cabeçalho do site. |
|:eyeglasses:|Prévia|Prévia em theme-creator.discourse.org |
|:hammer_and_wrench:|Link do Repositório|https://github.com/Ahmedgagan/header-locale-selector|
|:open_book:|Novo no Discourse Themes?|Guia para iniciantes sobre como usar temas do Discourse |

Instalar este componente de tema

Este componente de tema adiciona um menu suspenso de idioma disponível ao cabeçalho do site. Será muito útil para usuários que não estão familiarizados com o idioma padrão do site.

Observação: Este recurso está disponível apenas para usuários logados.

Patrocinador

Agradecimentos especiais a @Richard_Millington por patrocinar este componente.

13 curtidas
2

Tornar isso mais proeminente e incluir bandeiras poderia realmente ajudar as pessoas em fóruns multilíngues.

Ótima adição ao ecossistema. :+1:

5 curtidas
6

Esta é uma funcionalidade fantástica e incrível! É minha recomendação que a equipe considere adicionar este componente minimamente como um tema pré-instalado no core!

Muito obrigado por lançar isto!
:vulcan_salute::star_struck::+1:

2 curtidas
7

Tenho uma pequena solicitação de recurso.

Seria possível que o link suspenso pudesse ser ajustado no celular?

Screenshots_2023-01-22-15-28-34
Screenshots_2023-01-22-15-28-34794×387 89.9 KB

Se eu habilitar o plugin de chat, ele ficará muito lotado. Talvez até tê-lo configurável para usar bandeiras no desktop com o celular usando as 2 letras, semelhante ao que o Windows usava anteriormente? Faz tempo. lol

Embora o dimensionamento possa funcionar para ser semelhante em tamanho ao ícone de lupa de pesquisa.

8

Apenas um feedback de um dos nossos membros.

Ótimo componente

A seleção de idiomas com as bandeiras é legal, infelizmente contém alguns erros. A Croácia não recebeu uma bandeira.
Catalunha é uma parte da Espanha.

Você também pode compartilhar algum código para reduzir o tamanho da bandeira no celular?

9

Seria possível ter uma opção para usar o código do país em vez das bandeiras? Semelhante ao idioma do teclado no Windows.\n\nie en es etc.. A bandeira é enorme no celular. Ou uma opção para diminuir o tamanho da bandeira.\n\nAté mesmo um override de CSS seria útil. Obrigado

1 curtida
10

Sim, esta opção precisa ser modificada para corresponder ao estilo geral do discurso. Ele está terrível agora

1 curtida
11

Capturas de tela da aparência atual como referência:

Desktop:

image
image1372×506 32.5 KB

image
image1371×478 36.2 KB

Mobile:

image
image393×383 27 KB

image
image393×474 24.5 KB

12

Este componente não funciona para mim. Há algo mais a fazer além de ligá-lo e selecionar um modelo?

image
image1053×551 29 KB

13

Ele precisa de pelo menos um retrabalho parcial. Se alguém quiser contribuir e enviar PRs para corrigir várias coisas, será bem-vindo :slight_smile:

1 curtida
14

Marcado como broken por enquanto

15

O componente está quebrado, mas marcado como compatível com a versão mais recente

16

@volanar Esse não é o mesmo componente.

1 curtida
17

Estou removendo a tag broken.
Para começar, o componente nunca esteve quebrado!
Houve um mal-entendido sobre outro componente de tema do Discourse que Volanar relatou como quebrado.

Testei o componente, que ainda funciona na versão mais recente do Discourse.
No entanto, ele ainda requer algumas atualizações para modernizá-lo, resolver uma depreciação e corrigir pequenos problemas para que funcione bem na versão mais recente do Discourse.

Fui em frente e fiz um PR (patrocinado por @Richard_Millington) :+1:

6 curtidas
20

O PR foi mesclado; obrigado, Ahmed. :+1:

4 curtidas
21

como usar 2 ou 3 idiomas e remover outros idiomas?
a propósito, otimizei o código para locale-selector.js:

import Component from "@ember/component";
import { action } from "@ember/object";
import { inject as service } from "@ember/service";
import { ajax } from "discourse/lib/ajax";
import { userPath } from "discourse/lib/url";
import { isTesting } from "discourse-common/config/environment";

export default class LocaleSelector extends Component {
  @service currentUser;

  get availableLocales() {
    // Cache filtered locales for performance optimization
    if (!this._filteredLocales) {
      const allLocales = JSON.parse(this.siteSettings.available_locales);
      this._filteredLocales = allLocales.filter(locale => ['en', 'ar'].includes(locale));
    }
    return this._filteredLocales;
  }

  @action
  onChangeLocale(value) {
    this.set("currentUser.locale", value);
    ajax(userPath(`${this.currentUser.username_lower}.json`), {
      data: { locale: this.currentUser.locale },
      type: "PUT",
    }).then(() => {
      if (!isTesting()) {
        location.reload();
      }
    });
  }

  defaultItem() {
    const currentUserLocale = document.documentElement
      .getAttribute("lang")
      ?.replaceAll("-", "_");

    return (
      this.content.find((val) => val.value === currentUserLocale) ||
      this.content.find((val) => val.value === this.siteSettings.default_locale)
    );
  }
}

depois de testar, o discourse continua travando
alguma ideia?

22

available_locales tem esta estrutura:

[
  {
    name: "English (US)",
    value: "en"
  },
  ...
]

Portanto, em seu código, você precisará usar locale.value. :+1:

23

@Ahmed_Gagan Parece que há um novo problema com este componente de tema:

24

Apenas uma observação aqui que este componente de tema não é mais necessário e é suportado pelo núcleo nas configurações do site listadas acima. (Docs)