Отправленное действие получено редуктором, но не отображается в списке действий и не перерисовывается

Question

У меня есть компонент Comment, в котором есть кнопка удаления. Когда кнопка нажата, она вызывает действие, выполняет вызов axios, а когда вызов возвращается, отправляет обновление в редуктор. Единственная проблема заключается в том, что он не вызывает повторное рендеринг родительского компонента. Действие, хотя оно и обновляет состояние, не отображается в списке отправленных действий в Redux DevTools. Все остальные действия работают и отображаются в DevTools, но по какой-то причине это не работает.

Моя мысль после прочтения раздела комментариев ниже заключается в том, что я делаю поверхностную копию своего объекта. Неправильно ли я думать, что создание мелкой копии, изменение более глубокого объекта и возврат мелкой копии не вызовут повторное рендеринг? Разве тот факт, что неглубокий объект не является другой ссылкой, достаточно, чтобы вызвать его? Я уверен, что я делаю то же самое в других местах, и у меня нет проблем в другом месте. Он

Это список действий в Redux DevTools после удаления комментария. Я ожидаю, что это будет иметь "delete_comment" где-то внизу, но это не так:

Данные передаются из родительских компонентов CommentList -> CommentThread -> Comment.

Это действительно посылка?

Это упрощенный компонент:

import React, {Component} from 'react';
import ReactDOM from 'react-dom';
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
import {
    deleteComment,
} from "../../actions/comment_actions";


class Comment extends Component {
    constructor(props) {
        super(props);
        this.state = {

        };
    }

    render() {
        const {comment, data} = this.props;

        if (!data) {
            //console.log("mir_data doesnt exist");
            return <div/>;
        }


        return (
            <div key={"comment" + comment.id} id={"c" + comment.id}>
            <button onClick={() => this.props.deleteComment(comment.id)}>Delete</button>
            </div>
        );
    }
}

function mapStateToProps(state) {
    return {
        user: state.user
    };
}

function mapDispatchToProps(dispatch) {
    return bindActionCreators({
        deleteComment,
    }, dispatch)
}

export default connect(mapStateToProps, mapDispatchToProps)(Comment);

Вот упрощенный файл действий:

export const DELETE_COMMENT = 'delete_comment';

export function deleteComment(id, callback = null) {
    return (dispatch, getState) => {
        axiosInstance.post('/delete-comment/', {comment_id: id}, getState().api.axios).then(
            response => {
                dispatch(dispatchDeleteComment(id));

                //dispatch(dispatchViewUserInfo(response.data));
                if (response.status === 200)
                    callback();
            }
        );
    }
}


export function dispatchDeleteComment(id) {
    return {
        type: DELETE_COMMENT,
        payload: id
    };
}

Вот упрощенный редуктор:

import {DELETE_COMMENT} from "../actions/comment_actions";

export default function(state = {}, action){
    let newState = {...state};
    switch(action.type){

        case DELETE_COMMENT:
            //some logic
            delete newState.comments[action.payload];
            return newState;
        default:
            return state;
    }
}