From f31941425d72105f60ec8b73971f672390363524 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B6=85=E7=BA=A7=E8=80=81=E7=99=BD=E5=85=94?= Date: Fri, 5 Sep 2025 15:50:21 +0800 Subject: [PATCH 1/5] =?UTF-8?q?refactor(=E8=81=8A=E5=A4=A9=E7=AA=97?= =?UTF-8?q?=E5=8F=A3):=20=E4=BC=98=E5=8C=96=E6=B6=88=E6=81=AF=E5=88=97?= =?UTF-8?q?=E8=A1=A8=E5=92=8C=E8=AE=B0=E5=BD=95=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 移除未使用的导入和代码,添加加载更多提示 重构消息列表组件以支持客服筛选功能 --- .../components/MessageRecord/index.tsx | 1 + .../pc/ckbox/components/ChatWindow/index.tsx | 2 +- .../SidebarMenu/MessageList/index.tsx | 19 ++++++++++++++++--- 3 files changed, 18 insertions(+), 4 deletions(-) diff --git a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/index.tsx b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/index.tsx index e2ea13bb..638806d7 100644 --- a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/index.tsx +++ b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/index.tsx @@ -192,6 +192,7 @@ const MessageRecord: React.FC = ({ contract }) => { return (
+
加载更多...
{groupMessagesByTime(currentMessages).map((group, groupIndex) => ( diff --git a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx index e90aab2a..11f817f4 100644 --- a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx +++ b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useRef } from "react"; +import React from "react"; import { Layout, Button, Avatar, Space, Dropdown, Menu, Tooltip } from "antd"; import { PhoneOutlined, diff --git a/Cunkebao/src/pages/pc/ckbox/components/SidebarMenu/MessageList/index.tsx b/Cunkebao/src/pages/pc/ckbox/components/SidebarMenu/MessageList/index.tsx index 14c68a3d..f954caaa 100644 --- a/Cunkebao/src/pages/pc/ckbox/components/SidebarMenu/MessageList/index.tsx +++ b/Cunkebao/src/pages/pc/ckbox/components/SidebarMenu/MessageList/index.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useEffect, useState } from "react"; import { List, Avatar, Badge } from "antd"; import { UserOutlined, TeamOutlined } from "@ant-design/icons"; import { ContractData, weChatGroup } from "@/pages/pc/ckbox/data"; @@ -11,11 +11,25 @@ interface MessageListProps {} const MessageList: React.FC = () => { const { setCurrentContact, currentContract } = useWeChatStore(); - const chatSessions = useCkChatStore(state => state.getChatSessions()); + const getChatSessions = useCkChatStore(state => state.chatSessions); + const kfSelected = useCkChatStore(state => state.kfSelected); const onContactClick = (session: ContractData | weChatGroup) => { setCurrentContact(session, true); }; + const [chatSessions, setChatSessions] = useState< + (ContractData | weChatGroup)[] + >([]); + useEffect(() => { + if (kfSelected == 0) { + setChatSessions(getChatSessions); + } else { + const newChatSessions = getChatSessions.filter( + v => v.wechatAccountId === kfSelected && kfSelected != 0, + ); + setChatSessions(newChatSessions); + } + }, [getChatSessions, kfSelected]); return (
= () => { )} /> -
最近一天的消息
); }; From b03b457e7e2f1135493c367717294712bf147099 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B6=85=E7=BA=A7=E8=80=81=E7=99=BD=E5=85=94?= Date: Fri, 5 Sep 2025 16:11:22 +0800 Subject: [PATCH 2/5] =?UTF-8?q?style(ckbox):=20=E8=B0=83=E6=95=B4=E5=9E=82?= =?UTF-8?q?=E7=9B=B4=E7=94=A8=E6=88=B7=E5=88=97=E8=A1=A8=E6=A0=B7=E5=BC=8F?= =?UTF-8?q?=E5=92=8C=E5=B8=83=E5=B1=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 修改侧边栏边框颜色为浅色 - 增加侧边栏宽度和头像尺寸 - 更新用户列表背景色和文字颜色 - 优化选中状态的视觉表现 --- .../VerticalUserList.module.scss | 39 +++++-------------- .../components/VerticalUserList/index.tsx | 4 +- Cunkebao/src/pages/pc/ckbox/index.module.scss | 2 +- Cunkebao/src/pages/pc/ckbox/index.tsx | 2 +- 4 files changed, 14 insertions(+), 33 deletions(-) diff --git a/Cunkebao/src/pages/pc/ckbox/components/VerticalUserList/VerticalUserList.module.scss b/Cunkebao/src/pages/pc/ckbox/components/VerticalUserList/VerticalUserList.module.scss index 060f8bb0..5ec4e8fd 100644 --- a/Cunkebao/src/pages/pc/ckbox/components/VerticalUserList/VerticalUserList.module.scss +++ b/Cunkebao/src/pages/pc/ckbox/components/VerticalUserList/VerticalUserList.module.scss @@ -2,18 +2,15 @@ display: flex; flex-direction: column; height: 100%; - background-color: #2e2e2e; - color: #fff; - width: 60px; + background-color: #ffffff; .userListHeader { padding: 10px 0; text-align: center; - border-bottom: 1px solid #3a3a3a; cursor: pointer; .allFriends { font-size: 12px; - color: #ccc; + color: #333333; } } @@ -40,35 +37,19 @@ padding: 10px 0; position: relative; cursor: pointer; - - &:hover { - background-color: #3a3a3a; - } + background: #ffffff; &.active { - background-color: #3a3a3a; + .userAvatar { + border: 4px solid #1890ff; - &::before { - content: ""; - position: absolute; - left: 0; - top: 50%; - transform: translateY(-50%); - width: 3px; - height: 20px; - background-color: #1890ff; + .active & { + border-color: #1890ff; + } } } } - .userAvatar { - border: 2px solid transparent; - - .active & { - border-color: #1890ff; - } - } - .messageBadge { :global(.ant-badge-count) { background-color: #ff4d4f; @@ -90,11 +71,11 @@ height: 8px; border-radius: 50%; border: 1px solid #2e2e2e; - + &.online { background-color: #52c41a; // 绿色表示在线 } - + &.offline { background-color: #8c8c8c; // 灰色表示离线 } diff --git a/Cunkebao/src/pages/pc/ckbox/components/VerticalUserList/index.tsx b/Cunkebao/src/pages/pc/ckbox/components/VerticalUserList/index.tsx index 675380e7..38f60f48 100644 --- a/Cunkebao/src/pages/pc/ckbox/components/VerticalUserList/index.tsx +++ b/Cunkebao/src/pages/pc/ckbox/components/VerticalUserList/index.tsx @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from "react"; +import React from "react"; import { Avatar, Badge, Tooltip } from "antd"; import styles from "./VerticalUserList.module.scss"; import { useCkChatStore, asyncKfSelected } from "@/store/module/ckchat/ckchat"; @@ -42,7 +42,7 @@ const VerticalUserList: React.FC = () => { > { {/* 垂直侧边栏 */} - + From 03145afa4f6f4771cbfe0cc38ffcbe523f3b048a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B6=85=E7=BA=A7=E8=80=81=E7=99=BD=E5=85=94?= Date: Fri, 5 Sep 2025 16:54:18 +0800 Subject: [PATCH 3/5] =?UTF-8?q?feat(ckbox):=20=E6=B7=BB=E5=8A=A0=E9=80=9A?= =?UTF-8?q?=E7=94=A8=E5=AF=BC=E8=88=AA=E7=BB=84=E4=BB=B6=E5=B9=B6=E4=BC=98?= =?UTF-8?q?=E5=8C=96=E8=81=8A=E5=A4=A9=E7=AA=97=E5=8F=A3=E5=B8=83=E5=B1=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 新增NavCommon组件作为通用导航栏 - 优化ChatWindow的flex布局和滚动行为 - 替换原Header为新的导航组件 - 更新构建产物文件 --- Cunkebao/dist/.vite/manifest.json | 18 +- Cunkebao/dist/index.html | 8 +- .../ChatWindow/ChatWindow.module.scss | 4 +- .../components/NavCommon/index.module.scss | 258 ++++++++++++++++++ .../pc/ckbox/components/NavCommon/index.tsx | 120 ++++++++ Cunkebao/src/pages/pc/ckbox/index.tsx | 5 +- 6 files changed, 397 insertions(+), 16 deletions(-) create mode 100644 Cunkebao/src/pages/pc/ckbox/components/NavCommon/index.module.scss create mode 100644 Cunkebao/src/pages/pc/ckbox/components/NavCommon/index.tsx diff --git a/Cunkebao/dist/.vite/manifest.json b/Cunkebao/dist/.vite/manifest.json index 8cbef19d..efc8b536 100644 --- a/Cunkebao/dist/.vite/manifest.json +++ b/Cunkebao/dist/.vite/manifest.json @@ -1,9 +1,9 @@ { - "_charts-C4aL5mHM.js": { - "file": "assets/charts-C4aL5mHM.js", + "_charts-DmoeDXY2.js": { + "file": "assets/charts-DmoeDXY2.js", "name": "charts", "imports": [ - "_ui-DJLY-TX6.js", + "_ui-D66ihimQ.js", "_vendor-2vc8h_ct.js" ] }, @@ -11,8 +11,8 @@ "file": "assets/ui-D0C0OGrH.css", "src": "_ui-D0C0OGrH.css" }, - "_ui-DJLY-TX6.js": { - "file": "assets/ui-DJLY-TX6.js", + "_ui-D66ihimQ.js": { + "file": "assets/ui-D66ihimQ.js", "name": "ui", "imports": [ "_vendor-2vc8h_ct.js" @@ -33,18 +33,18 @@ "name": "vendor" }, "index.html": { - "file": "assets/index-BaRKPU0c.js", + "file": "assets/index-bW2KwNBi.js", "name": "index", "src": "index.html", "isEntry": true, "imports": [ "_vendor-2vc8h_ct.js", "_utils-6WF66_dS.js", - "_ui-DJLY-TX6.js", - "_charts-C4aL5mHM.js" + "_ui-D66ihimQ.js", + "_charts-DmoeDXY2.js" ], "css": [ - "assets/index-bDMGkYaC.css" + "assets/index-BeKt58rz.css" ] } } \ No newline at end of file diff --git a/Cunkebao/dist/index.html b/Cunkebao/dist/index.html index bc66eb04..168b3e09 100644 --- a/Cunkebao/dist/index.html +++ b/Cunkebao/dist/index.html @@ -11,13 +11,13 @@ - + - - + + - +
diff --git a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/ChatWindow.module.scss b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/ChatWindow.module.scss index dfd8c0ce..d60ef945 100644 --- a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/ChatWindow.module.scss +++ b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/ChatWindow.module.scss @@ -110,8 +110,10 @@ .chatContent { flex: 1; - overflow: hidden; + overflow: visible; background: #f5f5f5; + display: flex; + flex-direction: column; .messagesContainer { height: 100%; diff --git a/Cunkebao/src/pages/pc/ckbox/components/NavCommon/index.module.scss b/Cunkebao/src/pages/pc/ckbox/components/NavCommon/index.module.scss new file mode 100644 index 00000000..75333cfb --- /dev/null +++ b/Cunkebao/src/pages/pc/ckbox/components/NavCommon/index.module.scss @@ -0,0 +1,258 @@ +.header { + background: #fff; + padding: 0 16px; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); + display: flex; + align-items: center; + justify-content: space-between; + height: 64px; + border-bottom: 1px solid #f0f0f0; +} + +.headerLeft { + display: flex; + align-items: center; + gap: 12px; +} + +.menuButton { + display: flex; + align-items: center; + justify-content: center; + width: 40px; + height: 40px; + border-radius: 6px; + transition: all 0.3s; + + &:hover { + background-color: #f5f5f5; + } + + .anticon { + font-size: 18px; + color: #666; + } +} + +.title { + font-size: 18px; + color: #333; + margin: 0; +} + +.headerRight { + display: flex; + align-items: center; +} + +.userInfo { + cursor: pointer; + padding: 8px 12px; + border-radius: 6px; + transition: all 0.3s; + + &:hover { + background-color: #f5f5f5; + } + .suanli { + font-size: 16px; + color: #666; + .suanliIcon { + font-size: 24px; + } + } +} + +.avatar { + border: 2px solid #f0f0f0; + transition: all 0.3s; + + &:hover { + border-color: #1890ff; + } +} + +.username { + font-size: 14px; + color: #333; + font-weight: 500; + margin-left: 8px; +} + +// 抽屉样式 +.drawer { + :global(.ant-drawer-header) { + background: #fafafa; + border-bottom: 1px solid #f0f0f0; + } + + :global(.ant-drawer-body) { + padding: 0; + } +} + +.drawerContent { + height: 100%; + display: flex; + flex-direction: column; + background: #f8f9fa; +} + +.drawerHeader { + padding: 20px; + background: #fff; + border-bottom: none; +} + +.logoSection { + display: flex; + align-items: center; + gap: 12px; +} + +.logoIcon { + width: 48px; + height: 48px; + background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); + border-radius: 12px; + display: flex; + align-items: center; + justify-content: center; + font-size: 24px; + color: white; +} + +.logoText { + display: flex; + flex-direction: column; +} + +.appName { + font-size: 18px; + font-weight: 600; + color: #333; + margin: 0; +} + +.appDesc { + font-size: 12px; + color: #999; + margin: 2px 0 0 0; +} + +.drawerBody { + flex: 1; + padding: 20px; + display: flex; + flex-direction: column; + gap: 16px; +} + +.primaryButton { + background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); + border-radius: 12px; + padding: 16px 20px; + display: flex; + align-items: center; + gap: 12px; + cursor: pointer; + transition: all 0.3s; + + &:hover { + transform: translateY(-2px); + box-shadow: 0 8px 25px rgba(102, 126, 234, 0.3); + } + + .buttonIcon { + font-size: 20px; + } + + span { + font-size: 16px; + font-weight: 600; + color: white; + } +} + +.menuSection { + margin-top: 8px; +} + +.menuItem { + display: flex; + align-items: center; + padding: 16px 20px; + cursor: pointer; + transition: all 0.3s; + border-radius: 8px; + + &:hover { + background-color: #f0f0f0; + } + + span { + font-size: 16px; + color: #333; + font-weight: 500; + } +} + +.menuIcon { + font-size: 20px; + margin-right: 12px; + width: 20px; + text-align: center; +} + +.drawerFooter { + padding: 20px; + background: #fff; + border-top: 1px solid #f0f0f0; + .balanceSection { + display: flex; + justify-content: space-between; + align-items: center; + .balanceIcon { + color: #666; + .suanliIcon { + font-size: 20px; + } + } + + .balanceText { + color: #3d9c0d; + } + } +} + +.balanceLabel { + font-size: 12px; + color: #999; + margin: 0; +} + +.balanceAmount { + font-size: 18px; + font-weight: 600; + color: #52c41a; + margin: 2px 0 0 0; +} + +// 响应式设计 +@media (max-width: 768px) { + .header { + padding: 0 12px; + } + + .title { + font-size: 16px; + } + + .username { + display: none; + } + + .drawer { + width: 280px !important; + } +} diff --git a/Cunkebao/src/pages/pc/ckbox/components/NavCommon/index.tsx b/Cunkebao/src/pages/pc/ckbox/components/NavCommon/index.tsx new file mode 100644 index 00000000..c8892960 --- /dev/null +++ b/Cunkebao/src/pages/pc/ckbox/components/NavCommon/index.tsx @@ -0,0 +1,120 @@ +import React, { useState } from "react"; +import { Layout, Drawer, Avatar, Dropdown, Space, Button } from "antd"; +import { + MenuOutlined, + UserOutlined, + LogoutOutlined, + SettingOutlined, +} from "@ant-design/icons"; +import type { MenuProps } from "antd"; +import { useCkChatStore } from "@/store/module/ckchat/ckchat"; +import { useNavigate } from "react-router-dom"; +import styles from "./index.module.scss"; + +const { Header } = Layout; + +interface NavCommonProps { + title?: string; + onMenuClick?: () => void; + drawerContent?: React.ReactNode; +} + +const NavCommon: React.FC = ({ + title = "触客宝", + onMenuClick, + drawerContent, +}) => { + const [drawerVisible, setDrawerVisible] = useState(false); + + const { userInfo } = useCkChatStore(); + + // 处理菜单图标点击 + const handleMenuClick = () => { + setDrawerVisible(true); + onMenuClick?.(); + }; + + // 处理抽屉关闭 + const handleDrawerClose = () => { + setDrawerVisible(false); + }; + + // 默认抽屉内容 + const defaultDrawerContent = ( +
+
+
+
+
+
触客宝
+
AI智能营销系统
+
+
+
+
+
+
🔒
+ AI智能客服 +
+
+
+
📊
+ 功能中心 +
+
+
+
+
+
+ 算力余额 +
+
9307.423
+
+
+
+ ); + + return ( + <> +
+
+
+ +
+ + + + 9307.423 + + } + src={userInfo?.account?.avatar} + className={styles.avatar} + /> + +
+
+ + + {drawerContent || defaultDrawerContent} + + + ); +}; + +export default NavCommon; diff --git a/Cunkebao/src/pages/pc/ckbox/index.tsx b/Cunkebao/src/pages/pc/ckbox/index.tsx index a696374b..5ed67f15 100644 --- a/Cunkebao/src/pages/pc/ckbox/index.tsx +++ b/Cunkebao/src/pages/pc/ckbox/index.tsx @@ -6,9 +6,10 @@ import ChatWindow from "./components/ChatWindow/index"; import SidebarMenu from "./components/SidebarMenu/index"; import VerticalUserList from "./components/VerticalUserList"; import PageSkeleton from "./components/Skeleton"; +import NavCommon from "./components/NavCommon"; import styles from "./index.module.scss"; import { addChatSession } from "@/store/module/ckchat/ckchat"; -const { Header, Content, Sider } = Layout; +const { Content, Sider } = Layout; import { chatInitAPIdata, initSocket } from "./main"; import { useWeChatStore } from "@/store/module/weChat/weChat"; @@ -54,7 +55,7 @@ const CkboxPage: React.FC = () => { return ( -
触客宝
+ {/* 垂直侧边栏 */} From ae1ef5211309177255ba52ebaea9c4d078edb706 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B6=85=E7=BA=A7=E8=80=81=E7=99=BD=E5=85=94?= Date: Fri, 5 Sep 2025 16:57:30 +0800 Subject: [PATCH 4/5] =?UTF-8?q?FEAT=20=3D>=20=E6=9C=AC=E6=AC=A1=E6=9B=B4?= =?UTF-8?q?=E6=96=B0=E9=A1=B9=E7=9B=AE=E4=B8=BA=EF=BC=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/MessageRecord/MessageRecord.module.scss | 5 +++++ .../components/ChatWindow/components/MessageRecord/index.tsx | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/MessageRecord.module.scss b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/MessageRecord.module.scss index 96fe8a3e..f35eb61c 100644 --- a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/MessageRecord.module.scss +++ b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/MessageRecord.module.scss @@ -34,6 +34,11 @@ margin: 8px 0; position: relative; } +.loadMore { + text-align: center; + color: #1890ff; + cursor: pointer; +} // 消息项 .messageItem { diff --git a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/index.tsx b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/index.tsx index 638806d7..426a5023 100644 --- a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/index.tsx +++ b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/index.tsx @@ -192,7 +192,7 @@ const MessageRecord: React.FC = ({ contract }) => { return (
-
加载更多...
+
点击加载更早的信息
{groupMessagesByTime(currentMessages).map((group, groupIndex) => ( From c4ba459b20c92409ad0ea67f4cbd34f604dff91e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B6=85=E7=BA=A7=E8=80=81=E7=99=BD=E5=85=94?= Date: Fri, 5 Sep 2025 17:04:34 +0800 Subject: [PATCH 5/5] =?UTF-8?q?refactor(ckbox):=20=E7=A7=BB=E9=99=A4?= =?UTF-8?q?=E5=85=A8=E5=B1=80profile=E7=8A=B6=E6=80=81=E5=B9=B6=E7=A7=BB?= =?UTF-8?q?=E8=87=B3ChatWindow=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 将profile显示状态从父组件移至ChatWindow组件内部管理,简化组件间通信 --- .../pc/ckbox/components/ChatWindow/index.tsx | 24 ++++++++++++------- Cunkebao/src/pages/pc/ckbox/index.tsx | 11 +++------ 2 files changed, 19 insertions(+), 16 deletions(-) diff --git a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx index 11f817f4..9019a963 100644 --- a/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx +++ b/Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useState } from "react"; import { Layout, Button, Avatar, Space, Dropdown, Menu, Tooltip } from "antd"; import { PhoneOutlined, @@ -6,6 +6,7 @@ import { MoreOutlined, UserOutlined, TeamOutlined, + InfoCircleOutlined, } from "@ant-design/icons"; import { ContractData, weChatGroup } from "@/pages/pc/ckbox/data"; import styles from "./ChatWindow.module.scss"; @@ -18,15 +19,13 @@ const { Header, Content } = Layout; interface ChatWindowProps { contract: ContractData | weChatGroup; - showProfile?: boolean; - onToggleProfile?: () => void; } -const ChatWindow: React.FC = ({ - contract, - showProfile = true, - onToggleProfile, -}) => { +const ChatWindow: React.FC = ({ contract }) => { + const [showProfile, setShowProfile] = useState(true); + const onToggleProfile = () => { + setShowProfile(!showProfile); + }; const chatMenu = ( }> @@ -76,6 +75,7 @@ const ChatWindow: React.FC = ({ className={styles.headerButton} /> + -
- setShowProfile(!showProfile)} - /> +
*/} + ) : (