Use canonical URLs (#1883)

[lemmy-ui.git] / src / shared / components / common / html-tags.tsx
diff --git a/src/shared/components/common/html-tags.tsx b/src/shared/components/common/html-tags.tsx

index 0e6cb2d03ad381528ed3f78447e0c0bc18d2b1bf..80649fa119e85cfa8e0214065aeeaad2edf45a47 100644 (file)
--- a/src/shared/components/common/html-tags.tsx
+++ b/src/shared/components/common/html-tags.tsx
@@ -1,12 +1,14 @@
+import { httpExternalPath } from "@utils/env";
  import { htmlToText } from "html-to-text";
  import { Component } from "inferno";
  import { Helmet } from "inferno-helmet";
-import { httpExternalPath } from "../../env";
-import { getLanguages, md } from "../../utils";
+import { md } from "../../markdown";
+import { I18NextService } from "../../services";
  
  interface HtmlTagsProps {
    title: string;
    path: string;
+  canonicalPath?: string;
    description?: string;
    image?: string;
  }
@@ -15,13 +17,14 @@ interface HtmlTagsProps {
  export class HtmlTags extends Component<HtmlTagsProps, any> {
    render() {
      const url = httpExternalPath(this.props.path);
+    const canonicalUrl =
+      this.props.canonicalPath ?? httpExternalPath(this.props.path);
      const desc = this.props.description;
      const image = this.props.image;
-    const lang = getLanguages()[0];
  
      return (
        <Helmet title={this.props.title}>
-        <html lang={lang == "browser" ? "en" : lang} />
+        <html lang={I18NextService.i18n.resolvedLanguage} />
  
          {["title", "og:title", "twitter:title"].map(t => (
            <meta key={t} property={t} content={this.props.title} />
@@ -30,6 +33,8 @@ export class HtmlTags extends Component<HtmlTagsProps, any> {
            <meta key={u} property={u} content={url} />
          ))}
  
+        <link rel="canonical" href={canonicalUrl} />
+
          {/* Open Graph / Facebook */}
          <meta property="og:type" content="website" />