From 354492bc1af74d03e5b0aca7fe53e8ef3cffdf4a Mon Sep 17 00:00:00 2001 From: Nuwan Date: Fri, 6 Feb 2026 18:42:35 +0530 Subject: [PATCH] feat(16-01): add upload success toast notification - Add selectUploadStatus selector to track upload state transitions - Track previous upload status with useRef - Show toast.success when upload completes (uploading -> idle) - Auto-dismiss after 3 seconds per REQ-5.4 - Success toast provides clear feedback on successful file uploads --- jam-ui/src/components/client/JKSessionScreen.js | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/jam-ui/src/components/client/JKSessionScreen.js b/jam-ui/src/components/client/JKSessionScreen.js index efda1e0c0..4879bd746 100644 --- a/jam-ui/src/components/client/JKSessionScreen.js +++ b/jam-ui/src/components/client/JKSessionScreen.js @@ -55,7 +55,7 @@ import { selectBackingTrackData, selectJamTrackData } from '../../store/features/activeSessionSlice'; -import { addMessageFromWebSocket, uploadAttachment, selectIsUploading, selectUploadError, selectUploadFileName, clearUploadError } from '../../store/features/sessionChatSlice'; +import { addMessageFromWebSocket, uploadAttachment, selectIsUploading, selectUploadError, selectUploadFileName, selectUploadStatus, clearUploadError } from '../../store/features/sessionChatSlice'; import { validateFile } from '../../services/attachmentValidation'; import { CLIENT_ROLE, RECORD_TYPE_AUDIO, RECORD_TYPE_BOTH } from '../../helpers/globals'; @@ -203,6 +203,8 @@ const JKSessionScreen = () => { const isUploading = useSelector(selectIsUploading); const uploadError = useSelector(selectUploadError); const uploadFileName = useSelector(selectUploadFileName); + const uploadStatus = useSelector(selectUploadStatus); + const prevUploadStatusRef = useRef(uploadStatus); // File input ref for attach button const attachFileInputRef = useRef(null); @@ -1048,6 +1050,15 @@ const JKSessionScreen = () => { } }, [uploadError, dispatch]); + // Show success toast when upload completes + useEffect(() => { + // Show success toast when upload transitions from 'uploading' to 'idle' + if (prevUploadStatusRef.current === 'uploading' && uploadStatus === 'idle') { + toast.success('File uploaded successfully', { autoClose: 3000 }); + } + prevUploadStatusRef.current = uploadStatus; + }, [uploadStatus]); + const handleBackingTrackSelected = async (result) => { console.log('JKSessionScreen: handleBackingTrackSelected called with:', result); console.log('JKSessionScreen: Current state - showBackingTrackPopup:', showBackingTrackPopup, 'popupGuard:', popupGuard);