Fix website (#4615)

* Update website to work

.gitignore

@@ -34,3 +34,7 @@ reports
 test/e2e/drivers/*
 
 package-lock.json
+
+# Website dependencies
+website/.cache
+website/public

netlify.toml

@@ -1,5 +1,5 @@
 # Global settings applied to the whole site.
 [build]
-  base = "www"
-  publish = "www/public"
+  base = "website"
+  publish = "website/public"
   command = "gatsby build"

website/.babelrc

@@ -0,0 +1,7 @@
+{
+  "presets": [
+    "es2015",
+    "stage-0",
+    "react",
+  ],
+}

www/components/Navbar/index.js → website/components/Navbar/index.js

@@ -14,7 +14,6 @@ import Menu from './Menu';
 import { api, documentation, gettingStarted, guides } from '../../data/navigation';
 
 const sections = [gettingStarted, guides, documentation, api];
-console.table(sections);
 
 class Navbar extends Component {
 	constructor (props) {

website/gatsby-config.js

@@ -0,0 +1,24 @@
+module.exports = {
+	siteMetadata: {
+		title: 'KeystoneJS',
+	},
+	plugins: [
+		'gatsby-plugin-react-helmet',
+		'gatsby-plugin-glamor',
+		{
+			resolve: `gatsby-source-filesystem`,
+			options: {
+				name: `docs`,
+				path: `${__dirname}/../docs`,
+			},
+		},
+		{
+			resolve: `gatsby-source-filesystem`,
+			options: {
+				name: `fields`,
+				path: `${__dirname}/../fields/types`,
+			},
+		},
+		'gatsby-transformer-remark',
+	],
+};

website/gatsby-node.js

@@ -0,0 +1,92 @@
+/**
+ * Implement Gatsby's Node APIs in this file.
+ *
+ * See: https://www.gatsbyjs.org/docs/node-apis/
+ */
+const kebabCase = require('lodash.kebabcase');
+const path = require('path');
+
+exports.onCreateNode = (
+	{ node, boundActionCreators, getNode } /* : NodeParams */
+) => {
+	const { createNodeField } = boundActionCreators;
+
+
+	if (node.internal.type === 'MarkdownRemark') {
+		const fileNode = getNode(node.parent);
+
+		const parsedFilePath = path.parse(fileNode.relativePath);
+		let section = parsedFilePath.dir;
+		let slug;
+
+		if (
+			parsedFilePath.name.match(/Readme/i)
+			&& fileNode.dir.match(/\/fields\/types\//)
+		) {
+			section = 'api/field'; // fake the path for slug consistency
+			slug = `/${section}/${kebabify(parsedFilePath.dir)}`;
+		} else {
+			if (parsedFilePath.name === 'index') {
+				slug = `/${kebabify(parsedFilePath.dir)}`;
+			} else {
+				slug = `/${kebabify(parsedFilePath.dir)}/${kebabify(
+					parsedFilePath.name
+				)}`;
+			}
+		}
+		// If file isn't in subdirectory "dir" will be empty.
+		slug = slug.replace('//', '/');
+
+		createNodeField({ node, name: 'slug', value: slug });
+		createNodeField({ node, name: 'section', value: section });
+	}
+};
+
+exports.createPages = (
+	{ graphql, boundActionCreators } /* : NodeParams */
+) /* : Promise<any> */ => {
+	const { createPage } = boundActionCreators;
+
+	return new Promise((resolve, reject) => {
+		const articleComponent = path.resolve('templates/template-doc-layout.js');
+		resolve(
+			graphql(
+				`
+					{
+						allMarkdownRemark(limit: 1000) {
+							edges {
+								node {
+									fields {
+										slug
+									}								}
+							}
+						}
+					}
+				`
+			).then(result => {
+				if (result.errors) {
+					/* eslint-disable-next-line no-console */
+					console.log(result.errors);
+					reject(result.errors);
+				}
+
+				result.data.allMarkdownRemark.edges.forEach(edge => {
+					createPage({
+						path: edge.node.fields.slug, // required
+						component: articleComponent,
+						context: {
+							slug: edge.node.fields.slug,
+						},
+					});
+				});
+			})
+		);
+	});
+};
+
+function kebabify (string) {
+	return string
+		.split('/')
+		.map(s => kebabCase(s))
+		.join('/');
+}

website/package.json

@@ -0,0 +1,38 @@
+{
+  "name": "gatsby-starter-default",
+  "description": "Gatsby default starter",
+  "version": "1.0.0",
+  "author": "Kyle Mathews <[email protected]>",
+  "dependencies": {
+    "babel-preset-es2015": "^6.24.1",
+    "babel-preset-react": "^6.24.1",
+    "babel-preset-stage-0": "^6.24.1",
+    "gatsby": "^1.9.247",
+    "gatsby-link": "^1.6.40",
+    "gatsby-plugin-glamor": "^1.6.13",
+    "gatsby-plugin-react-helmet": "^2.0.10",
+    "gatsby-source-filesystem": "^1.5.31",
+    "gatsby-transformer-remark": "^1.7.40",
+    "lodash.kebabcase": "^4.1.1",
+    "react-document-title": "^2.0.3",
+    "react-entypo": "^1.3.0",
+    "react-helmet": "^5.2.0",
+    "react-icons": "^2.2.7",
+    "react-tweet-embed": "^1.1.0",
+    "typeface-roboto": "^0.0.54",
+    "typography": "^0.16.6",
+    "typography-breakpoint-constants": "^0.15.10",
+    "typography-plugin-code": "^0.16.11"
+  },
+  "keywords": [
+    "gatsby"
+  ],
+  "license": "MIT",
+  "scripts": {
+    "build": "gatsby build",
+    "develop": "gatsby develop",
+    "format": "prettier --write 'src/**/*.js'",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "devDependencies": {}
+}

www/layouts/components/Navbar.js → website/src/layouts/components/Navbar.js

@@ -1,7 +1,7 @@
 import React, { PropTypes } from 'react';
 import Link from 'gatsby-link';
-import theme from '../../theme';
-import invertedLogo from '../../images/logo-inverted.svg';
+import theme from '../../../theme';
+import invertedLogo from '../../../images/logo-inverted.svg';
 
 function Item ({ path, label }) {
 	return (

www/pages/components/home/AdminInterface.js → website/src/pages/components/home/AdminInterface.js

@@ -1,8 +1,8 @@
 import React, { Component } from 'react';
-import Container from '../../../components/Container';
-import theme from '../../../theme';
+import Container from '../../../../components/Container';
+import theme from '../../../../theme';
 import { compose } from 'glamor';
-import adminView from '../../../images/keystone_admin.png';
+import adminView from '../../../../images/keystone_admin.png';
 
 
 export default class ValueProps extends Component {

www/pages/components/home/CommunityResponse.js → website/src/pages/components/home/CommunityResponse.js

@@ -1,6 +1,6 @@
 import React, { Component } from 'react';
-import Container from '../../../components/Container';
-import { Col, Row } from '../../../components/Grid';
+import Container from '../../../../components/Container';
+import { Col, Row } from '../../../../components/Grid';
 import Link from 'gatsby-link';
 import TweetEmbed from 'react-tweet-embed';
 

www/pages/components/home/Footer.js → website/src/pages/components/home/Footer.js

@@ -1,8 +1,8 @@
 import React, { Component } from 'react';
-import Container from '../../../components/Container';
+import Container from '../../../../components/Container';
 import { compose } from 'glamor';
 import Link from 'gatsby-link';
-import theme from '../../../theme';
+import theme from '../../../../theme';
 
 export default class ValueProps extends Component {
 	render () {

www/pages/components/home/ValueProps.js → website/src/pages/components/home/ValueProps.js

@@ -1,8 +1,8 @@
 import React, { Component } from 'react';
-import Container from '../../../components/Container';
-import { Col, Row } from '../../../components/Grid';
+import Container from '../../../../components/Container';
+import { Col, Row } from '../../../../components/Grid';
 import { compose } from 'glamor';
-import theme from '../../../theme';
+import theme from '../../../../theme';
 
 import {
 	EntypoLeaf,

www/pages/components/home/ValueProps2.js → website/src/pages/components/home/ValueProps2.js

@@ -1,10 +1,10 @@
 import React, { Component } from 'react';
-import Container from '../../../components/Container';
-import { Col, Row } from '../../../components/Grid';
-import theme from '../../../theme';
+import Container from '../../../../components/Container';
+import { Col, Row } from '../../../../components/Grid';
+import theme from '../../../../theme';
 import { compose } from 'glamor';
 import { EntypoTools, EntypoCloud, EntypoRocket } from 'react-entypo';
-import { rhythm } from 'utils/typography';
+import { rhythm } from '../../../../utils/typography';
 
 const ValueProp = ({ icon, text, title, text2, marginTop }) => {
 	return (

www/pages/components/home/WhereNext.js → website/src/pages/components/home/WhereNext.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
-import Container from '../../../components/Container';
+import Container from '../../../../components/Container';
 import Link from 'gatsby-link';
-import { Col, Row } from '../../../components/Grid';
+import { Col, Row } from '../../../../components/Grid';
 import { compose } from 'glamor';
 
 export default class ValueProps extends Component {

www/pages/components/home/header/Header.js → website/src/pages/components/home/header/Header.js

@@ -1,19 +1,19 @@
 import React, { Component } from 'react';
-import Container from '../../../../components/Container';
+import Container from '../../../../../components/Container';
 import { compose } from 'glamor';
 import Link from 'gatsby-link';
-import theme from '../../../../theme';
-import { rhythm } from 'utils/typography';
-import { version } from '../../../../../package.json';
-import logo from '../../../../images/logo-inverted.svg';
+import theme from '../../../../../theme';
+import { rhythm } from '../../../../../utils/typography';
+import { version } from '../../../../../../package.json';
+import logo from '../../../../../images/logo-inverted.svg';
 import { EntypoTwitter, EntypoGithub, EntypoDocuments } from 'react-entypo';
 
-import continental from '../../../../images/brand-continental.png';
-import event_cinemas from '../../../../images/brand-event_cinemas.png';
-import macmillan from '../../../../images/brand-macmillan.png';
-import sony from '../../../../images/brand-sony.png';
-import vodafone from '../../../../images/brand-vodafone.png';
-import westpac from '../../../../images/brand-westpac.png';
+import continental from '../../../../../images/brand-continental.png';
+import event_cinemas from '../../../../../images/brand-event_cinemas.png';
+import macmillan from '../../../../../images/brand-macmillan.png';
+import sony from '../../../../../images/brand-sony.png';
+import vodafone from '../../../../../images/brand-vodafone.png';
+import westpac from '../../../../../images/brand-westpac.png';
 
 export default class Header extends Component {
 	render () {