feat: sending friend request

src/main/events/index.ts

@@ -47,6 +47,7 @@ import "./profile/get-friend-requests";
 import "./profile/get-me";
 import "./profile/update-friend-request";
 import "./profile/update-profile";
+import "./profile/send-friend-request";
 
 ipcMain.handle("ping", () => "pong");
 ipcMain.handle("getVersion", () => app.getVersion());

src/main/events/profile/send-friend-request.ts

@@ -0,0 +1,11 @@
+import { registerEvent } from "../register-event";
+import { HydraApi } from "@main/services";
+
+const sendFriendRequest = async (
+  _event: Electron.IpcMainInvokeEvent,
+  userId: string
+) => {
+  return HydraApi.post("/profile/friend-requests", { friendCode: userId });
+};
+
+registerEvent("sendFriendRequest", sendFriendRequest);

src/preload/index.ts

@@ -140,6 +140,8 @@ contextBridge.exposeInMainWorld("electron", {
   getFriendRequests: () => ipcRenderer.invoke("getFriendRequests"),
   updateFriendRequest: (userId: string, action: FriendRequestAction) =>
     ipcRenderer.invoke("updateFriendRequest", userId, action),
+  sendFriendRequest: (userId: string) =>
+    ipcRenderer.invoke("sendFriendRequest", userId),
 
   /* User */
   getUser: (userId: string) => ipcRenderer.invoke("getUser", userId),

src/renderer/src/declaration.d.ts

@@ -139,6 +139,7 @@ declare global {
       userId: string,
       action: FriendRequestAction
     ) => Promise<void>;
+    sendFriendRequest: (userId: string) => Promise<void>;
   }
 
   interface Window {

src/renderer/src/hooks/use-user-details.ts

@@ -8,7 +8,7 @@ import {
   setFriendRequests,
 } from "@renderer/features";
 import { darkenColor } from "@renderer/helpers";
-import { UserDetails } from "@types";
+import { FriendRequestAction, UserDetails } from "@types";
 
 export function useUserDetails() {
   const dispatch = useAppDispatch();
@@ -83,7 +83,7 @@ export function useUserDetails() {
   );
 
   const sendFriendRequest = useCallback(async (userId: string) => {
-    console.log("sending friend request to", userId);
+    return window.electron.sendFriendRequest(userId);
   }, []);
 
   const updateFriendRequests = useCallback(async () => {
@@ -91,6 +91,18 @@ export function useUserDetails() {
     dispatch(setFriendRequests(friendRequests));
   }, [dispatch]);
 
+  const updateFriendRequestState = useCallback(
+    async (userId: string, action: FriendRequestAction) => {
+      return window.electron
+        .updateFriendRequest(userId, action)
+        .then(() => {})
+        .catch(() => {
+          console.log("falha no updateFriendsRequestState");
+        });
+    },
+    [updateFriendRequests]
+  );
+
   return {
     userDetails,
     profileBackground,
@@ -102,5 +114,6 @@ export function useUserDetails() {
     patchUser,
     sendFriendRequest,
     updateFriendRequests,
+    updateFriendRequestState,
   };
 }

src/renderer/src/pages/user/user-add-friends-modal.tsx

@@ -22,8 +22,12 @@ export const UserAddFriendsModal = ({
 
   const navigate = useNavigate();
 
-  const { sendFriendRequest, updateFriendRequests, friendRequests } =
-    useUserDetails();
+  const {
+    sendFriendRequest,
+    updateFriendRequests,
+    updateFriendRequestState,
+    friendRequests,
+  } = useUserDetails();
 
   const { showSuccessToast, showErrorToast } = useToast();
 
@@ -43,27 +47,51 @@ export const UserAddFriendsModal = ({
   };
 
   const handleClickFriend = (userId: string) => {
+    console.log("click friend");
+    onClose();
     navigate(`/user/${userId}`);
   };
 
   const handleClickSeeProfile = () => {
+    console.log("click see profile");
     onClose();
     navigate(`/user/${friendCode}`);
   };
 
-  const handleClickCancelFriendRequest = (userId: string) => {
-    console.log(userId);
-    updateFriendRequests();
+  const handleClickCancelFriendRequest = (
+    event: React.MouseEvent,
+    userId: string
+  ) => {
+    console.log("cancel");
+    event.preventDefault();
+    updateFriendRequestState(userId, "CANCEL")
+      .then(() => {
+        console.log("sucesso");
+      })
+      .catch(() => {
+        showErrorToast("Falha ao cancelar convite");
+      });
   };
 
-  const handleClickAcceptFriendRequest = (userId: string) => {
-    console.log(userId);
-    updateFriendRequests();
+  const handleClickAcceptFriendRequest = (
+    event: React.MouseEvent,
+    userId: string
+  ) => {
+    console.log("accept friend request");
+    event.preventDefault();
+    updateFriendRequestState(userId, "ACCEPTED").catch(() => {
+      showErrorToast("Falha ao aceitar convite");
+    });
   };
 
-  const handleClickRefuseFriendRequest = (userId: string) => {
-    console.log(userId);
-    updateFriendRequests();
+  const handleClickRefuseFriendRequest = (
+    event: React.MouseEvent,
+    userId: string
+  ) => {
+    event.preventDefault();
+    updateFriendRequestState(userId, "REFUSED").catch(() => {
+      showErrorToast("Falha ao recusar convite");
+    });
   };
 
   const resetModal = () => {
@@ -136,11 +164,11 @@ export const UserAddFriendsModal = ({
             {friendRequests?.map((request) => {
               return (
                 <UserFriendRequest
-                  key={request.userId}
+                  key={request.id}
                   displayName={request.displayName}
                   isRequestSent={request.type === "SENT"}
                   profileImageUrl={request.profileImageUrl}
-                  userId={request.userId}
+                  userId={request.id}
                   onClickAcceptRequest={handleClickAcceptFriendRequest}
                   onClickCancelRequest={handleClickCancelFriendRequest}
                   onClickRefuseRequest={handleClickRefuseFriendRequest}

src/renderer/src/pages/user/user-friend-request.tsx

@@ -11,9 +11,9 @@ export interface UserFriendRequestProps {
   profileImageUrl: string | null;
   displayName: string;
   isRequestSent: boolean;
-  onClickCancelRequest: (userId: string) => void;
-  onClickAcceptRequest: (userId: string) => void;
-  onClickRefuseRequest: (userId: string) => void;
+  onClickCancelRequest: (event: React.MouseEvent, userId: string) => void;
+  onClickAcceptRequest: (event: React.MouseEvent, userId: string) => void;
+  onClickRefuseRequest: (event: React.MouseEvent, userId: string) => void;
   onClickRequest: (userId: string) => void;
 }
 
@@ -59,7 +59,7 @@ export const UserFriendRequest = ({
       {isRequestSent ? (
         <button
           className={styles.cancelRequestButton}
-          onClick={() => onClickCancelRequest(userId)}
+          onClick={(e) => onClickCancelRequest(e, userId)}
         >
           <XCircleIcon size={28} />
         </button>
@@ -67,13 +67,13 @@ export const UserFriendRequest = ({
         <>
           <button
             className={styles.acceptRequestButton}
-            onClick={() => onClickAcceptRequest(userId)}
+            onClick={(e) => onClickAcceptRequest(e, userId)}
           >
             <CheckCircleIcon size={28} />
           </button>
           <button
             className={styles.cancelRequestButton}
-            onClick={() => onClickRefuseRequest(userId)}
+            onClick={(e) => onClickRefuseRequest(e, userId)}
           >
             <XCircleIcon size={28} />
           </button>

src/types/index.ts

@@ -278,7 +278,7 @@ export interface UserFriend {
 }
 
 export interface FriendRequest {
-  userId: string;
+  id: string;
   displayName: string;
   profileImageUrl: string | null;
   type: "SENT" | "RECEIVED";