Learning Redux

Implementing the component

Next, we  need to create the component that will display the error object:

1. Create a new file src/components/ErrorMessage.jsx with the following contents:

import React from 'react'const ErrorMessage = ({ message }) =>  message    ? <span style={{ color: 'red' }}>Error: {message}</span>    : nullexport default ErrorMessage

2. Then, we will create the container component. Create a new file—src/containers/ConnectedErrorMessage.jsx. The code here is pretty straightforward:

import { connect } from 'react-redux'import ErrorMessage from '../components/ErrorMessage.jsx'const mapStateToProps = (state, props) => {  return {    message: state.error && state.error.message  }}const ConnectedErrorMessage = connect(mapStateToProps)(ErrorMessage) ...