Add a locale filter to links (#30)

* Add a locale attribute to custom header links This attribute is to be set to a language code like 'fr', 'en' or 'de'. * Filter out links which locale is different from the html document's * prettier * more syntax --------- Co-authored-by: Lena Montenot <lena.montenot@commown.coop> Co-authored-by: Jordan Vidrine <jordan@jordanvidrine.com>

Author: 3 people

javascripts/discourse/initializers/discourse-custom-header-links.js

@@ -24,11 +24,18 @@ export default {
  .split("|")
  .filter(Boolean)
  .map((customHeaderLinksArray) => {
- const [linkText, linkTitle, linkHref, device, target, keepOnScroll] =
- customHeaderLinksArray
- .split(",")
- .filter(Boolean)
- .map((x) => x.trim());
+ const [
+ linkText,
+ linkTitle,
+ linkHref,
+ device,
+ target,
+ keepOnScroll,
+ locale,
+ ] = customHeaderLinksArray
+ .split(",")
+ .filter(Boolean)
+ .map((x) => x.trim());
 
  const deviceClass = `.${device}`;
  const linkTarget = target === "self" ? "" : "_blank";
@@ -37,6 +44,8 @@ export default {
  .toLowerCase()
  .replace(/\s/gi, "-")}-custom-header-links`;
 
+ const localeClass = locale === "" ? "" : `.${locale}`;
+
  const anchorAttributes = {
  title: linkTitle,
  href: linkHref,
@@ -45,9 +54,17 @@ export default {
  anchorAttributes.target = linkTarget;
  }
 
+ if (
+ locale !== "" &&
+ document.documentElement.lang &&
+ document.documentElement.lang !== locale
+ ) {
+ return;
+ }
+
  headerLinks.push(
  h(
- `li.headerLink${deviceClass}${keepOnScrollClass}${linkClass}`,
+ `li.headerLink${deviceClass}${keepOnScrollClass}${localeClass}${linkClass}`,
  h("a", anchorAttributes, linkText)
  )
  );

settings.yml

@@ -1,9 +1,9 @@
 Custom_header_links:
  type: list
  list_type: simple
- default: "External link, this link will open in a new tab, https://meta.discourse.org, vdo, blank, remove|Most Liked, Posts with the most amount of likes, /latest/?order=op_likes, vdo, self, keep|Privacy, Our Privacy Policy, /privacy, vdm, self, keep"
+ default: "External link, this link will open in a new tab, https://meta.discourse.org, vdo, blank, remove, en|Most Liked, Posts with the most amount of likes, /latest/?order=op_likes, vdo, self, keep, en|Privacy, Our Privacy Policy, /privacy, vdm, self, keep, en"
  description:
- en: "Comma delimited in this order: link text, link title, URL, view, target, hide on scroll<br><b>Link text:</b> The text for the link<br><b>Link title:</b> the text that shows when the link is hovered<br><b>URL:</b> The path for the link (can be relative)<br><b>View:</b> vdm = desktop and mobile, vdo = desktop only, vmo = mobile only<br><b>Target:</b> blank = opens in a new tab, self = opens in the same tab<br><b>Hide on scroll:</b> remove = hides the link when the title is expanded on topic pages keep = keeps the link visible even when the title is visible on topic pages"
+ en: "Comma delimited in this order: link text, link title, URL, view, target, hide on scroll<br><b>Link text:</b> The text for the link<br><b>Link title:</b> the text that shows when the link is hovered<br><b>URL:</b> The path for the link (can be relative)<br><b>View:</b> vdm = desktop and mobile, vdo = desktop only, vmo = mobile only<br><b>Target:</b> blank = opens in a new tab, self = opens in the same tab<br><b>Hide on scroll:</b> remove = hides the link when the title is expanded on topic pages keep = keeps the link visible even when the title is visible on topic pages<br><b>Language:</b> blank = no locale assoaciated to the link, else insert a locale code (en, fr, de, ...)"
 
 links_position:
  default: right