diff options
Diffstat (limited to 'app/assets')
6 files changed, 60 insertions, 12 deletions
diff --git a/app/assets/javascripts/components/components/column.jsx b/app/assets/javascripts/components/components/column.jsx index 64a4e6545..7f9a4665a 100644 --- a/app/assets/javascripts/components/components/column.jsx +++ b/app/assets/javascripts/components/components/column.jsx @@ -1,11 +1,10 @@ -import StatusListContainer from '../containers/status_list_container'; -import ColumnHeader from './column_header'; -import PureRenderMixin from 'react-addons-pure-render-mixin'; +import ColumnHeader from './column_header'; +import PureRenderMixin from 'react-addons-pure-render-mixin'; const Column = React.createClass({ propTypes: { - type: React.PropTypes.string, + heading: React.PropTypes.string, icon: React.PropTypes.string }, @@ -17,10 +16,16 @@ const Column = React.createClass({ }, render () { + let header = ''; + + if (this.props.heading) { + header = <ColumnHeader icon={this.props.icon} type={this.props.heading} onClick={this.handleHeaderClick} />; + } + return ( <div style={{ width: '380px', flex: '0 0 auto', background: '#282c37', margin: '10px', marginRight: '0', display: 'flex', flexDirection: 'column' }}> - <ColumnHeader icon={this.props.icon} type={this.props.type} onClick={this.handleHeaderClick} /> - <StatusListContainer type={this.props.type} /> + {header} + {this.props.children} </div> ); } diff --git a/app/assets/javascripts/components/components/columns_area.jsx b/app/assets/javascripts/components/components/columns_area.jsx index 720f3143b..7708b3273 100644 --- a/app/assets/javascripts/components/components/columns_area.jsx +++ b/app/assets/javascripts/components/components/columns_area.jsx @@ -1,4 +1,3 @@ -import Column from './column'; import PureRenderMixin from 'react-addons-pure-render-mixin'; const ColumnsArea = React.createClass({ @@ -8,8 +7,7 @@ const ColumnsArea = React.createClass({ render () { return ( <div style={{ display: 'flex', flexDirection: 'row', flex: '1' }}> - <Column icon='home' type='home' /> - <Column icon='at' type='mentions' /> + {this.props.children} </div> ); } diff --git a/app/assets/javascripts/components/components/frontend.jsx b/app/assets/javascripts/components/components/frontend.jsx index c227bcc1f..8774d2506 100644 --- a/app/assets/javascripts/components/components/frontend.jsx +++ b/app/assets/javascripts/components/components/frontend.jsx @@ -1,8 +1,10 @@ import ColumnsArea from './columns_area'; +import Column from './column'; import Drawer from './drawer'; import ComposeFormContainer from '../containers/compose_form_container'; import FollowFormContainer from '../containers/follow_form_container'; import UploadFormContainer from '../containers/upload_form_container'; +import StatusListContainer from '../containers/status_list_container'; import PureRenderMixin from 'react-addons-pure-render-mixin'; const Frontend = React.createClass({ @@ -21,7 +23,15 @@ const Frontend = React.createClass({ <FollowFormContainer /> </Drawer> - <ColumnsArea /> + <ColumnsArea> + <Column icon='home' heading='Home'> + <StatusListContainer type='home' /> + </Column> + + <Column icon='at' heading='Mentions'> + <StatusListContainer type='mentions' /> + </Column> + </ColumnsArea> </div> ); } diff --git a/app/assets/javascripts/components/containers/root.jsx b/app/assets/javascripts/components/containers/root.jsx index ed53aee80..eb031bdd4 100644 --- a/app/assets/javascripts/components/containers/root.jsx +++ b/app/assets/javascripts/components/containers/root.jsx @@ -4,8 +4,12 @@ import Frontend from '../components/ import { setTimeline, updateTimeline, deleteFromTimelines } from '../actions/timelines'; import { setAccessToken } from '../actions/meta'; import PureRenderMixin from 'react-addons-pure-render-mixin'; +import { Router, Route, createMemoryHistory } from 'react-router'; +import AccountRoute from '../routes/account_route'; +import StatusRoute from '../routes/status_route'; -const store = configureStore(); +const store = configureStore(); +const history = createMemoryHistory(); const Root = React.createClass({ @@ -45,7 +49,12 @@ const Root = React.createClass({ render () { return ( <Provider store={store}> - <Frontend /> + <Router history={history}> + <Route path="/" component={Frontend}> + <Route path="/accounts/:account_id" component={AccountRoute} /> + <Route path="/statuses/:status_id" component={StatusRoute} /> + </Route> + </Router> </Provider> ); } diff --git a/app/assets/javascripts/components/routes/account_route.jsx b/app/assets/javascripts/components/routes/account_route.jsx new file mode 100644 index 000000000..830621ed8 --- /dev/null +++ b/app/assets/javascripts/components/routes/account_route.jsx @@ -0,0 +1,13 @@ +const AccountRoute = React.createClass({ + + render() { + return ( + <div> + {this.props.params.account_id} + </div> + ) + } + +}); + +export default AccountRoute; diff --git a/app/assets/javascripts/components/routes/status_route.jsx b/app/assets/javascripts/components/routes/status_route.jsx new file mode 100644 index 000000000..358157f1e --- /dev/null +++ b/app/assets/javascripts/components/routes/status_route.jsx @@ -0,0 +1,13 @@ +const StatusRoute = React.createClass({ + + render() { + return ( + <div> + {this.props.params.status_id} + </div> + ) + } + +}); + +export default StatusRoute; |