minor UI changes

src/components/App.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import { Switch, Route, withRouter } from 'react-router-dom'
 import Boards from '../containers/Boards'
-import BoardEditor from '../containers/BoardEditor'
+import OpenBoard from '../containers/OpenBoard'
 import WithBoard from '../containers/WithBoard'
 import BoardPage from '../components/BoardPage'
 import 'semantic-ui-css/semantic.css'
@@ -10,7 +10,7 @@ class App extends Component {
   render() {
     return (
       <Switch>
-        <Route path='/b/new' component={BoardEditor} />
+        <Route path='/b/new' component={OpenBoard} />
         <Route path='/b/:hash/:name/' component={withRouter(WithBoard(BoardPage))} />
         <Route path='/' component={Boards} />
       </Switch>

src/components/BoardPage.js

@@ -1,12 +1,14 @@
 import React from 'react'
 import { Switch, Route } from 'react-router-dom'
 import Board from '../containers/Board'
+import BoardEditor from '../containers/Board'
 import PostEditor from '../containers/PostEditor'
 import WithStats from '../containers/WithStats'
 
 function BoardPage({ match, address, posts, metadata }) {
     return <Switch>
         <Route path={match.path+'p/new'} component={PostEditor} /> 
+        <Route path={match.path+'edit'} component={BoardEditor} /> 
         <Route path={match.path} component={WithStats(Board)} />
     </Switch>
 }

src/components/Boards.js

@@ -20,7 +20,7 @@ export default function Boards({ stats, boards, createBoard }) {
                     </List.Content>
                 </List.Item>
                 <List.Item>
-                    <List.Icon name='wifi' size="large" verticalAlign="middle"/>
+                    <List.Icon name='signal' size="large" verticalAlign="middle"/>
                     <List.Content>
                         <List.Header>Connected Peers</List.Header>
                         <List.Content>{stats.peers.length}</List.Content>

src/components/BoardsItem.js

@@ -1,22 +1,33 @@
 import React from 'react'
-import { Button, Card } from 'semantic-ui-react'
+import { List, Button, Card } from 'semantic-ui-react'
 import { Link } from 'react-router-dom'
 import { shortenAddress } from '../utils/orbitdb'
 
-export default function BoardsItem({ address, title }) {
+export default function BoardsItem({ address, title, name }) {
     return <Card fluid>
         <Card.Content>
             <Card.Header>
                 { title || 'Unnamed board' }
             </Card.Header>
-            <Card.Meta>
+            <Card.Meta>Board</Card.Meta>
-                Board
+        </Card.Content>
-            </Card.Meta>
+        <Card.Content>
-            </Card.Content>
+            <List>
-            <Card.Content>
+                <List.Item>
-            <Card.Description style={{wordBreak:'break-all'}}>
+                    <List.Icon name="hashtag" verticalAlign="middle"/>
-                {address}
+                    <List.Content>
-            </Card.Description>
+                        <List.Header>Name</List.Header>
+                        <List.Content>{name}</List.Content>
+                    </List.Content>
+                </List.Item>
+                <List.Item>
+                    <List.Icon name="chain" verticalAlign="middle"/>
+                    <List.Content>
+                        <List.Header>Address</List.Header>
+                        <List.Content>{address}</List.Content>
+                    </List.Content>
+                </List.Item>
+            </List>
         </Card.Content>
         <Card.Content extra>
             <Button as={Link} to={shortenAddress(address)} basic fluid>View</Button>

src/components/OpenBoardForm.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
 import { Container, Card, Form, Button } from 'semantic-ui-react'
 
-export default class BoardForm extends Component {
+export default class OpenBoardForm extends Component {
     constructor(props){
         super(props)
         this.state = {

src/containers/OpenBoard.js

@@ -1,15 +1,15 @@
 import React from 'react'
 import { connect } from 'react-redux'
-import BoardForm from '../components/BoardForm'
+import OpenBoardForm from '../components/OpenBoardForm'
 import { openBoard } from '../actions/board'
 
-function BoardEditor(props) {
+function OpenBoard(props) {
-    return <BoardForm {...props} />
+    return <OpenBoardForm {...props} />
 }
 
 function mapStateToProps(state){
     return {
-        opening: state.boardEditor.opening
+        opening: state.openBoard.opening
     }
 }
 
@@ -22,4 +22,4 @@ function mapDispatchToProps(dispatch) {
 export default connect(
     mapStateToProps,
     mapDispatchToProps
-)(BoardEditor)
+)(OpenBoard)

src/reducers/index.js

@@ -2,11 +2,11 @@ import { combineReducers } from 'redux'
 import { routerReducer } from 'react-router-redux'
 import postReducer from './post'
 import boardsReducer from './boards'
-import boardEditorReducer from './boardEditor'
+import openBoardReducer from './openboard'
 
 export default combineReducers({
     router: routerReducer,
     postEditor: postReducer,
     boards: boardsReducer,
-    boardEditor: boardEditorReducer
+    openBoard: openBoardReducer
 })

src/reducers/openboard.js

@@ -9,7 +9,7 @@ function getInitialState() {
     }
 }
 
-export default function BoardEditorReducer(state = getInitialState(), action) {
+export default function openBoardReducer(state = getInitialState(), action) {
     switch (action.type) {
         case OPEN_BOARD:
             return Object.assign({}, state, { opening: true })

src/sagas/boards.js

@@ -35,6 +35,7 @@ export function* openBoard({ board }) {
         const dbInfo = { address }
         dbInfo.posts = db.posts
         dbInfo.metadata = db.metadata
+        dbInfo.name = db.dbname
         try {
             const channel = yield call(createDbEventChannel, db)
             yield fork(watchDb, channel)