diff --git a/src/hooks/useMatchUsers.ts b/src/hooks/useMatchUsers.ts index 40fb746..6302d79 100644 --- a/src/hooks/useMatchUsers.ts +++ b/src/hooks/useMatchUsers.ts @@ -1,6 +1,7 @@ import { useSession } from "next-auth/react"; import { useRouter } from "next/router"; import { useEffect, useState } from "react"; +import toast from "react-hot-toast"; import { api } from "~/utils/api"; type UseMatchUsersResult = { @@ -23,6 +24,7 @@ export default function useMatchUsers(): UseMatchUsersResult { data.user2 === session?.user.id ) { console.log("Routing"); + toast.success("Redirecting to room..."); void router.push(`/collab/rooms/${data.sessionId}`); } }, diff --git a/src/pages/collab/index.tsx b/src/pages/collab/index.tsx index 022c246..008e677 100644 --- a/src/pages/collab/index.tsx +++ b/src/pages/collab/index.tsx @@ -60,40 +60,6 @@ const MatchRequestPage = () => { }; }); - useEffect(() => { - if (time === REQUEST_EXPIRY_TIME_SECS && curUserMatchRequest) { - const { difficulty, category, matchType } = curUserMatchRequest; - const sameRequest = { difficulty, category, matchType }; - deleteMatchRequest({ matchType: curUserMatchRequest.matchType }); - toast( - (t) => ( -
- No requests found 🫠. -
- - -
-
- ), - { duration: 60000, id: "timeout", position: "top-center" }, - ); - } - }, [time]); const matchUsers = useMatchUsers(); const [isCreatingMatchRequest, setIsCreatingMatchRequest] = useState(false); @@ -107,7 +73,7 @@ const MatchRequestPage = () => { const { data: numOfOnlineUsers = 0, refetch: refetchGetNumOfMatchReqs } = api.matchRequest.getNumOfMatchRequests.useQuery(); - const { data: curUserMatchRequest, refetch: refetchCurrentUserRequest } = + const { data: curUserMatchRequest, refetch: refetchCurrentUserRequest, isFetching: isCurUserMatchFetching } = api.matchRequest.getCurrentUserRequest.useQuery(undefined, { onError() { toast.error("Error loading current user's match request"); @@ -173,12 +139,49 @@ const MatchRequestPage = () => { api.matchRequest.subscribeToMyRequestSuccess.useSubscription(undefined, { onData(data) { matchUsers.setMatchedUsers(data.userId1, data.userId2); - toast.success("Redirecting to room..."); }, }); // subscprtions api -- END + + useEffect(() => { + if (time >= REQUEST_EXPIRY_TIME_SECS && curUserMatchRequest && !isCurUserMatchFetching) { + const { difficulty, category, matchType } = curUserMatchRequest; + const sameRequest = { difficulty, category, matchType }; + deleteMatchRequest({ matchType: curUserMatchRequest.matchType }); + stopTimer(); + toast( + (t) => ( +
+ No requests found 🫠. +
+ + +
+
+ ), + { duration: 60000, id: "timeout", position: "top-center" }, + ); + } + }, [time, isCurUserMatchFetching]); + useEffect(() => { + if (isCurUserMatchFetching) return; if (!curUserMatchRequest) { if (intervalRef.current) { clearInterval(intervalRef.current); @@ -200,7 +203,7 @@ const MatchRequestPage = () => { intervalRef.current = setInterval(() => { setTime((prev) => prev + 1); }, 1000); - }, [curUserMatchRequest]); + }, [curUserMatchRequest, isCurUserMatchFetching]); const { data: manualRequests = [],