diff options
8 files changed, 49 insertions, 39 deletions
diff --git a/animism-align/frontend/app/views/episode/containers/episode.new.js b/animism-align/frontend/app/views/episode/containers/episode.new.js index 13c3d49..2a6beaf 100644 --- a/animism-align/frontend/app/views/episode/containers/episode.new.js +++ b/animism-align/frontend/app/views/episode/containers/episode.new.js @@ -69,7 +69,6 @@ class EpisodeNew extends Component { } const mapStateToProps = state => ({ - episode: state.episode, project: state.project.index, }) diff --git a/animism-align/frontend/app/views/episode/episode.container.js b/animism-align/frontend/app/views/episode/episode.container.js index 9cd70f8..56166c3 100644 --- a/animism-align/frontend/app/views/episode/episode.container.js +++ b/animism-align/frontend/app/views/episode/episode.container.js @@ -5,7 +5,7 @@ import { connect } from 'react-redux' import './episode.css' import EpisodeIndex from './containers/episode.index' -import EpisodeNew from './containers/episode.new' +// import EpisodeNew from './containers/episode.new' import EpisodeEdit from './containers/episode.edit' class Container extends Component { diff --git a/animism-align/frontend/app/views/project/project.container.js b/animism-align/frontend/app/views/project/project.container.js index a3701e2..584f210 100644 --- a/animism-align/frontend/app/views/project/project.container.js +++ b/animism-align/frontend/app/views/project/project.container.js @@ -4,6 +4,8 @@ import { Route } from 'react-router-dom' import './project.css' import EpisodeNew from 'app/views/episode/containers/episode.new' +import VenueNew from 'app/views/venue/containers/venue.new' +import VenueIndex from 'app/views/venue/containers/venue.index' import ProjectIndex from './containers/project.index' import ProjectNew from './containers/project.new' import ProjectEdit from './containers/project.edit' @@ -13,6 +15,8 @@ export default class Container extends Component { return ( <div className='projectContainer'> <Route exact path='/project/:project_id/new-episode/' component={EpisodeNew} /> + <Route exact path='/project/:project_id/new-venue/' component={VenueNew} /> + <Route exact path='/project/:id/venues/' component={VenueIndex} /> <Route exact path='/project/:id/edit/' component={ProjectEdit} /> <Route exact path='/project/new/' component={ProjectNew} /> <Route exact path='/project/' component={ProjectIndex} /> diff --git a/animism-align/frontend/app/views/venue/components/venue.form.js b/animism-align/frontend/app/views/venue/components/venue.form.js index b1a124f..7ffa098 100644 --- a/animism-align/frontend/app/views/venue/components/venue.form.js +++ b/animism-align/frontend/app/views/venue/components/venue.form.js @@ -111,8 +111,8 @@ export default class VenueForm extends Component { } const { isNew, onSubmit } = this.props const { data } = this.state - const requiredKeys = "title date".split(" ") - const validKeys = "title date settings".split(" ") + const requiredKeys = "project_id title date".split(" ") + const validKeys = "project_id title date settings".split(" ") const validData = validKeys.reduce((a,b) => { a[b] = data[b]; return a }, {}) const errorFields = requiredKeys.filter(key => !validData[key]) if (errorFields.length) { @@ -132,7 +132,6 @@ export default class VenueForm extends Component { render() { const { isNew } = this.props const { title, submitTitle, errorFields, data } = this.state - // console.log(data) return ( <div className='form'> <h1>{title}</h1> diff --git a/animism-align/frontend/app/views/venue/components/venue.menu.js b/animism-align/frontend/app/views/venue/components/venue.menu.js index 1e1a7cd..c76edf6 100644 --- a/animism-align/frontend/app/views/venue/components/venue.menu.js +++ b/animism-align/frontend/app/views/venue/components/venue.menu.js @@ -14,43 +14,30 @@ export default class VenueMenu extends Component { render() { return ( <div className='menuButtons'> - <Route exact path='/venue/:id/show/' component={VenueShowMenu} /> <Route exact path='/venue/:id/edit/' component={VenueEditMenu} /> - <Route exact path='/venue/new/' component={VenueNewMenu} /> - <Route exact path='/venue/' component={VenueIndexMenu} /> + <Route exact path='/project/:project_id/new-venue/' component={VenueNewMenu} /> + <Route exact path='/project/:project_id/venues/' component={VenueIndexMenu} /> </div> ) } } -const VenueIndexMenu = () => ([ - <MenuButton key='new' name="new" href="/venue/new/" />, +const VenueIndexMenu = (props) => ([ + <MenuButton key='back' name="back" href={`/`} />, + <MenuButton key='new' name="new" href={`/project/${props.match.params.project_id}/new-venue/`} />, ]) -const VenueShowMenu = connect(mapStateToProps)((props) => ([ - <MenuButton key='back' name="back" href="/venue/" />, - <MenuButton key='edit' name="edit" href={"/venue/" + props.match.params.id + "/edit/"} />, - <MenuButton key='delete' name="delete" onClick={() => { - const { res: venue } = props.venue.show - if (confirm("Really delete this venue?")) { - actions.venue.destroy(venue).then(() => { - history.push('/venue/') - }) - } - }} />, -])) - const VenueNewMenu = (props) => ([ - <MenuButton key='back' name="back" href="/venue/" />, + <MenuButton key='back' name="back" href={`/project/${props.match.params.project_id}/new-venue/`} />, ]) const VenueEditMenu = connect(mapStateToProps)((props) => ([ - <MenuButton key='back' name="back" href="/venue/" />, + <MenuButton key='back' name="back" href={`/project/${props.match.params.project_id}/venues/`} />, <MenuButton key='delete' name="delete" onClick={() => { const { res: venue } = props.venue.show if (confirm("Really delete this venue?")) { actions.venue.destroy(venue).then(() => { - history.push('/venue/') + history.push(`/project/${props.match.params.project_id}/venues/`) }) } }} />, diff --git a/animism-align/frontend/app/views/venue/containers/venue.edit.js b/animism-align/frontend/app/views/venue/containers/venue.edit.js index 4d55c6e..c5ab075 100644 --- a/animism-align/frontend/app/views/venue/containers/venue.edit.js +++ b/animism-align/frontend/app/views/venue/containers/venue.edit.js @@ -20,7 +20,7 @@ class VenueEdit extends Component { .then(response => { // response console.log(response) - history.push('/venue/') + history.push(`/project/${response.res.project_id}/venues/`) }) } diff --git a/animism-align/frontend/app/views/venue/containers/venue.index.js b/animism-align/frontend/app/views/venue/containers/venue.index.js index 9a44fa7..9ab9ba1 100644 --- a/animism-align/frontend/app/views/venue/containers/venue.index.js +++ b/animism-align/frontend/app/views/venue/containers/venue.index.js @@ -20,7 +20,8 @@ class VenueIndex extends Component { render() { const { loading, lookup, order } = this.props.venue.index - if (loading) { + const project_id = parseInt(this.props.match.params.id) + if (loading || this.props.project.loading) { return ( <section> <Loader /> @@ -42,19 +43,23 @@ class VenueIndex extends Component { </section> ) } + const project = this.props.project.lookup[project_id] return ( <section> <div className="row venue-index"> <VenueMenu /> <div className="venue-list"> - <h1>Venues</h1> + <h1>{project.title}</h1> + <h2>Venues</h2> {order.map(id => ( - <div key={id}> - <Link to={"/venue/" + id + "/edit/"}> - {lookup[id].title} - </Link> - {lookup[id].date} - </div> + lookup[id].project_id === project_id && ( + <div key={id}> + <Link to={"/venue/" + id + "/edit/"}> + {lookup[id].title} + </Link> + {lookup[id].date} + </div> + ) ))} </div> </div> @@ -65,6 +70,7 @@ class VenueIndex extends Component { } const mapStateToProps = state => ({ + project: state.project.index, venue: state.venue, }) diff --git a/animism-align/frontend/app/views/venue/containers/venue.new.js b/animism-align/frontend/app/views/venue/containers/venue.new.js index f39dc19..fdab291 100644 --- a/animism-align/frontend/app/views/venue/containers/venue.new.js +++ b/animism-align/frontend/app/views/venue/containers/venue.new.js @@ -13,9 +13,23 @@ class VenueNew extends Component { loading: true, initialData: {}, } - componentDidMount() { - this.setState({ loading: false }) + this.ready() + } + componentDidUpdate(prevProps) { + if (this.props.project.lookup !== prevProps.project.lookup) { + this.ready() + } + } + ready() { + if (!this.props.project.lookup) return + const { project_id } = this.props.match.params + const project = parseInt(this.props.project.lookup[project_id]) + this.setState({ + loading: false, + initialData: { project_id }, + project, + }) } handleSubmit(data) { @@ -24,7 +38,7 @@ class VenueNew extends Component { .then(res => { console.log(res) if (res.res && res.res.id) { - history.push('/venue/') + history.push(`/project/${res.res.project_id}/venues/`) } }) .catch(err => { @@ -44,6 +58,7 @@ class VenueNew extends Component { <VenueForm isNew data={this.state.initialData} + project={this.state.project} onSubmit={this.handleSubmit.bind(this)} /> </div> @@ -52,7 +67,7 @@ class VenueNew extends Component { } const mapStateToProps = state => ({ - venue: state.venue, + project: state.project.index, }) export default connect(mapStateToProps)(VenueNew) |