Sélecteur de localisation d'en-tête

Composant de thème
1

|||
| — | — | — |
| :information_source: |Résumé|Header Locale Selector ajoute un sélecteur de langue à l’en-tête du site. |
|:eyeglasses:|Aperçu|Aperçu sur theme-creator.discourse.org |
|:hammer_and_wrench:|Lien vers le dépôt|https://github.com/Ahmedgagan/header-locale-selector|
|:open_book:|Nouveau sur les thèmes Discourse ?|Guide pour débutants sur l’utilisation des thèmes Discourse |

Installer ce composant de thème

Ce composant de thème ajoute une liste déroulante des langues disponibles à l’en-tête du site. Il sera très utile pour les utilisateurs qui ne connaissent pas la langue par défaut du site.

Remarque : Cette fonctionnalité n’est disponible que pour les utilisateurs connectés.

Sponsor

Un merci spécial à @Richard_Millington pour le parrainage de ce composant.

13 « J'aime »
2

Rendre cela plus visible et inclure des drapeaux pourrait vraiment aider les gens sur les forums multilingues.

Excellent ajout à l’écosystème. :+1:

5 « J'aime »
6

C’est une fonctionnalité incroyable et fantastique ! Je recommande que l’équipe envisage d’ajouter ce composant, au minimum, comme un composant de thème préinstallé dans le cœur !

Merci beaucoup de l’avoir publié !
:vulcan_salute::star_struck::+1:

2 « J'aime »
7

J’ai une petite demande de fonctionnalité.

Serait-il possible d’ajuster le lien déroulant sur mobile ?

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

Si j’active le plugin de chat, cela va devenir très encombré. Peut-être même le rendre configurable pour utiliser des drapeaux sur ordinateur avec le mobile utilisant les 2 lettres, similaire à ce qui était fait plus tôt avec Windows ? Ça fait un bail. lol

Bien que la mise à l’échelle pourrait fonctionner pour être similaire en taille à la loupe de recherche.

8

Just some feedback from one of our members.

Great component

the selection of languages with the flags is cool, unfortunately contains some errors. Croatia has not received a flag.
Catalonia is a part of Spain.

Also can you share some code to reduce flag size on Mobile?

9

Serait-il possible d’avoir une option pour utiliser le code du pays au lieu des drapeaux ? Similaire au langage du clavier sous Windows.
ie en es etc.. Le drapeau est énorme sur mobile. Ou une option pour réduire la taille du drapeau.

Même un remplacement CSS serait utile. Merci

1 « J'aime »
10

Oui, ce commutateur doit être modifié pour correspondre au style général du discours. Il est terrible maintenant

1 « J'aime »
11

Captures d’écran de l’apparence actuelle à titre de référence :

Bureau :

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

Ce composant ne fonctionne pas pour moi. Y a-t-il autre chose à faire que de l’allumer et de sélectionner un modèle ?

image
image1053×551 29 KB

13

Il a besoin au moins d’une refonte partielle. Si quelqu’un veut contribuer et envoyer des PR pour corriger diverses choses, c’est le bienvenu :slight_smile:

1 « J'aime »
14

Marqué comme #cassé pour l’instant

15

Le composant est cassé, mais marqué comme compatible avec la dernière version

16

@volanar Ce n’est pas le même composant.

1 « J'aime »
17

Je retire le tag broken.

Pour commencer, le composant n’a jamais été cassé !
Il y a eu un malentendu concernant un autre composant de thème Discourse que Volanar a signalé comme cassé.

J’ai testé le composant, qui fonctionne toujours sur la dernière version de Discourse.
Cependant, il nécessite toujours quelques mises à jour pour le moderniser, résoudre une dépréciation et corriger des problèmes mineurs afin qu’il fonctionne bien sur la dernière version de Discourse.

Je suis allé de l’avant et j’ai fait une PR (sponsorisée par @Richard_Millington) :+1:

6 « J'aime »
20

La PR a été fusionnée ; merci, Ahmed. :+1:

4 « J'aime »
21

comment utiliser 2 ou 3 langues et supprimer les autres ?
au fait, j’ai optimisé le code pour 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)
    );
  }
}

après l’avoir testé, Discourse reste figé
une idée ?

22

available_locales a cette structure :

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

Donc dans votre code, vous devrez utiliser locale.value. :+1:

23

@Ahmed_Gagan Il semble qu’il y ait un nouveau problème avec ce composant de thème :

24

Juste une note ici que ce composant de thème n’est plus nécessaire et est pris en charge par le cœur dans les paramètres du site listés ci-dessus. (Docs)