add issue link in footer, read in package.json as GraphQL data

gatsby-config.js

@@ -16,6 +16,20 @@ module.exports = {
     'gatsby-plugin-sharp',
     'gatsby-plugin-sitemap',
     'gatsby-plugin-offline',
+    {
+      resolve: 'gatsby-transformer-json',
+      options: {
+        plugins: [
+          {
+            resolve: 'gatsby-source-filesystem',
+            options: {
+              name: 'pkg',
+              path: path.join(__dirname, 'package.json'),
+            },
+          },
+        ],
+      },
+    },
     {
       resolve: 'gatsby-plugin-sass',
       options: {

package.json

@@ -1,7 +1,11 @@
 {
   "name": "portfolio",
   "version": "0.1.0",
-  "private": true,
+  "homepage": "https://matthiaskretschmann.com",
+  "repository": "github:kremalicious/portfolio",
+  "bugs": "https://github.com/kremalicious/portfolio/issues",
+  "license": "MIT",
+  "author": "Matthias Kretschmann <m@kretschmann.io>",
   "scripts": {
     "lint:js": "eslint ./gatsby-*.{js,jsx} && eslint ./src/**/*.{js,jsx}",
     "lint:css": "stylelint ./src/**/*.{css,scss}",
@@ -51,6 +55,7 @@
     "eslint-plugin-graphql": "^2.1.1",
     "eslint-plugin-prettier": "^2.6.0",
     "eslint-plugin-react": "^7.8.2",
+    "gatsby-transformer-json": "^1.0.17",
     "ora": "^2.1.0",
     "prepend": "^1.0.2",
     "prettier": "^1.12.1",

src/components/organisms/Footer.jsx

@@ -14,6 +14,7 @@ class Footer extends PureComponent {
 
   render() {
     const meta = this.props.meta
+    const pkg = this.props.pkg
 
     return (
       <footer className="footer">
@@ -23,6 +24,7 @@ class Footer extends PureComponent {
         <p className="footer__actions">
           <Vcard meta={meta} />
           <a href={meta.gpg}>PGP/GPG key</a>
+          <a href={pkg.bugs}>Found a bug?</a>
         </p>
         <p className="footer__copyright">
           <small>
@@ -36,6 +38,7 @@ class Footer extends PureComponent {
 
 Footer.propTypes = {
   meta: PropTypes.object,
+  pkg: PropTypes.object,
 }
 
 export default Footer

src/layouts/index.jsx

@@ -23,6 +23,7 @@ const Main = ({ children }) => <main className="screen">{children}</main>
 
 const TemplateWrapper = ({ data, location, children }) => {
   const meta = data.dataYaml
+  const pkg = data.portfolioJson
   const isHomepage = location.pathname === '/'
 
   return (
@@ -41,7 +42,7 @@ const TemplateWrapper = ({ data, location, children }) => {
         </FadeIn>
       </TransitionGroup>
 
-      <Footer meta={meta} />
+      <Footer meta={meta} pkg={pkg} />
     </Fragment>
   )
 }
@@ -65,6 +66,7 @@ export default withRouter(TemplateWrapper)
 
 export const query = graphql`
   query metaQuery {
+    # the data/meta.yml file
     dataYaml {
       title
       tagline
@@ -103,5 +105,13 @@ export const query = graphql`
       gpg
       addressbook
     }
+
+    # the package.json file
+    portfolioJson {
+      name
+      homepage
+      repository
+      bugs
+    }
   }
 `

src/templates/Project.jsx

@@ -92,6 +92,8 @@ export const projectQuery = graphql`
         }
       }
     }
+
+    # the data/meta.yml file
     dataYaml {
       title
       tagline