feat: home mocking api 생성 및 함수 작성 (#249)

src/mocks/handlers.ts

@@ -1,5 +1,5 @@
 import { commonResolvers } from './common/common.resolvers';
-import { homeResolvers } from './home/resolvers/homeResolvers';
+import { homeResolvers } from './home/home.resolvers';
 import { onboardingResolvers } from './onboarding/onboarding.resolvers';
 
 export const handlers = [...homeResolvers, ...onboardingResolvers, ...commonResolvers];

src/mocks/home/resolvers/homeResolvers.ts → src/mocks/home/home.resolvers.ts

@@ -1,13 +1,14 @@
 import { HttpResponse, http } from 'msw';
 
-import { HOME_RES } from '../responses/homeResponses';
+import { HOME_RES } from '../home/home.responses';
 
 export const HOME_MOCK_URL = {
 	GET_CATEGORY: 'api/v2/home',
 	GET_WORK_TIME: 'api/v2/timer',
 	POST_TIMER_START: 'api/v2/timer/start',
 	POST_CREATE_TASK: '/api/v2/tasks/:categoryId',
 	POST_TOGGLE_TASK_STATUS: 'api/v2/tasks/:taskId/status',
+	DELETE_CATEGORY: 'api/v2/categories/:categoryId',
 };
 
 // LINK: https://mswjs.io/docs/best-practices/typescript/#request-handlers
@@ -26,8 +27,9 @@ export const homeResolvers = [
 		return HttpResponse.json(HOME_RES.GET_CATEGORY);
 	}),
 
-	http.get(HOME_MOCK_URL.GET_WORK_TIME, async ({ params }) => {
-		const { targetDate } = params;
+	http.get(HOME_MOCK_URL.GET_WORK_TIME, async ({ request }) => {
+		const url = new URL(request.url);
+		const targetDate = url.searchParams.get('targetDate');
 
 		if (!targetDate) {
 			throw new HttpResponse(null, { status: 400 });
@@ -42,7 +44,7 @@ export const homeResolvers = [
 
 		const { taskList } = await request.json();
 
-		if (!targetDate || !taskList) {
+		if (!targetDate || taskList.length === 0) {
 			throw new HttpResponse(null, { status: 400 });
 		}
 
@@ -72,4 +74,14 @@ export const homeResolvers = [
 
 		return HttpResponse.json(HOME_RES.POST_TOGGLE_TASK_STATUS);
 	}),
+
+	http.post<{ categoryId: string }>(HOME_MOCK_URL.DELETE_CATEGORY, async ({ params }) => {
+		const { categoryId } = params;
+
+		if (!categoryId) {
+			throw new HttpResponse(null, { status: 400 });
+		}
+
+		return HttpResponse.json(HOME_RES.DELETE_CATEGORY);
+	}),
 ];

src/mocks/home/responses/homeResponses.ts → src/mocks/home/home.responses.ts

@@ -244,4 +244,8 @@ export const HOME_RES = {
 		status: 200,
 		message: '요청이 성공했습니다.',
 	},
+	DELETE_CATEGORY: {
+		status: 200,
+		message: '요청이 성공했습니다.',
+	},
 };

src/shared/apisV2/home/home.api.ts

@@ -0,0 +1,53 @@
+import axios from 'axios';
+
+import {
+	DeleteCategoryReq,
+	GetCategoryTaskReq,
+	GetCategoryTaskRes,
+	GetWorkTimeReq,
+	GetWorkTimeRes,
+	PostCreateTaskReq,
+	PostToggleTaskStatusReq,
+	postAddTodayTodosReq,
+} from '@/shared/types/api/home';
+
+import { HOME_MOCK_URL } from '@/mocks/home/home.resolvers';
+
+export const getCategoryTask = async ({ startDate, endDate }: GetCategoryTaskReq): Promise<GetCategoryTaskRes> => {
+	const { data } = await axios.get(HOME_MOCK_URL.GET_CATEGORY, {
+		params: { startDate, endDate },
+	});
+	return data;
+};
+
+export const getWorkTime = async ({ targetDate }: GetWorkTimeReq): Promise<GetWorkTimeRes> => {
+	const { data } = await axios.get(HOME_MOCK_URL.GET_WORK_TIME, {
+		params: { targetDate },
+	});
+	return data;
+};
+
+export const postAddTodayTodos = async ({ targetDate, taskList }: postAddTodayTodosReq) => {
+	const { data } = await axios.post(HOME_MOCK_URL.POST_TIMER_START, { taskList }, { params: { targetDate } });
+	return data;
+};
+
+export const postCreateTask = async ({ categoryId, name, startDate, endDate }: PostCreateTaskReq) => {
+	const { data } = await axios.post(
+		HOME_MOCK_URL.POST_CREATE_TASK.replace(':categoryId', String(categoryId)),
+		{ name },
+		{ params: { startDate, endDate } },
+	);
+
+	return data;
+};
+
+export const postToggleTaskStatus = async ({ taskId }: PostToggleTaskStatusReq) => {
+	const { data } = await axios.post(HOME_MOCK_URL.POST_TOGGLE_TASK_STATUS.replace(':taskId', String(taskId)));
+	return data;
+};
+
+export const deleteCategory = async ({ categoryId }: DeleteCategoryReq) => {
+	const { data } = await axios.delete(HOME_MOCK_URL.DELETE_CATEGORY.replace(':categoryId', String(categoryId)));
+	return data;
+};

src/shared/apisV2/home/home.keys.ts

@@ -0,0 +1,7 @@
+import { GetCategoryTaskReq, GetWorkTimeReq } from '@/shared/types/api/home';
+
+export const homeKeys = {
+	task: ['task'] as const,
+	categoryTask: ({ startDate, endDate }: GetCategoryTaskReq) => [...homeKeys.task, startDate, endDate] as const,
+	workTime: ({ targetDate }: GetWorkTimeReq) => ['workTime', targetDate] as const,
+};

src/shared/apisV2/home/home.mutations.ts

@@ -0,0 +1,38 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+
+import { deleteCategory, postAddTodayTodos, postCreateTask, postToggleTaskStatus } from './home.api';
+import { homeKeys } from './home.keys';
+
+export const usePostAddTodayTodos = () => {
+	return useMutation({
+		mutationFn: postAddTodayTodos,
+	});
+};
+
+export const usePostCreateTask = () => {
+	const queryClient = useQueryClient();
+
+	return useMutation({
+		mutationFn: postCreateTask,
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: homeKeys.task });
+		},
+	});
+};
+
+export const usePostToggleTaskStatus = () => {
+	const queryClient = useQueryClient();
+
+	return useMutation({
+		mutationFn: postToggleTaskStatus,
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: homeKeys.task });
+		},
+	});
+};
+
+export const useDeleteCategory = () => {
+	return useMutation({
+		mutationFn: deleteCategory,
+	});
+};

src/shared/apisV2/home/home.queries.ts

@@ -0,0 +1,20 @@
+import { useQuery } from '@tanstack/react-query';
+
+import type { GetCategoryTaskReq, GetWorkTimeReq } from '@/shared/types/api/home';
+
+import { getCategoryTask, getWorkTime } from './home.api';
+import { homeKeys } from './home.keys';
+
+export const useGetCategoryTask = ({ startDate, endDate }: GetCategoryTaskReq) => {
+	return useQuery({
+		queryKey: homeKeys.categoryTask({ startDate, endDate }),
+		queryFn: () => getCategoryTask({ startDate, endDate }),
+	});
+};
+
+export const useGetWorkTime = ({ targetDate }: GetWorkTimeReq) => {
+	return useQuery({
+		queryKey: homeKeys.workTime({ targetDate }),
+		queryFn: () => getWorkTime({ targetDate }),
+	});
+};