Add title to changelog page

Author: Ives van Hoorne

packages/homepage/src/components/TitleAndMetaTags.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import Helmet from 'react-helmet';
+
+export default ({ title }: { title: string }) => (
+  <Helmet
+    title={title}
+    meta={[
+      {
+        name: 'description',
+        content:
+          'CodeSandbox is an online editor with a focus on creating and sharing web application projects',
+      },
+      {
+        name: 'keywords',
+        content:
+          'react, codesandbox, editor, code, javascript, playground, sharing, spa, single, page, application, web, application, frontend, front, end',
+      },
+    ]}
+  />
+);

packages/homepage/src/layouts/index.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import Helmet from 'react-helmet';
 import styled, { ThemeProvider } from 'styled-components';
 
 import theme from 'common/theme';
@@ -25,22 +24,6 @@ const Header = () => (
 const TemplateWrapper = ({ children }) => (
   <ThemeProvider theme={theme}>
     <div>
-      <Helmet
-        title="CodeSandbox: Online Editor Tailored for Web Application Development"
-        meta={[
-          {
-            name: 'description',
-            content:
-              'CodeSandbox is an online editor with a focus on creating and sharing web application projects',
-          },
-          {
-            name: 'keywords',
-            content:
-              'react, codesandbox, editor, code, javascript, playground, sharing, spa, single, page, application, web, application, frontend, front, end',
-          },
-        ]}
-      />
-
       <Header />
       <div style={{ maxWidth: '100vw', overflowX: 'hidden' }}>{children()}</div>
     </div>

packages/homepage/src/pages/changelog.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import styled from 'styled-components';
 
+import TitleAndMetaTags from '../components/TitleAndMetaTags';
 import PageContainer from '../components/PageContainer';
 import { Heading1 } from '../components/headings';
 
@@ -119,6 +120,7 @@ export default ({ data }) => {
 
   return (
     <Container>
+      <TitleAndMetaTags title="CodeSandbox - Recent Updates" />
       <PageContainer width={1024}>
         <Heading1>Recent Updates</Heading1>
         <Description>

packages/homepage/src/pages/index.js

@@ -7,6 +7,7 @@ import ExtraFeatures from '../screens/home/ExtraFeatures';
 import Footer from '../screens/home/Footer';
 import RecentPublications from '../screens/home/RecentPublications';
 import Patron from '../screens/home/Patron';
+import TitleAndMetaTags from '../components/TitleAndMetaTags';
 
 export default class HomePage extends React.PureComponent {
   componentDidMount() {
@@ -33,6 +34,8 @@ export default class HomePage extends React.PureComponent {
   render() {
     return (
       <div>
+        <TitleAndMetaTags title="CodeSandbox: Online Editor Tailored for Web Application Development" />
+
         <Animation />
         <NPMFeature />
         <CycleFeature />