Add table for menu, and fix up editors.

src/admin/ControlPanel.js

@@ -9,7 +9,7 @@ Panel containing control elements for managing sites and pages.
 import {h, Component} from 'preact';  /** @jsx h*/
 
 import {observer} from 'mobx-observer';
-import {Form, FormGroup, Col, Input, Label} from 'reactstrap';
+import {Form, FormGroup, Col, Input, Label, Table} from 'reactstrap';
 
 import {UserLogin} from './UserLoginForm';
 import {PageEditor} from './PageEditor';
@@ -46,6 +46,20 @@ import {Spacer} from '../layout';
       panelStyle.marginLeft = '0';
     }
 
+    const menu = [];
+    let itemCounter = 0;
+    for (let item of siteStore.menu) {
+      let menuItem = (
+        <tr>
+          <th scope='row'>{itemCounter + 1}</th>
+          <td>{item.title}</td>
+          <td>{item.url}</td>
+        </tr>
+      );
+      menu.push(menuItem);
+      itemCounter++;
+    }
+
     // TODO: Breakout into separate components.
     const children = userStore.isUserLoggedIn
       ? (
@@ -55,14 +69,14 @@ import {Spacer} from '../layout';
           <Form horizontal>
             <FormGroup row>
               <Col xs='2'>
-                <Label for='title'>Title</Label>
+                <Label for='name'>Name</Label>
               </Col>
               <Col xs='10' >
                 <Input
                   id='title'
                   type='text'
-                  placeholder='Title'
+                  placeholder='Name'
-                  value={ siteStore.title } />
+                  value={ siteStore.name } />
               </Col>
             </FormGroup>
             <FormGroup row>
@@ -83,11 +97,18 @@ import {Spacer} from '../layout';
           <Form horizontal>
             <FormGroup row>
               <Col xs='12'>
-                <Input
+                <Table>
-                  id='menu'
+                  <thead>
-                  type='text'
+                    <tr>
-                  placeholder='favicon.ico'
+                      <th>Position</th>
-                  value={ siteStore.config.favicon } />
+                      <th>Label</th>
+                      <th>Page</th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    { menu }
+                  </tbody>
+                </Table>
               </Col>
             </FormGroup>
           </Form>

src/admin/PageEditor.js

@@ -77,14 +77,14 @@ export class PageEditor extends Component {
         <Form horizontal>
           <FormGroup row>
             <Col xs='2'>
-              <Label for='name'>Name</Label>
+              <Label for='title'>Title</Label>
             </Col>
             <Col xs='10' >
               <Input
-                id='name'
+                id='title'
                 type='text'
                 placeholder='Name'
-                value={ pageStore.name } />
+                value={ pageStore.title } />
             </Col>
           </FormGroup>
           <FormGroup row>