Last active
July 27, 2017 14:32
-
-
Save sandwichsudo/130d795ccdaa7bfaa365daf53cb1a3f2 to your computer and use it in GitHub Desktop.
Add error to the state
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // src/containers/RepoSearchPage/page/RepoSearchPage.js | |
| import React, { Component } from 'react'; | |
| import PropTypes from 'prop-types'; | |
| import { connect } from 'react-redux'; | |
| import { bindActionCreators } from 'redux'; | |
| import RepoResultsList from '../components/RepoResultsList/RepoResultsList'; | |
| import * as RepoSearchActions from '../actions/RepoSearchActions'; | |
| export class RepoSearchPage extends Component { | |
| constructor(props) { | |
| super(props); | |
| } | |
| componentWillMount() { | |
| this.props.actions.fetchRepos(); | |
| } | |
| render() { | |
| // display error message when error string populated | |
| const { error, searchResults } = this.props; | |
| return ( | |
| <div> | |
| <h1>Top Javascript Repos</h1> | |
| {error && <p>{error}</p>} | |
| <RepoResultsList repos={searchResults}/> | |
| </div> | |
| ); | |
| } | |
| } | |
| RepoSearchPage.propTypes = { | |
| searchResults: PropTypes.array.isRequired, | |
| actions: PropTypes.object.isRequired, | |
| error: PropTypes.string, | |
| }; | |
| RepoSearchPage.defaultProps = { | |
| error: '', | |
| }; | |
| const mapStateToProps = state => ({ | |
| searchResults: state.repoSearch.results, | |
| error: state.repoSearch.error, | |
| }); | |
| const mapDispatchToProps = dispatch => ({ | |
| actions: bindActionCreators(RepoSearchActions, dispatch), | |
| }); | |
| export default connect(mapStateToProps, mapDispatchToProps)(RepoSearchPage); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // src/containers/RepoSearchPage/reducer/RepoSearchReducer.js | |
| import { actionTypes } from '../RepoSearchConstants'; | |
| const initialState = { | |
| results: [], | |
| error: 'Oh dear' | |
| }; | |
| export default (state = initialState, action) => { | |
| switch (action.type) { | |
| case actionTypes.UPDATE_RESULTS: { | |
| return { ...state, results: action.items }; | |
| } | |
| default: | |
| return state; | |
| } | |
| }; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment