Refactor: 훅 리팩토링

This commit is contained in:
정현조 2024-09-18 16:56:08 +09:00
parent 6ace8aea3b
commit 0c84f4f020
3 changed files with 133 additions and 20 deletions

View File

@ -1,9 +1,8 @@
import { useMutation, useQueryClient } from '@tanstack/react-query'; import { useMutation, useQueryClient } from '@tanstack/react-query';
import { AxiosError } from 'axios';
import useAuthStore from '@/stores/useAuthStore'; import useAuthStore from '@/stores/useAuthStore';
import { reissueToken, getProfile } from '@/api/authApi'; import { reissueToken } from '@/api/authApi';
import { CustomError } from '@/types'; import { useEffect } from 'react';
import { useState, useEffect } from 'react';
import useProfileQuery from '@/queries/useProfileQuery'; import useProfileQuery from '@/queries/useProfileQuery';
export const useReissueToken = () => { export const useReissueToken = () => {
@ -32,20 +31,9 @@ export const useProfile = () => {
}; };
export const useFetchProfile = () => { export const useFetchProfile = () => {
const { profile, setProfile } = useAuthStore(); const { setProfile } = useAuthStore();
const [isFetched, setIsFetched] = useState(false); const query = useProfileQuery();
if (query.data) {
useEffect(() => { setProfile(query.data);
if (!profile && !isFetched) {
getProfile()
.then((data) => {
setProfile(data);
setIsFetched(true);
})
.catch((error: AxiosError<CustomError>) => {
alert('프로필을 가져오는 중 오류가 발생했습니다. 다시 시도해주세요.');
console.error('프로필 가져오기 실패:', error?.response?.data?.message || '알 수 없는 오류');
});
} }
}, [profile, setProfile, isFetched]);
}; };

View File

@ -112,3 +112,62 @@
// }, // },
// }); // });
// }; // };
import { useMutation, useQueryClient } from '@tanstack/react-query';
import { createProject, updateProject, deleteProject, addProjectMember, removeProjectMember } from '@/api/projectApi';
import { ProjectResponse, ProjectRequest, ProjectMemberRequest } from '@/types';
export const useCreateProject = () => {
const queryClient = useQueryClient();
return useMutation<ProjectResponse, Error, { workspaceId: number; memberId: number; data: ProjectRequest }>({
mutationFn: ({ workspaceId, memberId, data }) => createProject(workspaceId, memberId, data),
onSuccess: (_, variables) => {
queryClient.invalidateQueries({ queryKey: ['projects', variables.workspaceId] });
},
});
};
export const useUpdateProject = () => {
const queryClient = useQueryClient();
return useMutation<ProjectResponse, Error, { projectId: number; memberId: number; data: ProjectRequest }>({
mutationFn: ({ projectId, memberId, data }) => updateProject(projectId, memberId, data),
onSuccess: (data) => {
queryClient.invalidateQueries({ queryKey: ['project', data.id] });
},
});
};
export const useDeleteProject = () => {
const queryClient = useQueryClient();
return useMutation<void, Error, { projectId: number; memberId: number }>({
mutationFn: ({ projectId, memberId }) => deleteProject(projectId, memberId),
onSuccess: (_, variables) => {
queryClient.invalidateQueries({ queryKey: ['projects', variables.projectId] });
},
});
};
export const useAddProjectMember = () => {
const queryClient = useQueryClient();
return useMutation<void, Error, { projectId: number; memberId: number; data: ProjectMemberRequest }>({
mutationFn: ({ projectId, memberId, data }) =>
addProjectMember(projectId, memberId, data.memberId, data.privilegeType),
onSuccess: (_, variables) => {
queryClient.invalidateQueries({ queryKey: ['project', variables.projectId] });
},
});
};
export const useRemoveProjectMember = () => {
const queryClient = useQueryClient();
return useMutation<void, Error, { projectId: number; memberId: number; targetMemberId: number }>({
mutationFn: ({ projectId, memberId, targetMemberId }) => removeProjectMember(projectId, memberId, targetMemberId),
onSuccess: (_, variables) => {
queryClient.invalidateQueries({ queryKey: ['project', variables.projectId] });
},
});
};

View File

@ -87,3 +87,69 @@
// }, // },
// }); // });
// }; // };
import { useMutation, useQueryClient } from '@tanstack/react-query';
import {
createWorkspace,
updateWorkspace,
deleteWorkspace,
addWorkspaceMember,
removeWorkspaceMember,
} from '@/api/workspaceApi';
import { WorkspaceResponse, WorkspaceRequest } from '@/types';
export const useCreateWorkspace = () => {
const queryClient = useQueryClient();
return useMutation<WorkspaceResponse, Error, { memberId: number; data: WorkspaceRequest }>({
mutationFn: ({ memberId, data }) => createWorkspace(memberId, data),
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: ['workspaceList'] });
},
});
};
export const useUpdateWorkspace = () => {
const queryClient = useQueryClient();
return useMutation<WorkspaceResponse, Error, { workspaceId: number; memberId: number; data: WorkspaceRequest }>({
mutationFn: ({ workspaceId, memberId, data }) => updateWorkspace(workspaceId, memberId, data),
onSuccess: (_, variables) => {
queryClient.invalidateQueries({ queryKey: ['workspace', variables.workspaceId] });
},
});
};
export const useDeleteWorkspace = () => {
const queryClient = useQueryClient();
return useMutation<void, Error, { workspaceId: number; memberId: number }>({
mutationFn: ({ workspaceId, memberId }) => deleteWorkspace(workspaceId, memberId),
onSuccess: (_, variables) => {
queryClient.invalidateQueries({ queryKey: ['workspace', variables.workspaceId] });
},
});
};
export const useAddWorkspaceMember = () => {
const queryClient = useQueryClient();
return useMutation<void, Error, { workspaceId: number; memberId: number; newMemberId: number }>({
mutationFn: ({ workspaceId, memberId, newMemberId }) => addWorkspaceMember(workspaceId, memberId, newMemberId),
onSuccess: (_, variables) => {
queryClient.invalidateQueries({ queryKey: ['workspace', variables.workspaceId] });
},
});
};
export const useRemoveWorkspaceMember = () => {
const queryClient = useQueryClient();
return useMutation<void, Error, { workspaceId: number; memberId: number; targetMemberId: number }>({
mutationFn: ({ workspaceId, memberId, targetMemberId }) =>
removeWorkspaceMember(workspaceId, memberId, targetMemberId),
onSuccess: (_, variables) => {
queryClient.invalidateQueries({ queryKey: ['workspace', variables.workspaceId] });
},
});
};