diff --git a/frontend/app/lib/hooks/useInviteToGame.ts b/frontend/app/lib/hooks/useInviteToGame.ts
deleted file mode 100644
index e507be96..00000000
--- a/frontend/app/lib/hooks/useInviteToGame.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-"use client";
-
-import { chatSocket as socket } from "@/socket";
-import { useCallback, useState } from "react";
-
-export const useInviteToGame = (userId: number) => {
- const [isInvitingToGame, setIsInvitingToGame] = useState(false);
- const [invitePending, setInvitePending] = useState(false);
-
- const inviteToGame = useCallback(async () => {
- setInvitePending(true);
- await socket.emit("invite-pong", { userId: userId });
- setIsInvitingToGame(true);
- setInvitePending(false);
- }, [userId]);
- const cancelInviteToGame = useCallback(async () => {
- setInvitePending(true);
- await socket.emit("invite-cancel-pong", { userId: userId });
- setIsInvitingToGame(false);
- setInvitePending(false);
- }, [userId]);
-
- return {
- invitePending,
- isInvitingToGame,
- inviteToGame,
- cancelInviteToGame,
- };
-};
diff --git a/frontend/app/lib/hooks/useRequestMatch.ts b/frontend/app/lib/hooks/useRequestMatch.ts
new file mode 100644
index 00000000..ab551afc
--- /dev/null
+++ b/frontend/app/lib/hooks/useRequestMatch.ts
@@ -0,0 +1,29 @@
+"use client";
+
+import { chatSocket as socket } from "@/socket";
+import { useCallback, useState } from "react";
+
+export const useRequestMatch = (userId: number) => {
+ const [isRequestingMatch, setIsRequestingMatch] = useState(false);
+ const [sendRequestPending, setSendRequestPending] = useState(false);
+
+ const requestMatch = useCallback(async () => {
+ setSendRequestPending(true);
+ await socket.emit("invite-pong", { userId: userId });
+ setIsRequestingMatch(true);
+ setSendRequestPending(false);
+ }, [userId]);
+ const cancelRequestMatch = useCallback(async () => {
+ setSendRequestPending(true);
+ await socket.emit("invite-cancel-pong", { userId: userId });
+ setIsRequestingMatch(false);
+ setSendRequestPending(false);
+ }, [userId]);
+
+ return {
+ isRequestingMatch,
+ sendRequestPending,
+ requestMatch,
+ cancelRequestMatch,
+ };
+};
diff --git a/frontend/app/room/[id]/sidebar-item.tsx b/frontend/app/room/[id]/sidebar-item.tsx
index ba6fd317..7ce803c2 100644
--- a/frontend/app/room/[id]/sidebar-item.tsx
+++ b/frontend/app/room/[id]/sidebar-item.tsx
@@ -8,9 +8,9 @@ import type {
UserOnRoomEntity,
} from "@/app/lib/dtos";
import { useBlock } from "@/app/lib/hooks/useBlock";
-import { useInviteToGame } from "@/app/lib/hooks/useInviteToGame";
import { useKick } from "@/app/lib/hooks/useKick";
import { useMute } from "@/app/lib/hooks/useMute";
+import { useRequestMatch } from "@/app/lib/hooks/useRequestMatch";
import { useUpdateRole } from "@/app/lib/hooks/useUpdateRole";
import { Avatar } from "@/app/ui/user/avatar";
import {
@@ -53,8 +53,12 @@ export default function SidebarItem({
user.userId,
blockingUsers,
);
- const { invitePending, isInvitingToGame, inviteToGame, cancelInviteToGame } =
- useInviteToGame(user.userId);
+ const {
+ sendRequestPending,
+ isRequestingMatch,
+ requestMatch,
+ cancelRequestMatch,
+ } = useRequestMatch(user.userId);
const { kickPending, kick } = useKick(room.id, user.userId, me.userId);
const { mutePending, isMuted, mute, unmute } = useMute(
room.id,
@@ -138,20 +142,20 @@ export default function SidebarItem({
>
Unblock
- {!isInvitingToGame && (
+ {!isRequestingMatch && (
- Invite
+ Request Match
)}
- {isInvitingToGame && (
+ {isRequestingMatch && (
- Cancel invite
+ Cancel Request
)}
{isMeAdminOrOwner && !isUserOwner && (