Add Global Settings json

content/settings/global.json

@@ -0,0 +1,3 @@
+{
+  "siteTitle": "HyperStatic"
+}

src/App.js

@@ -13,8 +13,6 @@ import ServiceWorkerNotifications from './components/ServiceWorkerNotifications'
 import globalStyles from './globalStyles'
 import data from './data.json'
 
-export const siteTitle = 'HyperStatic'
-
 class App extends Component {
   state = {
     data
@@ -31,13 +29,14 @@ class App extends Component {
   getDocuments = (collection) => this.state.data[collection]
 
   render () {
+    const site = this.getDocument('settings', 'global')
     return (
       <Router>
         <div>
           <ScrollToTop />
           <ServiceWorkerNotifications />
           <GithubCorner url='https://github.com/Jinksi/hyperstatic' />
-          <Helmet titleTemplate={`${siteTitle} | %s`} />
+          <Helmet titleTemplate={`${site.siteTitle} | %s`} />
           <Nav />
           <Switch>
             <Route path='/' exact
@@ -47,7 +46,7 @@ class App extends Component {
               render={(props) => <About page={this.getDocument('pages', 'about')} {...props} />}
             />
             <Route path='/contact/' exact
-              render={(props) => <Contact page={this.getDocument('pages', 'contact')} {...props} />}
+              render={(props) => <Contact page={this.getDocument('pages', 'contact')} site={site} {...props} />}
             />
             <Route component={NoMatch} />
           </Switch>

src/components/NetlifyForm.js

@@ -2,7 +2,6 @@ import React, { Component } from 'react'
 import styled from 'styled-components'
 import { stringify } from 'qs'
 import { color } from '../globalStyles'
-import { siteTitle } from '../App'
 const fetch = window.fetch
 
 class Form extends Component {
@@ -10,7 +9,7 @@ class Form extends Component {
     name: '',
     email: '',
     message: '',
-    subject: `New Submission from ${siteTitle}!`,
+    subject: `New Submission from ${this.props.siteTitle}!`,
     _gotcha: '',
     disabled: false,
     alert: '',
@@ -60,7 +59,7 @@ class Form extends Component {
           name: '',
           email: '',
           message: '',
-          subject: `New Submission from ${siteTitle}!`,
+          subject: `New Submission from ${this.props.siteTitle}!`,
           _gotcha: ''
         })
       })

src/views/Contact.js

@@ -6,7 +6,7 @@ import NetlifyForm from '../components/NetlifyForm'
 import { Container, Section } from '../components/common'
 import Marked from 'react-markdown'
 
-export default ({ page }) => (
+export default ({ page, site }) => (
   <Page>
     <PageHeader title={page.title} subtitle='<Contact />' />
     <Section thin>
@@ -14,7 +14,7 @@ export default ({ page }) => (
         <Marked source={page.body} />
         <br />
         <h3>{'<NetlifyForm />'}</h3>
-        <NetlifyForm />
+        <NetlifyForm siteTitle={site.siteTitle} />
         <em>Note: this will only work when deployed on Netlify</em>
         <br />
         <em>Also, this form is active and I will receive submissions</em> 😉