diff --git a/src/actions/actionTypes.js b/src/actions/actionTypes.js index a37a768..46696e6 100644 --- a/src/actions/actionTypes.js +++ b/src/actions/actionTypes.js @@ -1,2 +1,3 @@ -export const ADD_POST = 'ADD_POST' \ No newline at end of file +export const ADD_POST = 'ADD_POST' +export const CREATE_BOARD = 'CREATE_BOARD' \ No newline at end of file diff --git a/src/actions/board.js b/src/actions/board.js new file mode 100644 index 0000000..f33fa3c --- /dev/null +++ b/src/actions/board.js @@ -0,0 +1,8 @@ +import { CREATE_BOARD } from './actionTypes' + +export function createBoard(board) { + return { + type: CREATE_BOARD, + board + } +} \ No newline at end of file diff --git a/src/components/App.js b/src/components/App.js index 8eddde7..02b4e9b 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -2,6 +2,7 @@ import React, { Component } from 'react'; import { Switch, Route, withRouter } from 'react-router-dom'; import Boards from '../containers/Boards' import PostEditor from '../containers/PostEditor' +import BoardEditor from '../containers/BoardEditor' import 'semantic-ui-css/semantic.css' class App extends Component { @@ -9,6 +10,7 @@ class App extends Component { return ( + ); diff --git a/src/components/BoardForm.js b/src/components/BoardForm.js new file mode 100644 index 0000000..87a246c --- /dev/null +++ b/src/components/BoardForm.js @@ -0,0 +1,34 @@ +import React, { Component } from 'react' +import { Form, Button } from 'semantic-ui-react' + +export default class BoardForm extends Component { + constructor(props){ + super(props) + this.state = { + title: props.title || '' + } + } + + updateTitle(event) { + this.setState({ title: event.target.value }) + } + + render() { + const { title, content } = this.state + const { onSave } = this.props + return
+ + + + + +
+ } +} \ No newline at end of file diff --git a/src/components/Boards.js b/src/components/Boards.js index dab26cc..cfac304 100644 --- a/src/components/Boards.js +++ b/src/components/Boards.js @@ -1,9 +1,11 @@ import React from 'react' import { List } from 'semantic-ui-react' import BoardsItem from './BoardsItem' +import { Button } from 'semantic-ui-react' -export default function Boards({ boards }) { +export default function Boards({ boards, createBoard }) { return {boards.map(board => )} + } \ No newline at end of file diff --git a/src/components/PostForm.js b/src/components/PostForm.js index 0ff414f..b53ef2d 100644 --- a/src/components/PostForm.js +++ b/src/components/PostForm.js @@ -1,7 +1,7 @@ import React, { Component } from 'react' import { Form, Button } from 'semantic-ui-react' -export default class PostEditor extends Component { +export default class PostForm extends Component { constructor(props){ super(props) this.state = { diff --git a/src/containers/BoardEditor.js b/src/containers/BoardEditor.js new file mode 100644 index 0000000..846b44c --- /dev/null +++ b/src/containers/BoardEditor.js @@ -0,0 +1,25 @@ +import React from 'react' +import { connect } from 'react-redux' +import BoardForm from '../components/BoardForm' +import { createBoard } from '../actions/board' + +function BoardEditor({ board, createBoard }) { + return +} + +function mapStateToProps(state){ + return { + board: state.boardEditor.board + } +} + +function mapDispatchToProps(dispatch) { + return { + createBoard: board => dispatch(createBoard(board)) + } +} + +export default connect( + mapStateToProps, + mapDispatchToProps +)(BoardEditor) diff --git a/src/containers/Boards.js b/src/containers/Boards.js index 9bf1dcc..2885ddc 100644 --- a/src/containers/Boards.js +++ b/src/containers/Boards.js @@ -1,9 +1,10 @@ import React from 'react' import { connect } from 'react-redux' +import { push } from 'react-router-redux' import BoardsComponent from '../components/Boards' -function Boards({ boards }) { - return +function Boards({ boards, createBoard }) { + return } function mapStateToProps(state){ @@ -14,7 +15,7 @@ function mapStateToProps(state){ function mapDispatchToProps(dispatch){ return { - + createBoard: () => dispatch(push('/b/new')) } } diff --git a/src/reducers/boardEditor.js b/src/reducers/boardEditor.js new file mode 100644 index 0000000..ed33e99 --- /dev/null +++ b/src/reducers/boardEditor.js @@ -0,0 +1,18 @@ +import { CREATE_BOARD } from '../actions/actionTypes' + +function getInitialState() { + return { + board: { + title: '' + } + } +} + +export default function BoardEditorReducer(state = getInitialState(), action) { + switch (action.type) { + case CREATE_BOARD: + return Object.assign({}, state, { board: action.board }) + default: + return state + } +} \ No newline at end of file diff --git a/src/reducers/index.js b/src/reducers/index.js index 98b9de9..fb0f42b 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -1,8 +1,10 @@ import { combineReducers } from 'redux' import postReducer from './post' import boardsReducer from './boards' +import boardEditorReducer from './boardEditor' export default combineReducers({ postEditor: postReducer, - boards: boardsReducer + boards: boardsReducer, + boardEditor: boardEditorReducer }) \ No newline at end of file