77
88import Helmet from 'react-helmet' ;
99import React from 'react' ;
10+ import { urlRoot } from 'site-constants' ;
11+ // $FlowFixMe This is a valid path
12+ import languages from '../../../content/languages.yml' ;
1013
1114const defaultDescription = 'A JavaScript library for building user interfaces' ;
1215
@@ -16,6 +19,32 @@ type Props = {
1619 canonicalUrl : string ,
1720} ;
1821
22+ // only provide alternate links to pages in languages where 95-100% of core content has been translated
23+ // which is determined by status enum of 2
24+ const completeLanguages = languages . filter ( language => {
25+ return language . status == 2 ;
26+ } ) ;
27+
28+ const alternatePages = canonicalUrl => {
29+ return completeLanguages . map ( language => (
30+ < link
31+ key = { ( 'alt-' , language . code ) }
32+ rel = "alternate"
33+ hreflang = { language . code }
34+ href = { canonicalUrl . replace (
35+ urlRoot ,
36+ `https://${
37+ language . code === 'en' ? '' : `${ language . code } .`
38+ } reactjs.org`,
39+ ) }
40+ />
41+ ) ) ;
42+ } ;
43+
44+ const defaultPage = canonicalUrl => {
45+ return canonicalUrl . replace ( urlRoot , 'https://reactjs.org' ) ;
46+ } ;
47+
1948const TitleAndMetaTags = ( { title, ogDescription, canonicalUrl} : Props ) => {
2049 return (
2150 < Helmet title = { title } >
@@ -29,6 +58,14 @@ const TitleAndMetaTags = ({title, ogDescription, canonicalUrl}: Props) => {
2958 />
3059 < meta property = "fb:app_id" content = "623268441017527" />
3160 { canonicalUrl && < link rel = "canonical" href = { canonicalUrl } /> }
61+ { canonicalUrl && (
62+ < link
63+ rel = "alternate"
64+ href = { defaultPage ( canonicalUrl ) }
65+ hreflang = "x-default"
66+ />
67+ ) }
68+ { canonicalUrl && alternatePages ( canonicalUrl ) }
3269 </ Helmet >
3370 ) ;
3471} ;
0 commit comments