diff --git a/src/public/js/components/buttons/actions.js b/src/public/js/components/buttons/actions.js new file mode 100644 index 0000000..284ec5f --- /dev/null +++ b/src/public/js/components/buttons/actions.js @@ -0,0 +1,87 @@ +import React from 'react' + +import { MenuItem } from 'react-bootstrap' + +export class WishlistButton extends React.Component { + constructor(props) { + super(props); + this.handleClick = this.handleClick.bind(this); + } + handleClick(e) { + e.preventDefault(); + if (this.props.wishlisted) { + this.props.deleteFromWishlist(this.props.movieId); + } else { + this.props.addToWishlist(this.props.movieId); + } + } + render() { + if (this.props.wishlisted) { + return ( + + + Delete from wishlist + + + ); + } else { + return ( + + + Add to wishlist + + + ); + } + } +} + +export class DeleteButton extends React.Component { + constructor(props) { + super(props); + this.handleClick = this.handleClick.bind(this); + } + handleClick(e) { + e.preventDefault(); + this.props.deleteFunc(this.props.resourceId); + } + render() { + return ( + + + Delete + + + ); + } +} + +export class RefreshButton extends React.Component { + constructor(props) { + super(props); + this.handleClick = this.handleClick.bind(this); + } + handleClick(e) { + e.preventDefault(); + if (this.props.fetching) { + return + } + this.props.getDetails(this.props.resourceId); + } + render() { + return ( + + {this.props.fetching || + + Refresh + + } + {this.props.fetching && + + Refreshing + + } + + ); + } +} diff --git a/src/public/js/components/movies/actions.js b/src/public/js/components/movies/actions.js index 0754a8f..e962268 100644 --- a/src/public/js/components/movies/actions.js +++ b/src/public/js/components/movies/actions.js @@ -1,19 +1,20 @@ import React from 'react' -import { DropdownButton, MenuItem } from 'react-bootstrap' +import { WishlistButton, DeleteButton, RefreshButton } from '../buttons/actions' +import { DropdownButton } from 'react-bootstrap' export default function ActionsButton(props) { return ( {(props.isUserAdmin && props.hasMovie) && } @@ -26,87 +27,3 @@ export default function ActionsButton(props) { ); } - -class RefreshButton extends React.Component { - constructor(props) { - super(props); - this.handleClick = this.handleClick.bind(this); - } - handleClick(e) { - e.preventDefault(); - if (this.props.fetching) { - return - } - this.props.getDetails(this.props.movieId); - } - render() { - return ( - - {this.props.fetching || - - Refresh - - } - {this.props.fetching && - - Refreshing - - } - - ); - } -} - -class DeleteButton extends React.Component { - constructor(props) { - super(props); - this.handleClick = this.handleClick.bind(this); - } - handleClick(e) { - e.preventDefault(); - this.props.deleteMovie(this.props.movieId); - } - render() { - return ( - - - Delete - - - ); - } -} - -class WishlistButton extends React.Component { - constructor(props) { - super(props); - this.handleClick = this.handleClick.bind(this); - } - handleClick(e) { - e.preventDefault(); - if (this.props.wishlisted) { - this.props.deleteFromWishlist(this.props.movieId); - } else { - this.props.addToWishlist(this.props.movieId); - } - } - render() { - if (this.props.wishlisted) { - return ( - - - Delete from wishlist - - - ); - } else { - return ( - - - Add to wishlist - - - ); - } - } -}