feat: 路由守卫中chat/id的处理

src/layouts/HistoryBar/components/HistoryBarList/index.tsx

 import { motion } from 'framer-motion'
 import { motion } from 'framer-motion'
 import { Button } from '@nextui-org/react'
 import { Button } from '@nextui-org/react'
+import { useNavigate } from 'react-router-dom'
 import { containerVariants, itemVariants } from '../../motionAnimate'
 import { containerVariants, itemVariants } from '../../motionAnimate'
 import EmptyIcon from '@/assets/svg/empty.svg?react'
 import EmptyIcon from '@/assets/svg/empty.svg?react'
 import { useAppSelector } from '@/store/hook'
 import { useAppSelector } from '@/store/hook'
+import type { Conversation } from '@/types/conversation'
 
 
 export const HistoryBarList: React.FC = () => {
 export const HistoryBarList: React.FC = () => {
+  const navigate = useNavigate()
   const { currentConversationId, conversations } = useAppSelector(state => state.conversation)
   const { currentConversationId, conversations } = useAppSelector(state => state.conversation)
-
+  const handleClick = (conversation: Conversation) => {
+    navigate(`/chat/${conversation.conversationId}`)
+  }
   return (
   return (
     conversations.length !== 0
     conversations.length !== 0
       ? (
       ? (
@@ -34,6 +39,7 @@ export const HistoryBarList: React.FC = () => {
                             color="primary"
                             color="primary"
                             variant="light"
                             variant="light"
                             className={`text-left w-full text-[#333] rounded-[23px] data-[hover=true]:bg-[#E5F6FF] data-[hover=true]:text-primary ${currentConversationId === item.conversationId ? 'bg-[#E5F6FF] text-primary' : ''}`}
                             className={`text-left w-full text-[#333] rounded-[23px] data-[hover=true]:bg-[#E5F6FF] data-[hover=true]:text-primary ${currentConversationId === item.conversationId ? 'bg-[#E5F6FF] text-primary' : ''}`}
+                            onClick={() => handleClick(item)}
                           >
                           >
                             <div className="w-full text-nowrap text-ellipsis overflow-hidden">
                             <div className="w-full text-nowrap text-ellipsis overflow-hidden">
                               <span>{item.conversationTitle}</span>
                               <span>{item.conversationTitle}</span>

src/routes/RouteChangeHandler.tsx

 import React, { useEffect } from 'react'
 import React, { useEffect } from 'react'
 import { useLocation } from 'react-router-dom'
 import { useLocation } from 'react-router-dom'
-import { clearCurrentConversation } from '@/store/conversationSlice'
+import { clearCurrentConversation, setCurrentConversation } from '@/store/conversationSlice'
 import { useAppDispatch } from '@/store/hook'
 import { useAppDispatch } from '@/store/hook'
 
 
 export function withRouteChangeHandler(WrappedComponent: React.ComponentType) {
 export function withRouteChangeHandler(WrappedComponent: React.ComponentType) {
@@ -12,6 +12,10 @@ export function withRouteChangeHandler(WrappedComponent: React.ComponentType) {
       if (location.pathname === '/') {
       if (location.pathname === '/') {
         dispatch(clearCurrentConversation())
         dispatch(clearCurrentConversation())
       }
       }
+      else if (location.pathname.startsWith('/chat/')) {
+        const conversationId = location.pathname.split('/')[2]
+        dispatch(setCurrentConversation(conversationId))
+      }
       // 这里可以添加其他路由相关的逻辑
       // 这里可以添加其他路由相关的逻辑
     }, [location, dispatch])
     }, [location, dispatch])