🔥

src/routes/admin/Admin.css

@@ -0,0 +1,13 @@
+@import '../../components/variables.css';
+
+.root {
+  padding-left: 20px;
+  padding-right: 20px;
+}
+
+.container {
+  margin: 0 auto;
+  padding: 0 0 40px;
+  max-width: var(--max-content-width);
+}
+

src/routes/admin/Admin.js

@@ -0,0 +1,36 @@
+import React, { PropTypes } from 'react';
+import withStyles from 'isomorphic-style-loader/lib/withStyles';
+import s from './Admin.css';
+import Link from '../../components/Link';
+
+class Admin extends React.Component {
+  static propTypes = {
+    title: PropTypes.string.isRequired,
+    people: PropTypes.arrayOf(PropTypes.shape({
+      key: PropTypes.string.isRequired,
+      firstname: PropTypes.string,
+      lastname: PropTypes.string,
+      email: PropTypes.string,
+      password: PropTypes.string,
+      attending: PropTypes.boolean,
+    })).isRequired,
+  };
+
+  render() {
+    return (
+      <div className={s.root}>
+        <div className={s.container}>
+          <h1>{this.props.title}</h1>
+          <div>
+            <h2>People</h2>
+            <p>{this.props.people.length} people</p>
+            <p>{this.props.people.filter(person => person.completed).length} responses</p>
+            <Link to="/admin/people">Manage people</Link>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default withStyles(s)(Admin);

src/routes/admin/index.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import Layout from '../../components/Layout';
+import fetchQL from '../../core/fetchQL';
+import { starters, mains } from '../../config';
+
+const title = 'Admin';
+
+export default {
+
+  path: '/admin',
+
+  async action() {
+    const resp = await fetchQL('{getAllPersons{key,firstname,lastname,email,password,completed,starter,main}}');
+
+    const food = {
+      starters: starters.map(name => ({ name, total: 0 })),
+      mains: mains.map(name => ({ name, total: 0 })),
+    };
+    let people = await resp.json();
+    if (people.data && people.data.getAllPersons) {
+      people = people.data.getAllPersons;
+    } else {
+      people = [];
+    }
+
+    const Admin = await new Promise((resolve) => {
+      require.ensure([], (require) => resolve(require('./Admin').default), 'admin');
+    });
+
+    return {
+      title,
+      chunk: 'admin',
+      component: <Layout><Admin
+        title={title}
+        people={people}
+        food={food}
+      /></Layout>,
+    };
+  },
+
+};