Fix og:url on SSR (#10902)
Toru Kobayashi committed
Sep 30, 2017 at 10:38 UTC
ed4174511afd5ef3fc1dd4b0e1bba8254dbd6377
9 files changed
+28
-8
www/src/components/MarkdownPage/MarkdownPage.js
+3
-3
@@ -20,7 +20,7 @@ import TitleAndMetaTags from 'components/TitleAndMetaTags';
20
import findSectionForPath from 'utils/findSectionForPath';
21
import toCommaSeparatedList from 'utils/toCommaSeparatedList';
22
import {sharedStyles} from 'theme';
23
-import {urlRoot} from 'constants';
23
+import createOgUrl from 'utils/createOgUrl';
24
25
const MarkdownPage = ({
26
authors,
@@ -48,9 +48,9 @@ const MarkdownPage = ({
48
zIndex: 0,
49
}}>
50
<TitleAndMetaTags
51
- title={`${titlePrefix}${titlePostfix}`}
52
- ogUrl={`${urlRoot}/${markdownRemark.fields.path || ''}`}
51
ogDescription={ogDescription}
52
+ ogUrl={createOgUrl(markdownRemark.fields.slug)}
53
+ title={`${titlePrefix}${titlePostfix}`}
54
/>
55
<div css={{flex: '1 0 auto'}}>
56
<Container>
www/src/site-constants.js
renamed
www/src/templates/blog.js
+1
@@ -66,6 +66,7 @@ export const pageQuery = graphql`
66
fields {
67
date(formatString: "MMMM DD, YYYY")
68
path
69
+ slug
70
}
71
}
72
allMarkdownRemark(
www/src/templates/community.js
+1
@@ -41,6 +41,7 @@ export const pageQuery = graphql`
41
}
42
fields {
43
path
44
+ slug
45
}
46
}
47
}
www/src/templates/docs.js
+1
@@ -41,6 +41,7 @@ export const pageQuery = graphql`
41
}
42
fields {
43
path
44
+ slug
45
}
46
}
47
}
www/src/templates/home.js
+3
-3
@@ -17,7 +17,7 @@ import PropTypes from 'prop-types';
17
import React, {Component} from 'react';
18
import TitleAndMetaTags from 'components/TitleAndMetaTags';
19
import {colors, media, sharedStyles} from 'theme';
20
-import {urlRoot} from 'constants';
20
+import createOgUrl from 'utils/createOgUrl';
21
22
class Home extends Component {
23
componentDidMount() {
@@ -35,7 +35,7 @@ class Home extends Component {
35
<div css={{width: '100%'}}>
36
<TitleAndMetaTags
37
title={title}
38
- ogUrl={`${urlRoot}/${data.markdownRemark.fields.path}`}
38
+ ogUrl={createOgUrl(data.markdownRemark.fields.slug)}
39
/>
40
<header
41
css={{
@@ -201,7 +201,7 @@ export const pageQuery = graphql`
201
title
202
}
203
fields {
204
- path
204
+ slug
205
}
206
}
207
}
www/src/templates/installation.js
+3
-2
@@ -21,7 +21,7 @@ import {createLinkDocs} from 'utils/createLink';
21
import findSectionForPath from 'utils/findSectionForPath';
22
import {sectionListDocs} from 'utils/sectionList';
23
import {sharedStyles} from 'theme';
24
-import {urlRoot} from 'constants';
24
+import createOgUrl from 'utils/createOgUrl';
25
26
// HACK: copied from 'installation.md'
27
// TODO: clean this up.
@@ -141,7 +141,7 @@ class InstallationPage extends Component {
141
}}>
142
<TitleAndMetaTags
143
title="Installation - React"
144
- ogUrl={`${urlRoot}/${markdownRemark.fields.path || ''}`}
144
+ ogUrl={createOgUrl(markdownRemark.fields.slug)}
145
/>
146
<div css={{flex: '1 0 auto'}}>
147
<Container>
@@ -211,6 +211,7 @@ export const pageQuery = graphql`
211
}
212
fields {
213
path
214
+ slug
215
}
216
}
217
}
www/src/templates/tutorial.js
+1
@@ -52,6 +52,7 @@ export const pageQuery = graphql`
52
}
53
fields {
54
path
55
+ slug
56
}
57
}
58
}
www/src/utils/createOgUrl.js
new
+15
@@ -0,0 +1,15 @@
1
+/**
2
+ * Copyright (c) 2013-present, Facebook, Inc.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ * @emails react-core
8
+ */
9
+
10
+'use strict';
11
+
12
+import {urlRoot} from 'site-constants';
13
+
14
+export default slug =>
15
+ (slug == null ? null : `${urlRoot}/${slug.replace(/^\//, '')}`);