From fb9245ca4c9507de9ed1b3e3920ec55f79352a1f Mon Sep 17 00:00:00 2001
From: ayush-pingsafe <ayush@pingsafe.com>
Date: Wed, 26 Oct 2022 10:14:33 +0530
Subject: [PATCH 1/3] feat: added button to stop searching for a buddy

---
 client/src/components/BuddyMatcher.jsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/client/src/components/BuddyMatcher.jsx b/client/src/components/BuddyMatcher.jsx
index 3a05dd74..1d08c4d9 100644
--- a/client/src/components/BuddyMatcher.jsx
+++ b/client/src/components/BuddyMatcher.jsx
@@ -5,7 +5,7 @@ import { SocketContext } from 'context/Context';
 import Anonymous from 'components/Anonymous';
 import { useAuth } from 'src/context/AuthContext';
 import { useChat } from 'src/context/ChatContext';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate, Link } from 'react-router-dom';
 import { useNotification } from 'src/lib/notification';
 
 const BuddyMatcher = () => {
@@ -136,6 +136,14 @@ const BuddyMatcher = () => {
         <div className="flex w-full justify-center items-center min-h-[86.5vh] flex-col bg-primary">
             <ThreeDots fill="rgb(255 159 28)" />
             <div className="text-lg text-center text-white">{loadingText}</div>
+            <Link
+                to="/"
+                className={
+                    'hover:no-underline hover:text-white font-medium text-white text-[1.5em] w-[8em] h-[2.3em] mt-4 rounded-[30px] border-4 border-solid border-[#f04336] flex flex-col items-center justify-center'
+                }
+            >
+                Stop
+            </Link>
         </div>
     );
 };

From fb43111226591136cdfc4a1ccc8fa7624a5a1e2c Mon Sep 17 00:00:00 2001
From: Ayush Sharma <ayush.sh143@gmail.com>
Date: Wed, 26 Oct 2022 17:04:55 +0530
Subject: [PATCH 2/3] add changes to remove user from waiting list

---
 client/src/components/BuddyMatcher.jsx | 24 ++++++++++++++++++++----
 server/index.js                        |  5 +++++
 2 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/client/src/components/BuddyMatcher.jsx b/client/src/components/BuddyMatcher.jsx
index 1d08c4d9..917499bf 100644
--- a/client/src/components/BuddyMatcher.jsx
+++ b/client/src/components/BuddyMatcher.jsx
@@ -5,9 +5,10 @@ import { SocketContext } from 'context/Context';
 import Anonymous from 'components/Anonymous';
 import { useAuth } from 'src/context/AuthContext';
 import { useChat } from 'src/context/ChatContext';
-import { useNavigate, Link } from 'react-router-dom';
+import { useNavigate } from 'react-router-dom';
 import { useNotification } from 'src/lib/notification';
 
+const stoppingSearchLoadingText = <p>Stopping the search</p>;
 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,14 +152,14 @@ const BuddyMatcher = () => {
         <div className="flex w-full justify-center items-center min-h-[86.5vh] flex-col bg-primary">
             <ThreeDots fill="rgb(255 159 28)" />
             <div className="text-lg text-center text-white">{loadingText}</div>
-            <Link
-                to="/"
+            {!isStoppingSearch && <button
+                onClick={handleStopSearch}
                 className={
                     'hover:no-underline hover:text-white font-medium text-white text-[1.5em] w-[8em] h-[2.3em] mt-4 rounded-[30px] border-4 border-solid border-[#f04336] flex flex-col items-center justify-center'
                 }
             >
                 Stop
-            </Link>
+            </button>}
         </div>
     );
 };
diff --git a/server/index.js b/server/index.js
index e33c58e6..ced4f40b 100644
--- a/server/index.js
+++ b/server/index.js
@@ -327,6 +327,11 @@ io.on('connection', (socket) => {
             socket.broadcast.to(emailOrLoginId).emit('inactive');
         });
     });
+
+    socket.on('stop_search', async ({ loginId, email }) => {
+        await delWaitingUser(email ?? loginId);
+        socket.emit('stop_search_success');
+    });
 });
 
 app.use(cors());

From 8d65486711aa311a214b006983d9187878c4d500 Mon Sep 17 00:00:00 2001
From: Ayush Sharma <ayush.sh143@gmail.com>
Date: Wed, 26 Oct 2022 17:42:10 +0530
Subject: [PATCH 3/3] Update BuddyMatcher.jsx

---
 client/src/components/BuddyMatcher.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/components/BuddyMatcher.jsx b/client/src/components/BuddyMatcher.jsx
index 917499bf..b147d832 100644
--- a/client/src/components/BuddyMatcher.jsx
+++ b/client/src/components/BuddyMatcher.jsx
@@ -155,7 +155,7 @@ const BuddyMatcher = () => {
             {!isStoppingSearch && <button
                 onClick={handleStopSearch}
                 className={
-                    'hover:no-underline hover:text-white font-medium text-white text-[1.5em] w-[8em] h-[2.3em] mt-4 rounded-[30px] border-4 border-solid border-[#f04336] flex flex-col items-center justify-center'
+                    'hover:no-underline hover:text-white font-medium text-white text-[1.5em] w-[8em] h-[2.3em] mt-4 rounded-[30px] bg-[#FF3A46] flex flex-col items-center justify-center'
                 }
             >
                 Stop