fix: refactor mutation type

src/frontend/src/controllers/API/queries/api-keys/use-post-add-api-key.ts

@@ -8,9 +8,10 @@ interface IPostAddApiKey {
 }
 
 // add types for error handling and success
-export const usePostAddApiKey: useMutationFunctionType<IPostAddApiKey> = (
-  options,
-) => {
+export const usePostAddApiKey: useMutationFunctionType<
+  undefined,
+  IPostAddApiKey
+> = (options) => {
   const { mutate } = UseRequestProcessor();
 
   const postAddApiKeyFn = async (payload: IPostAddApiKey): Promise<any> => {

src/frontend/src/controllers/API/queries/auth/use-add-user.ts

@@ -5,7 +5,7 @@ import { api } from "../../api";
 import { getURL } from "../../helpers/constants";
 import { UseRequestProcessor } from "../../services/request-processor";
 
-export const useAddUser: useMutationFunctionType<UserInputType> = (
+export const useAddUser: useMutationFunctionType<undefined, UserInputType> = (
   options?,
 ) => {
   const { mutate } = UseRequestProcessor();

src/frontend/src/controllers/API/queries/auth/use-delete-users.ts

@@ -8,9 +8,10 @@ interface DeleteUserParams {
   user_id: string;
 }
 
-export const useDeleteMessages: useMutationFunctionType<DeleteUserParams> = (
-  options?,
-) => {
+export const useDeleteMessages: useMutationFunctionType<
+  undefined,
+  DeleteUserParams
+> = (options?) => {
   const { mutate } = UseRequestProcessor();
 
   const deleteMessage = async ({ user_id }: DeleteUserParams): Promise<any> => {

src/frontend/src/controllers/API/queries/auth/use-login-user.ts

@@ -4,7 +4,9 @@ import { api } from "../../api";
 import { getURL } from "../../helpers/constants";
 import { UseRequestProcessor } from "../../services/request-processor";
 
-export const useLoginUser: useMutationFunctionType<LoginType> = (options?) => {
+export const useLoginUser: useMutationFunctionType<undefined, LoginType> = (
+  options?,
+) => {
   const { mutate } = UseRequestProcessor();
 
   async function updateUser({ password, username }: LoginType): Promise<any> {

src/frontend/src/controllers/API/queries/auth/use-logout.ts

@@ -5,12 +5,17 @@ import {
   useMutationFunctionType,
 } from "@/types/api";
 import { UseMutationResult } from "@tanstack/react-query";
+import { useNavigate } from "react-router-dom";
 import { api } from "../../api";
 import { getURL } from "../../helpers/constants";
 import { UseRequestProcessor } from "../../services/request-processor";
 
-export const useLogout: useMutationFunctionType = (options?) => {
+export const useLogout: useMutationFunctionType<undefined, void> = (
+  options?,
+) => {
   const { mutate } = UseRequestProcessor();
+  const navigate = useNavigate();
+  const logout = useAuthStore((state) => state.logout);
 
   async function logoutUser(): Promise<any> {
     const autoLogin = useAuthStore.getState().autoLogin;
@@ -21,7 +26,16 @@ export const useLogout: useMutationFunctionType = (options?) => {
     return res.data;
   }
 
-  const mutation = mutate(["useLogout"], logoutUser, options);
+  const mutation = mutate(["useLogout"], logoutUser, {
+    onSuccess: () => {
+      logout();
+      navigate("/login");
+    },
+    onError: (error) => {
+      console.error(error);
+    },
+    ...options,
+  });
 
   return mutation;
 };

src/frontend/src/controllers/API/queries/auth/use-refresh-access.ts

@@ -4,7 +4,9 @@ import { api } from "../../api";
 import { getURL } from "../../helpers/constants";
 import { UseRequestProcessor } from "../../services/request-processor";
 
-export const useRefrshAccessToken: useMutationFunctionType = (options?) => {
+export const useRefreshAccessToken: useMutationFunctionType<undefined, any> = (
+  options?,
+) => {
   const { mutate } = UseRequestProcessor();
 
   async function refreshAccess(): Promise<any> {

src/frontend/src/controllers/API/queries/auth/use-reset-password.ts

@@ -13,9 +13,10 @@ interface resetPasswordParams {
   password: resetPasswordType;
 }
 
-export const useResetPassword: useMutationFunctionType<resetPasswordParams> = (
-  options?,
-) => {
+export const useResetPassword: useMutationFunctionType<
+  undefined,
+  resetPasswordParams
+> = (options?) => {
   const { mutate } = UseRequestProcessor();
 
   async function resetPassword({

src/frontend/src/controllers/API/queries/auth/use-update-user.ts

@@ -9,9 +9,10 @@ interface UpdateUserParams {
   user: changeUser;
 }
 
-export const useUpdateUser: useMutationFunctionType<UpdateUserParams> = (
-  options?,
-) => {
+export const useUpdateUser: useMutationFunctionType<
+  undefined,
+  UpdateUserParams
+> = (options?) => {
   const { mutate } = UseRequestProcessor();
 
   async function updateUser({ user_id, user }: UpdateUserParams): Promise<any> {

src/frontend/src/controllers/API/queries/files/use-get-profile-pictures.ts

@@ -4,15 +4,13 @@ import { api } from "../../api";
 import { getURL } from "../../helpers/constants";
 import { UseRequestProcessor } from "../../services/request-processor";
 
-interface ProfilePicturesQueryParams {}
-
-export interface ProfilePicturesQueryResponse {
+export interface ProfilePicturesQueryResponse extends Record<string, string[]> {
   files: string[];
 }
 
 export const useGetProfilePicturesQuery: useQueryFunctionType<
-  ProfilePicturesQueryParams,
-  { [key: string]: string[] }
+  undefined,
+  ProfilePicturesQueryResponse
 > = () => {
   const { query } = UseRequestProcessor();
 

src/frontend/src/controllers/API/queries/files/use-post-upload-file.ts

@@ -9,9 +9,10 @@ interface IPostUploadFile {
   id: string;
 }
 
-export const usePostUploadFile: useMutationFunctionType<IPostUploadFile> = (
-  options?,
-) => {
+export const usePostUploadFile: useMutationFunctionType<
+  undefined,
+  IPostUploadFile
+> = (options?) => {
   const { mutate } = UseRequestProcessor();
 
   const postUploadFileFn = async (payload: IPostUploadFile): Promise<any> => {

src/frontend/src/controllers/API/queries/messages/use-delete-messages.ts

@@ -9,6 +9,7 @@ interface DeleteMessagesParams {
 }
 
 export const useDeleteMessages: useMutationFunctionType<
+  undefined,
   DeleteMessagesParams
 > = (options?) => {
   const { mutate } = UseRequestProcessor();

src/frontend/src/controllers/API/queries/messages/use-update-messages.ts

@@ -9,9 +9,10 @@ interface UpdateMessageParams {
   message: Message;
 }
 
-export const useUpdateMessage: useMutationFunctionType<UpdateMessageParams> = (
-  options?,
-) => {
+export const useUpdateMessage: useMutationFunctionType<
+  undefined,
+  UpdateMessageParams
+> = (options?) => {
   const { mutate } = UseRequestProcessor();
 
   const updateMessageApi = async (data: Message) => {

src/frontend/src/controllers/API/queries/store/use-post-like-component.ts

@@ -8,6 +8,7 @@ interface IPostLikeComponent {
 }
 
 export const usePostLikeComponent: useMutationFunctionType<
+  undefined,
   IPostLikeComponent
 > = (options) => {
   const { mutate } = UseRequestProcessor();

src/frontend/src/controllers/API/queries/vertex/use-post-retrieve-vertex-order.tsx

@@ -20,6 +20,7 @@ interface retrieveGetVerticesOrderResponse {
 
 // add types for error handling and success
 export const usePostRetrieveVertexOrder: useMutationFunctionType<
+  undefined,
   retrieveGetVerticesOrder,
   retrieveGetVerticesOrderResponse
 > = (options) => {

src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/ProfilePictureForm/components/profilePictureChooserComponent/index.tsx

@@ -1,3 +1,4 @@
+import { ProfilePicturesQueryResponse } from "@/controllers/API/queries/files";
 import { useEffect, useRef, useState } from "react";
 import { Button } from "../../../../../../../../components/ui/button";
 import Loading from "../../../../../../../../components/ui/loading";
@@ -7,7 +8,7 @@ import { cn } from "../../../../../../../../utils/utils";
 import usePreloadImages from "./hooks/use-preload-images";
 
 type ProfilePictureChooserComponentProps = {
-  profilePictures: { [key: string]: string[] } | undefined;
+  profilePictures: ProfilePicturesQueryResponse | undefined;
   loading: boolean;
   value: string;
   onChange: (value: string) => void;

src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/ProfilePictureForm/index.tsx

@@ -1,6 +1,6 @@
-import { useGetProfilePicturesQuery } from "@/controllers/API/queries/files";
+import { ProfilePicturesQueryResponse } from "@/controllers/API/queries/files";
 import * as Form from "@radix-ui/react-form";
-import { useEffect, useState } from "react";
+import { UseQueryResult } from "@tanstack/react-query";
 import { Button } from "../../../../../../components/ui/button";
 import {
   Card,
@@ -17,7 +17,7 @@ type ProfilePictureFormComponentProps = {
   profilePicture: string;
   handleInput: (event: any) => void;
   handlePatchProfilePicture: (gradient: string) => void;
-  handleGetProfilePictures: () => undefined;
+  handleGetProfilePictures: UseQueryResult<ProfilePicturesQueryResponse>;
   userData: any;
 };
 const ProfilePictureFormComponent = ({
@@ -27,7 +27,7 @@ const ProfilePictureFormComponent = ({
   handleGetProfilePictures,
   userData,
 }: ProfilePictureFormComponentProps) => {
-  const { data: response, isFetching } = useGetProfilePicturesQuery({});
+  const { data: response, isFetching } = handleGetProfilePictures;
 
   return (
     <Form.Root

src/frontend/src/pages/SettingsPage/pages/GeneralPage/index.tsx

@@ -53,10 +53,7 @@ export const GeneralPage = () => {
     setErrorData,
   );
 
-  const handleGetProfilePictures = () => {
-    const { data } = useGetProfilePicturesQuery({});
-    return data;
-  };
+  const handleGetProfilePictures = useGetProfilePicturesQuery();
 
   const { handlePatchProfilePicture } = usePatchProfilePicture(
     setSuccessData,

src/frontend/src/types/api/index.ts

@@ -260,9 +260,21 @@ export type MutationFunctionType = (
 ) => UseMutationResult<any, any, any, any>;
 
 export type useMutationFunctionType<
+  Params,
   Variables = any,
   Data = any,
   Error = any,
-> = (
-  options?: Omit<UseMutationOptions<Data, Error>, "mutationFn" | "mutationKey">,
-) => UseMutationResult<Data, Error, Variables>;
+> = Params extends undefined
+  ? (
+      options?: Omit<
+        UseMutationOptions<Data, Error>,
+        "mutationFn" | "mutationKey"
+      >,
+    ) => UseMutationResult<Data, Error, Variables>
+  : (
+      params: Params,
+      options?: Omit<
+        UseMutationOptions<Data, Error>,
+        "mutationFn" | "mutationKey"
+      >,
+    ) => UseMutationResult<Data, Error, Variables>;