redux - inject one user data to UserHeader

Current component get users collection from props.

UserHeader component seems weird because the component is designed to show only one user, should not get all user data and find one of it,

In order to inject only one User data to UserHeader, can change implementation in mapStateToProps

Commit

Code

import React, {Component} from "react";

import {connect} from 'react-redux'

import {fetchUser} from "../actions";

class UserHeader extends Component {

componentDidMount() {

this.props.fetchUser(this.props.userId)

}

render() {

return <div>Author: {this.props.user?.name}</div>

}

const mapStateToProps = (state, props) => {

return {user: state.users?.find(user => user.id === props.userId)}

}

export default connect(mapStateToProps, {fetchUser})(UserHeader)