1
0
mirror of https://github.com/fazo96/ipfs-boards synced 2025-01-10 12:24:20 +01:00

minor UI changes

This commit is contained in:
Enrico Fasoli 2018-02-09 00:08:52 +01:00
parent 65678a1521
commit 3fab3696a5
No known key found for this signature in database
GPG Key ID: 1238873C5F27DB4D
9 changed files with 36 additions and 22 deletions

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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