diff --git a/client/src/components/BuddyMatcher.jsx b/client/src/components/BuddyMatcher.jsx index 3a05dd74..b147d832 100644 --- a/client/src/components/BuddyMatcher.jsx +++ b/client/src/components/BuddyMatcher.jsx @@ -8,6 +8,7 @@ import { useChat } from 'src/context/ChatContext'; import { useNavigate } from 'react-router-dom'; import { useNotification } from 'src/lib/notification'; +const stoppingSearchLoadingText =
Stopping the search
; const BuddyMatcher = () => { const { playNotification } = useNotification(); const navigate = useNavigate(); @@ -16,6 +17,7 @@ const BuddyMatcher = () => { // eslint-disable-next-line no-unused-vars const [isFound, setIsFound] = useState(false); + const [isStoppingSearch, setIsStoppingSearch] = useState(false); const socket = useContext(SocketContext); const userID = auth.loginId; @@ -29,6 +31,15 @@ const BuddyMatcher = () => { socket.emit('join', { loginId: auth.loginId, email: auth.email }); }; + const handleStopSearch = () => { + socket.emit('stop_search', { loginId: auth.loginId, email: auth.email }); + setIsStoppingSearch(true); + }; + + useEffect(() => { + setLoadingText(isStoppingSearch ? stoppingSearchLoadingText : defaultLoadingText); + }, [isStoppingSearch]); + useEffect(() => { if (loadingText === defaultLoadingText) { timeout = setTimeout(() => { @@ -119,6 +130,11 @@ const BuddyMatcher = () => { setIsFound(false); }); + socket.on('stop_search_success', () => { + setIsStoppingSearch(false); + navigate('/'); + }); + return () => { socket .off('connect') @@ -136,6 +152,14 @@ const BuddyMatcher = () => {