Дочерний компонент не обновляется при изменении его свойства

import * as React from "react";
import User from "./User";
import Outgoing from "./Outgoing";
import Incoming from "./Incoming";
import UserModalMessage from "./UserModalMessage";
import UserModalResultSent from "./UserModalResultSent";
 
export default class Users extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            modalMessageShow: false,
            modalMessageUsername: '',
            modalMessageText: '',
            modalMessageUserId: 0,
 
            modalResultSentShow: false,
            modalResultSentTitle: '',
            modalResultSentText: ''
        };
        this.openModalMessage = this.openModalMessage.bind(this);
        this.messageSend = this.messageSend.bind(this);
        this.writeMessage = this.writeMessage.bind(this);
        this.closeModalMessage = this.closeModalMessage.bind(this);
        this.closeModalResultSent = this.closeModalResultSent.bind(this);
    }
 
    openModalMessage(nameAndFirstname, userId) {
        this.setState(state => ({
            modalMessageShow: true,
            modalMessageUsername: nameAndFirstname,
            modalMessageUserId: userId,
            modalMessageText: ''
        }));
    }
 
    closeModalMessage() {
        this.setState(state => ({
            modalMessageShow: false
        }));
    }
 
    writeMessage(text) {
        this.setState(state => ({
            modalMessageText: text
        }));
    }
 
    messageSend() {
        this.setState(state => ({
            modalMessageShow: false,
 
            modalResultSentShow: true,
            modalResultSentTitle: 'Отправка сообщения',
            modalResultSentText: 'Вы отправили сообщение пользователю: ' + this.state.modalMessageUsername
        }));
        this.props.messageSend(this.state.modalMessageText, this.state.modalMessageUserId);
    }
 
    addFriend(userId) {
        this.props.addFriendship(userId);
    }
 
    confirmFriendship(userId) {
        this.props.cancelFriendship(userId)
    }
 
    cancelFriendship(userId) {
        this.props.cancelFriendship(userId)
    }
 
    removeFriend(userId) {
        this.props.removeFriend(userId)
    }
 
    openModalResultSent(title, text) {
        this.setState(state => ({
            modalResultSentShow: true,
            modalResultSentTitle: title,
            modalResultSentText: text
        }));
    }
 
    closeModalResultSent() {
        this.setState(state => ({
            modalResultSentShow: false
        }));
    }
 
    listComponents(Component, objectsMainer, $this, type) {
        type = type || undefined;
        let result = null;
        if (objectsMainer && objectsMainer.keys.length > 0) {
            result = objectsMainer.keys.map((id, i) => {
                return (
                    <React.Fragment key={i}>
                        <Component user={objectsMainer.objects[id]} parent={$this} type={type}/>
                        {(i + 1) != objectsMainer.keys.length && (<hr></hr>) }
                    </React.Fragment>
                );
            });
        }
        return result;
    }
 
    render() {
        let users = null, incomings = null, outgoings = null, friendsOnline = null, friendsAll = null, partners = null;
 
 
        if (this.props.users) {
            console.log('  USERSSS 0000000//////');
            /*
             users = this.listComponents(User, this.props.users.users, this, 'users');
             incomings = this.listComponents(Incoming, this.props.users.friendsRequests.incoming, this);
             outgoings = this.listComponents(Outgoing, this.props.users.friendsRequests.outgoing, this);
             friendsOnline = this.listComponents(User, this.props.users.friends.online, this);
             friendsAll = this.listComponents(User, this.props.users.friends.all, this);
             partners = this.listComponents(User, this.props.users.partners, this);
             */
 
            users = this.props.users.users.keys.map((number, i) => {
                    console.log(this.props.users.users.objects[number]);
                    return <User key={i} user={this.props.users.users.objects[number]} parent={this} type="users"/>
                }
            );
 
            incomings = this.listComponents(Incoming, this.props.users.friendsRequests.incoming, this);
            outgoings = this.listComponents(Outgoing, this.props.users.friendsRequests.outgoing, this);
            friendsOnline = this.listComponents(User, this.props.users.friends.online, this);
            friendsAll = this.listComponents(User, this.props.users.friends.all, this);
            partners = this.listComponents(User, this.props.users.partners, this);
 
        }
 
        return (
            <div>
                <UserModalMessage show={this.state.modalMessageShow}
                                  nameAndFirstname={this.state.modalMessageUsername}
                                  message={this.state.modalMessageText}
                                  writeMessage={this.writeMessage}
                                  closeModalMessage={this.closeModalMessage}
                                  messageSend={this.messageSend}
                />
 
                <UserModalResultSent show={this.state.modalResultSentShow}
                                     title={this.state.modalResultSentTitle}
                                     text={this.state.modalResultSentText}
                                     closeModalMessage={this.closeModalResultSent}
                />
 
                <div className="card card-wrap">
                    <ul className="nav nav-tabs" id="myTab1" role="tablist">
                        <li className="nav-item">
                            <a className="nav-link active" id="first1-tab" data-toggle="tab"
                               href="#first1" role="tab" aria-controls="first1"
                               aria-selected="true">Заявки в друзья
                                {(incomings && incomings.length > 0) &&
                                <span className="badge badge-pill badge-success ml-1">{incomings.length}</span>
                                }
                            </a>
                        </li>
 
                        <li className="nav-item">
                            <a className="nav-link" id="second2-tab" data-toggle="tab"
                               href="#second2" role="tab" aria-controls="second2"
                               aria-selected="false">Исходящие заявки
                                {(outgoings && outgoings.length > 0) &&
                                <span className="badge badge-pill badge-success ml-1">{outgoings.length}</span>
                                }
                            </a>
                        </li>
                    </ul>
                    <div className="tab-content" id="myTabContent1">
                        <div className="tab-pane fade show active" id="first1" role="tabpanel"
                             aria-labelledby="first1-tab">
                            <div className="card-body">
                                {(incomings && incomings.length > 0) ? incomings : 'В даннный момент входяшх запросов нет.'}
                            </div>
                        </div>
 
                        <div className="tab-pane fade" id="second2" role="tabpanel"
                             aria-labelledby="second2-tab">
                            <div className="card-body">
                                {(outgoings && outgoings.length > 0) ? outgoings : 'В даннный момент исходящих запросов нет.'}
                            </div>
                        </div>
 
                        <div className="tab-pane fade" id="third3" role="tabpanel"
                             aria-labelledby="third3-tab">
                            <div className="card-body">Рекомендуемые друзья</div>
                        </div>
                    </div>
                </div>
 
                <div className="card card-wrap">
                    <ul className="nav nav-tabs" id="myTab" role="tablist">
                        <li className="nav-item">
                            <a className="nav-link" id="1-tab" data-toggle="tab" href="#1"
                               role="tab" aria-controls="1" aria-selected="false">Мои друзья<span
                                className="badge badge-pill badge-success ml-1">{friendsAll && friendsAll.length > 0 ? friendsAll.length : ''}</span></a>
                        </li>
 
                        <li className="nav-item">
                            <a className="nav-link" id="2-tab" data-toggle="tab" href="#2"
                               role="tab" aria-controls="2" aria-selected="false">Друзья онлайн<span
                                className="badge badge-pill badge-success ml-1">{friendsOnline && friendsOnline.length > 0 ? friendsOnline.length : ''}</span></a>
                        </li>
 
                        <li className="nav-item">
                            <a className="nav-link" id="3-tab" data-toggle="tab" href="#3"
                               role="tab" aria-controls="3" aria-selected="false">Партнёры<span
                                className="badge badge-pill badge-success ml-1">{partners && partners.length > 0 ? partners.length : ''}</span></a>
                        </li>
 
                        <li className="nav-item">
                            <a className="nav-link active show" id="4-tab" data-toggle="tab"
                               href="#4" role="tab" aria-controls="4" aria-selected="true">Все
                                пользователи</a>
                        </li>
                    </ul>
                    <div className="tab-content" id="myTabContent">
                        <div className="tab-pane fade" id="1" role="tabpanel"
                             aria-labelledby="1-tab">
                            <div className="card-body">
                                {friendsAll ? friendsAll : 'В даннный момент у вас нет друзей.'}
                            </div>
                        </div>
 
                        <div className="tab-pane fade" id="2" role="tabpanel"
                             aria-labelledby="2-tab">
                            <div className="card-body">
                                {friendsOnline ? friendsOnline : 'В даннный момент онлайн никого нет.'}
                            </div>
                        </div>
                        <div className="tab-pane fade" id="3" role="tabpanel"
                             aria-labelledby="3-tab">
                            <div className="card-body">
                                {partners ? partners : 'В даннный момент у вас нет партнёров.'}
                            </div>
                        </div>
 
                        <div className="tab-pane fade active show" id="4" role="tabpanel"
                             aria-labelledby="4-tab">
                            <div className="card-body">
                                {users ? users : 'В даннный момент на сайте нет пользователей.'}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        )
    }
}

import * as React from "react";
import UserTemplate from "./UserTemplate";
import {getUsersField} from "../../../helpers/functions";
import {connect} from "react-redux";
 
class User extends React.Component {
    shouldComponentUpdate(nextProps, nextState) {
        console.log(nextProps , 'nextProps');
        return true;
    }
 
 
 
    render() {
        let userFields = getUsersField(this.props.user.user_fields),
            showModalMessage,
            actionFreindship = () => {
            },
            textFreindButton = '',
            disableFreindButton = false
        ;
 
 
        //для компонента друзей
        if (
            this.props.type != 'users'
            && this.props.userApplicathion
            && Number(this.props.userApplicathion.id) == Number(userFields.user_id)
        )
            userFields = getUsersField(this.props.user.friend_fields);
 
        showModalMessage = () => this.props.parent.openModalMessage(userFields.nameAndFirstname, userFields.user_id);
 
        console.log(this.props.user.friendship, 'USER ////////////////');
 
        switch (this.props.user.friendship) {
            case 'thisUser':
                //юзер и есть юзер, для него кнопки нет
                textFreindButton = '';
                break;
            case 'null':
                actionFreindship = () => {
                    this.props.parent.props.addFriendship(userFields.user_id);
                };
                textFreindButton = 'Добавить в друзья';
                break;
            case 'confirm':
                actionFreindship = () => {
                    this.props.parent.props.removeFriend(userFields.user_id);
                };
                textFreindButton = 'Убрать из друзей';
                break;
            case 'cancelRequest':
                actionFreindship = () => {
                    this.props.parent.props.cancelFriendship(userFields.user_id);
                };
                textFreindButton = 'Отменить заявку в друзья';
                break;
            case 'waitingConfirm':
                disableFreindButton = true;
                textFreindButton = 'Пользователь уже предложил вам дружбу';
                break;
        }
 
        return (
            <UserTemplate user={this.props.user} userFields={userFields}>
                <button type="button"
                        className="btn btn-primary btn-sm btn-shadow mt-2"
                        onClick={showModalMessage}
                >
                    Написать сообщение
                </button>
 
                {textFreindButton && (
                    <button type="button"
                            className="btn btn-primary btn-sm btn-shadow mt-2"
                            onClick={actionFreindship}
                            disabled={disableFreindButton}
                    >
                        {textFreindButton}
                    </button>
                )}
            </UserTemplate>
        )
    }
}
 
const mapState2Props = (state) => {
    return {
        userApplicathion: state.user.user
    };
};
 
export default connect(
    mapState2Props
)(User);