Javascript TypeError:无法读取属性'；类型'；未定义功能组件的定义

这就是我的代码在onClick（）上卡住的地方

我想使用dispatch更改聊天名称的标题（我正在关注youtube频道-imessage克隆的聪明程序员），但操作没有被调度，但出现了错误， 我使用firebase作为后端

import React from 'react'
import "./SidebarChat.css"
import { Avatar } from '@material-ui/core'
import { useDispatch } from 'react-redux'
import setChat from "./features/chatSlice"

function SidebarChat({id,chatName}) {

const dispatch =  useDispatch();

    return (
        <div 
        onClick={()=>(
            dispatch(setChat({
                    chatId: id,
                    chatName: chatName
                })))
        }
        className='sidebarChat'>
            <Avatar />
            <div className="sidebarChat__info">
                <h3>{chatName}</h3>
                <p>Last messg</p>
                <small>timestamp</small>
            </div>
        </div>
    )
}

export default SidebarChat

这是redux商店

import { configureStore } from '@reduxjs/toolkit';
import userReducer from '../features/userSlice';
import chatReducer from '../features/chatSlice';

export default configureStore({
  reducer: {
    user: userReducer,
    chat: chatReducer,
  },
});

我是一个乞丐，我已经浏览了所有可用的页面，但我什么都找不到，有人能帮我吗

这是它抛出的错误消息

---

您应该像这样导入

setChat

从“/features/chatSlice”导入{setChat}

你是我的救命恩人，我本来打算放弃这个项目的，但再次感谢你如果这对你有效，请随意接受我的答案。我是stack overflow的新手，所以我不知道接受是什么意思。我试图喜欢你的答案，但stack不允许我，因为我的声誉不到15

import { configureStore } from '@reduxjs/toolkit';
import userReducer from '../features/userSlice';
import chatReducer from '../features/chatSlice';

export default configureStore({
  reducer: {
    user: userReducer,
    chat: chatReducer,
  },
});