diff --git a/jam-ui/src/components/client/chat/JKChatMessageList.js b/jam-ui/src/components/client/chat/JKChatMessageList.js index a46017e7a..881960cda 100644 --- a/jam-ui/src/components/client/chat/JKChatMessageList.js +++ b/jam-ui/src/components/client/chat/JKChatMessageList.js @@ -4,12 +4,15 @@ import { selectChatMessages, selectFetchStatus, selectActiveChannel, + selectIsUploading, + selectUploadFileName, fetchChatHistory } from '../../../store/features/sessionChatSlice'; import { selectSessionId } from '../../../store/features/activeSessionSlice'; import JKChatMessage from './JKChatMessage'; import JKChatLoadingSpinner from './JKChatLoadingSpinner'; import JKChatEmptyState from './JKChatEmptyState'; +import JKChatUploadProgress from './JKChatUploadProgress'; /** * JKChatMessageList - Message list component with auto-scroll behavior @@ -33,6 +36,8 @@ const JKChatMessageList = () => { const sessionId = useSelector(selectSessionId); const messages = useSelector((state) => selectChatMessages(state, activeChannel)); const fetchStatus = useSelector((state) => selectFetchStatus(state, activeChannel)); + const isUploading = useSelector(selectIsUploading); + const uploadFileName = useSelector(selectUploadFileName); const listRef = useRef(null); const [isUserScrolling, setIsUserScrolling] = useState(false); @@ -167,6 +172,10 @@ const JKChatMessageList = () => { {messages.map((message) => ( ))} + {/* Upload progress indicator */} + {isUploading && uploadFileName && ( + + )} ); };