Added a seperate component for the info button.
This commit is contained in:
		
							
								
								
									
										52
									
								
								client/app/components/buttons/InfoButton.jsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										52
									
								
								client/app/components/buttons/InfoButton.jsx
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,52 @@ | ||||
| import React, { Component } from 'react'; | ||||
| import Interactive from 'react-interactive'; | ||||
|  | ||||
| import buttonsCSS from '../styles/buttons.jsx'; | ||||
|  | ||||
|  | ||||
| class InfoButton extends Component { | ||||
|    constructor(props) { | ||||
|       super(props); | ||||
|  | ||||
|       if (props) { | ||||
|          this.state = { | ||||
|             id: props.id, | ||||
|             type: props.type, | ||||
|          } | ||||
|       } | ||||
|    } | ||||
|  | ||||
|    componentWillReceiveProps(props) { | ||||
|       this.setState({ | ||||
|          id: props.id, | ||||
|          type: props.type, | ||||
|       }) | ||||
|    } | ||||
|  | ||||
|    getTMDBLink() { | ||||
|       const id = this.state.id; | ||||
|       const type = this.state.type; | ||||
|  | ||||
|       if (type === 'movie')  | ||||
|          return 'https://www.themoviedb.org/movie/' + id | ||||
|       else if (type === 'show')   | ||||
|          return 'https://www.themoviedb.org/tv/' + id | ||||
|    } | ||||
|  | ||||
|    render() { | ||||
|       return ( | ||||
|          <a href={this.getTMDBLink()}> | ||||
|             <Interactive  | ||||
|                as='button' | ||||
|                hover={buttonsCSS.info_hover} | ||||
|                focus={buttonsCSS.info_hover} | ||||
|                style={buttonsCSS.info}> | ||||
|  | ||||
|                <span>More info</span> | ||||
|             </Interactive> | ||||
|          </a> | ||||
|       ); | ||||
|    } | ||||
| } | ||||
|  | ||||
| export default InfoButton; | ||||
		Reference in New Issue
	
	Block a user