Merge branch 'master' of https://github.com/reactjs/reactjs.org into sync-6e79d088

Author: reactjs-translation-bot

src/components/TitleAndMetaTags/TitleAndMetaTags.js

@@ -7,6 +7,9 @@
 
 import Helmet from 'react-helmet';
 import React from 'react';
+import {urlRoot} from 'site-constants';
+// $FlowFixMe This is a valid path
+import languages from '../../../content/languages.yml';
 
 const defaultDescription =
   'Một thư viện JavaScript xây dựng giao diện người dùng';
@@ -17,6 +20,32 @@ type Props = {
   canonicalUrl: string,
 };
 
+// only provide alternate links to pages in languages where 95-100% of core content has been translated
+// which is determined by status enum of 2
+const completeLanguages = languages.filter(language => {
+  return language.status == 2;
+});
+
+const alternatePages = canonicalUrl => {
+  return completeLanguages.map(language => (
+    <link
+      key={('alt-', language.code)}
+      rel="alternate"
+      hreflang={language.code}
+      href={canonicalUrl.replace(
+        urlRoot,
+        `https://${
+          language.code === 'en' ? '' : `${language.code}.`
+        }reactjs.org`,
+      )}
+    />
+  ));
+};
+
+const defaultPage = canonicalUrl => {
+  return canonicalUrl.replace(urlRoot, 'https://reactjs.org');
+};
+
 const TitleAndMetaTags = ({title, ogDescription, canonicalUrl}: Props) => {
   return (
     <Helmet title={title}>
@@ -30,6 +59,14 @@ const TitleAndMetaTags = ({title, ogDescription, canonicalUrl}: Props) => {
       />
       <meta property="fb:app_id" content="623268441017527" />
       {canonicalUrl && <link rel="canonical" href={canonicalUrl} />}
+      {canonicalUrl && (
+        <link
+          rel="alternate"
+          href={defaultPage(canonicalUrl)}
+          hreflang="x-default"
+        />
+      )}
+      {canonicalUrl && alternatePages(canonicalUrl)}
     </Helmet>
   );
 };

src/pages/languages.js

@@ -140,7 +140,11 @@ const Language = ({code, name, status, translatedName}) => {
         }}>
         {status === 0 && translatedName}
         {status > 0 && (
-          <a href={`https://${prefix}reactjs.org/`} rel="nofollow">
+          <a
+            href={`https://${prefix}reactjs.org/`}
+            rel="nofollow"
+            lang={code}
+            hrefLang={code}>
             {translatedName}
           </a>
         )}