...
;
+}
+```
+
+### `'use client'` 사용 기준
+
+```
+✅ 추가해야 하는 경우:
+ - onClick, onChange 등 이벤트 핸들러 사용
+ - useState, useEffect, useRef 등 React 훅 사용
+ - 브라우저 API (window, document, localStorage) 접근
+
+❌ 추가하면 안 되는 경우:
+ - 데이터만 fetch해서 렌더링하는 서버 컴포넌트
+ - props를 받아 정적으로 렌더링하는 순수 컴포넌트
+```
+
+### index.ts (Public API)
+
+각 slice/segment는 `index.ts`로 public interface를 명시한다.
+
+```ts
+// features/create-todo/index.ts
+export { CreateTodoForm } from "./ui/CreateTodoForm";
+export { useCreateTodo } from "./hooks/useCreateTodo";
+```
+
+외부에서는 내부 경로 직접 import 금지:
+
+```ts
+// ❌
+import { CreateTodoForm } from "@/features/create-todo/ui/CreateTodoForm";
+
+// ✅
+import { CreateTodoForm } from "@/features/create-todo";
+```
+
+---
+
+## Styling (Tailwind CSS v4)
+
+### Design Token 사용
+
+`src/app/globals.css`의 `@theme` 토큰을 항상 사용한다.
+
+```tsx
+// ❌ arbitrary value 금지
++ +// ✅ 정의된 토큰 사용 +
+``` + +### Typography + +`typography-{scale}` utility class 사용: + +```tsx +
제목
+본문
+캡션 +``` + +| 클래스 | 크기 | 용도 | +| ---------------------- | ---- | ----------- | +| `typography-display-1` | 56px | 최대 타이틀 | +| `typography-title-2` | 28px | 섹션 타이틀 | +| `typography-heading-2` | 20px | 카드 헤딩 | +| `typography-body-1` | 18px | 주요 본문 | +| `typography-body-2` | 16px | 일반 본문 | +| `typography-label-1` | 14px | 라벨, 버튼 | +| `typography-caption-1` | 12px | 부가 정보 | + +### Color Tokens + +```tsx +// 텍스트 +text - label - normal; // 기본 텍스트 (#111827) +text - label - alternative; // 보조 텍스트 (40% opacity) +text - inverse - normal; // 반전 텍스트 (#ffffff) + +// 배경 +bg - background - normal; +bg - background - normal - alternative; +bg - background - elevated - normal; + +// 브랜드 +bg - blue - 800; // Primary (#6c63ff) +bg - green - 800; // Secondary (#2ec4b6) +``` + +### Scrollable Container + +```tsx +...
+```
+
+---
+
+## Zod Schema
+
+```ts
+// camelCase + Schema suffix
+const emailSchema = z.string().email();
+
+const createTodoSchema = z.object({
+ title: z.string().min(1).max(100),
+ dueDate: z.string().optional(),
+});
+
+// 타입 추출
+type CreateTodoInput = z.infer
-
);
}
diff --git a/src/widgets/goal/Summary/GoalInfo/GoalInfoError.test.tsx b/src/widgets/goal/Summary/GoalInfo/GoalInfoError.test.tsx
new file mode 100644
index 00000000..2018d775
--- /dev/null
+++ b/src/widgets/goal/Summary/GoalInfo/GoalInfoError.test.tsx
@@ -0,0 +1,38 @@
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+
+import GoalInfoError from "./GoalInfoError";
+
+describe("GoalInfoError", () => {
+ test("에러 메시지를 렌더링한다", () => {
+ const error = new Error("목표 정보를 불러오지 못했습니다.");
+
+ render(
+
- ({
+ apiClient: {
+ get: jest.fn(),
+ post: jest.fn(),
+ patch: jest.fn(),
+ delete: jest.fn(),
+ },
+}));
+
+const mockApiClient = apiClient as jest.Mocked;
+
+const makeResponse = (data: T) => ({
+ success: true,
+ code: "OK",
+ message: "success",
+ data,
+ timestamp: "2026-01-01T00:00:00Z",
+});
+
+beforeEach(() => {
+ jest.clearAllMocks();
+});
+
+describe("goalApi", () => {
+ describe("createGoal", () => {
+ test("POST /api/goals를 호출한다", async () => {
+ mockApiClient.post.mockResolvedValue(makeResponse({ success: true }));
+
+ await goalApi.createGoal({
+ name: "목표",
+ dueDate: "2026-12-31",
+ type: "PERSONAL",
+ });
+
+ expect(mockApiClient.post).toHaveBeenCalledWith(
+ "/api/goals",
+ expect.objectContaining({ name: "목표", dueDate: "2026-12-31" }),
+ );
+ });
+ });
+
+ describe("getPersonalGoalList", () => {
+ test("GET /api/goals/personal을 호출하고 data를 반환한다", async () => {
+ const mockData = [{ goalId: 1, goalName: "알고리즘 풀기" }];
+ mockApiClient.get.mockResolvedValue(makeResponse(mockData));
+
+ const result = await goalApi.getPersonalGoalList();
+
+ expect(mockApiClient.get).toHaveBeenCalledWith("/api/goals/personal");
+ expect(result.data).toEqual(mockData);
+ });
+ });
+
+ describe("getTeamGoalList", () => {
+ test("cursor 없이 sort만 파라미터로 전달한다", async () => {
+ mockApiClient.get.mockResolvedValue(
+ makeResponse({ items: [], nextCursor: null, size: 6 }),
+ );
+
+ await goalApi.getTeamGoalList("42", "LATEST");
+
+ expect(mockApiClient.get).toHaveBeenCalledWith("/api/teams/42/goals", {
+ params: { sort: "LATEST" },
+ });
+ });
+
+ test("cursorCreatedAt와 cursorId가 모두 있으면 파라미터에 포함한다", async () => {
+ mockApiClient.get.mockResolvedValue(
+ makeResponse({ items: [], nextCursor: null, size: 6 }),
+ );
+
+ await goalApi.getTeamGoalList("42", "OLDEST", {
+ cursorCreatedAt: "2026-03-31T09:00:00Z",
+ cursorId: 120,
+ });
+
+ expect(mockApiClient.get).toHaveBeenCalledWith("/api/teams/42/goals", {
+ params: {
+ sort: "OLDEST",
+ cursorCreatedAt: "2026-03-31T09:00:00Z",
+ cursorId: 120,
+ },
+ });
+ });
+
+ test("cursorCreatedAt만 있고 cursorId가 없으면 cursor 파라미터를 포함하지 않는다", async () => {
+ mockApiClient.get.mockResolvedValue(
+ makeResponse({ items: [], nextCursor: null, size: 6 }),
+ );
+
+ await goalApi.getTeamGoalList("42", "LATEST", {
+ cursorCreatedAt: "2026-03-31T09:00:00Z",
+ });
+
+ expect(mockApiClient.get).toHaveBeenCalledWith("/api/teams/42/goals", {
+ params: { sort: "LATEST" },
+ });
+ });
+
+ test("cursorId만 있고 cursorCreatedAt가 없으면 cursor 파라미터를 포함하지 않는다", async () => {
+ mockApiClient.get.mockResolvedValue(
+ makeResponse({ items: [], nextCursor: null, size: 6 }),
+ );
+
+ await goalApi.getTeamGoalList("42", "LATEST", { cursorId: 120 });
+
+ expect(mockApiClient.get).toHaveBeenCalledWith("/api/teams/42/goals", {
+ params: { sort: "LATEST" },
+ });
+ });
+ });
+
+ describe("toggleFavorite", () => {
+ test("POST /api/goals/:goalId/favorite를 호출한다", async () => {
+ mockApiClient.post.mockResolvedValue(makeResponse({ success: true }));
+
+ const result = await goalApi.toggleFavorite("99");
+
+ expect(mockApiClient.post).toHaveBeenCalledWith("/api/goals/99/favorite");
+ expect(result.data).toEqual({ success: true });
+ });
+ });
+
+ describe("getSummary", () => {
+ test("GET /api/goals/:goalId/summary를 호출하고 data를 반환한다", async () => {
+ const summaryData = {
+ goalId: 1,
+ goalName: "디자인 시스템",
+ dueDate: "2026-12-31",
+ dDay: 42,
+ progressPercent: 68,
+ };
+ mockApiClient.get.mockResolvedValue(makeResponse(summaryData));
+
+ const result = await goalApi.getSummary("1");
+
+ expect(mockApiClient.get).toHaveBeenCalledWith("/api/goals/1/summary");
+ expect(result.data).toEqual(summaryData);
+ });
+ });
+
+ describe("deleteGoal", () => {
+ test("DELETE /api/goals/:goalId를 호출한다", async () => {
+ mockApiClient.delete.mockResolvedValue(makeResponse(null));
+
+ await goalApi.deleteGoal("10");
+
+ expect(mockApiClient.delete).toHaveBeenCalledWith("/api/goals/10");
+ });
+ });
+
+ describe("updateGoal", () => {
+ test("PATCH /api/goals/:goalId를 body와 함께 호출한다", async () => {
+ mockApiClient.patch.mockResolvedValue(
+ makeResponse({ id: 10, name: "수정된 목표", dueDate: "2026-06-30" }),
+ );
+
+ await goalApi.updateGoal("10", {
+ name: "수정된 목표",
+ dueDate: "2026-06-30",
+ });
+
+ expect(mockApiClient.patch).toHaveBeenCalledWith("/api/goals/10", {
+ name: "수정된 목표",
+ dueDate: "2026-06-30",
+ });
+ });
+ });
+
+ describe("getFavoriteGoalList", () => {
+ test("params 없이 호출하면 빈 params로 요청한다", async () => {
+ mockApiClient.get.mockResolvedValue(
+ makeResponse({ items: [], hasNext: false }),
+ );
+
+ await goalApi.getFavoriteGoalList();
+
+ expect(mockApiClient.get).toHaveBeenCalledWith(
+ "/api/main/favorite-goals",
+ { params: {} },
+ );
+ });
+
+ test("cursor params를 전달하면 함께 요청한다", async () => {
+ mockApiClient.get.mockResolvedValue(
+ makeResponse({ items: [], hasNext: false }),
+ );
+
+ await goalApi.getFavoriteGoalList({
+ cursorId: 5,
+ cursorCreatedAt: "2026-03-31T09:00:00Z",
+ size: 20,
+ });
+
+ expect(mockApiClient.get).toHaveBeenCalledWith(
+ "/api/main/favorite-goals",
+ {
+ params: {
+ cursorId: 5,
+ cursorCreatedAt: "2026-03-31T09:00:00Z",
+ size: 20,
+ },
+ },
+ );
+ });
+ });
+});
diff --git a/src/entities/goal/api/api.ts b/src/entities/goal/api/api.ts
index 3de1eb3b..574c695b 100644
--- a/src/entities/goal/api/api.ts
+++ b/src/entities/goal/api/api.ts
@@ -1,88 +1,73 @@
import { apiClient } from "@/shared/lib/api/client";
+import { ApiResponse } from "@/shared/lib/api/types";
+import type {
+ FavoriteGoalsQueryParams,
+ FavoriteGoalsSuccessResponse,
+} from "../types/favorite.types";
import type {
CreateGoalResponse,
- CreatePersonalGoalInput,
- CreateTeamGoalInput,
- GoalListCursor,
+ CreatePersonalGoalRequest,
+ CreateTeamGoalRequest,
+ DeleteGoalResponse,
GoalSummaryResponse,
+ ToggleGoalFavoriteResponse,
+ UpdateGoalRequest,
+ UpdateGoalResponse,
+} from "../types/goal.types";
+import type {
+ GoalListCursor,
PersonalGoalListResponse,
SortType,
TeamGoalListResponse,
-} from "../types/types";
+} from "../types/goalList.types";
export const goalApi = {
- createPersonalGoal: (data: CreatePersonalGoalInput) =>
- apiClient.post("/api/goals", data),
-
- createTeamGoal: (data: CreateTeamGoalInput) =>
- apiClient.post("/api/goals", data),
+ createGoal: (data: CreatePersonalGoalRequest | CreateTeamGoalRequest) =>
+ apiClient.post>("/api/goals", data),
getPersonalGoalList: () =>
- apiClient.get("/api/goals/personal"),
+ apiClient.get>("/api/goals/personal"),
getTeamGoalList: (
teamId: string,
sort: SortType,
cursor?: Partial,
) => {
- if (
- cursor &&
- ((cursor.cursorCreatedAt && cursor.cursorId == null) ||
- (!cursor.cursorCreatedAt && cursor.cursorId != null))
- ) {
- throw new Error(
- "cursorCreatedAt와 cursorId는 다음 페이지 요청 시 함께 전달해야 합니다.",
- );
- }
-
const params: Record = { sort };
if (cursor?.cursorCreatedAt && cursor.cursorId != null) {
params.cursorCreatedAt = cursor.cursorCreatedAt;
params.cursorId = cursor.cursorId;
}
- return apiClient.get(`/api/teams/${teamId}/goals`, {
- params,
- });
+ return apiClient.get>(
+ `/api/teams/${teamId}/goals`,
+ { params },
+ );
},
- toggleFavorite: async (goalId: number) => {
- const result = await apiClient.post<{ success: boolean }>(
+ toggleFavorite: (goalId: string) =>
+ apiClient.post>(
`/api/goals/${goalId}/favorite`,
- );
-
- if (typeof window !== "undefined") {
- window.dispatchEvent(
- new CustomEvent("goal-favorite-toggled", { detail: { goalId } }),
- );
- }
-
- return result;
- },
+ ),
getSummary: (goalId: string) =>
- apiClient.get(`/api/goals/${goalId}/summary`),
+ apiClient.get>(
+ `/api/goals/${goalId}/summary`,
+ ),
deleteGoal: (goalId: string) =>
- apiClient.delete<{
- success: boolean;
- code: string;
- message: string;
- data: null;
- timestamp: string;
- }>(`/api/goals/${goalId}`),
+ apiClient.delete>(`/api/goals/${goalId}`),
+
+ updateGoal: (goalId: string, body: UpdateGoalRequest) =>
+ apiClient.patch>(
+ `/api/goals/${goalId}`,
+ body,
+ ),
- updateGoal: (goalId: string, body: { name: string; dueDate: string }) =>
- apiClient.patch<{
- success: boolean;
- code: string;
- message: string;
- data: {
- id: number;
- name: string;
- dueDate: string;
- };
- timestamp: string;
- }>(`/api/goals/${goalId}`, body),
+ getFavoriteGoalList: (params: FavoriteGoalsQueryParams = {}) =>
+ apiClient.get>(
+ "/api/main/favorite-goals",
+ { params },
+ ),
};
diff --git a/src/entities/goal/api/goal.api.ts b/src/entities/goal/api/goal.api.ts
deleted file mode 100644
index dfccf434..00000000
--- a/src/entities/goal/api/goal.api.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import { apiClient } from "@/shared/lib/api/client";
-
-import { FavoriteGoalsSuccessResponse } from "../types/favorite.types";
-import { FavoriteGoalsQueryParams } from "../types/favorite.types";
-
-export const favoriteGoalsApi = {
- read: (params: FavoriteGoalsQueryParams = {}) =>
- apiClient.get("/api/main/favorite-goals", {
- params,
- }),
-};
diff --git a/src/entities/goal/index.ts b/src/entities/goal/index.ts
new file mode 100644
index 00000000..81d4680c
--- /dev/null
+++ b/src/entities/goal/index.ts
@@ -0,0 +1,26 @@
+export { goalApi } from "./api/api";
+export type { CreateGoalInput } from "./model/goal.model";
+export { createGoalSchema } from "./model/goal.model";
+export { goalQueryOptions } from "./query/goal.queryOptions";
+export type {
+ FavoriteGoalItem,
+ FavoriteGoalsQueryParams,
+ FavoriteGoalsSuccessResponse,
+} from "./types/favorite.types";
+export type {
+ CreateGoalResponse,
+ CreatePersonalGoalRequest,
+ CreateTeamGoalRequest,
+ DeleteGoalResponse,
+ GoalSummaryResponse,
+ ToggleGoalFavoriteResponse,
+ UpdateGoalRequest,
+ UpdateGoalResponse,
+} from "./types/goal.types";
+export type {
+ GoalListCursor,
+ PersonalGoalListResponse,
+ SortType,
+ TeamGoalListItem,
+ TeamGoalListResponse,
+} from "./types/goalList.types";
diff --git a/src/entities/goal/model/goal.model.test.ts b/src/entities/goal/model/goal.model.test.ts
new file mode 100644
index 00000000..a5c7ed32
--- /dev/null
+++ b/src/entities/goal/model/goal.model.test.ts
@@ -0,0 +1,111 @@
+import { createGoalSchema } from "./goal.model";
+
+describe("createGoalSchema", () => {
+ describe("name 필드", () => {
+ test("유효한 이름은 통과한다", () => {
+ const result = createGoalSchema.safeParse({
+ name: "알고리즘 학습",
+ dueDate: "2026-12-31",
+ });
+ expect(result.success).toBe(true);
+ });
+
+ test("빈 문자열이면 실패하고 에러 메시지를 반환한다", () => {
+ const result = createGoalSchema.safeParse({
+ name: "",
+ dueDate: "2026-12-31",
+ });
+ expect(result.success).toBe(false);
+ if (!result.success) {
+ expect(result.error.issues[0].message).toBe(
+ "목표 이름을 입력해주세요.",
+ );
+ }
+ });
+
+ test("공백만 있으면 trim 처리 후 실패한다", () => {
+ const result = createGoalSchema.safeParse({
+ name: " ",
+ dueDate: "2026-12-31",
+ });
+ expect(result.success).toBe(false);
+ });
+
+ test("30자 이름은 통과한다 (최대 경계값)", () => {
+ const result = createGoalSchema.safeParse({
+ name: "가".repeat(30),
+ dueDate: "2026-12-31",
+ });
+ expect(result.success).toBe(true);
+ });
+
+ test("31자 이름은 실패하고 에러 메시지를 반환한다", () => {
+ const result = createGoalSchema.safeParse({
+ name: "가".repeat(31),
+ dueDate: "2026-12-31",
+ });
+ expect(result.success).toBe(false);
+ if (!result.success) {
+ expect(result.error.issues[0].message).toBe(
+ "목표 이름은 30자 이내로 입력해주세요.",
+ );
+ }
+ });
+
+ test("앞뒤 공백을 제거한 뒤 유효하면 통과한다", () => {
+ const result = createGoalSchema.safeParse({
+ name: " 목표 ",
+ dueDate: "2026-12-31",
+ });
+ expect(result.success).toBe(true);
+ if (result.success) {
+ expect(result.data.name).toBe("목표");
+ }
+ });
+ });
+
+ describe("dueDate 필드", () => {
+ test("날짜 문자열이 있으면 통과한다", () => {
+ const result = createGoalSchema.safeParse({
+ name: "목표",
+ dueDate: "2026-12-31",
+ });
+ expect(result.success).toBe(true);
+ });
+
+ test("빈 문자열이면 실패하고 에러 메시지를 반환한다", () => {
+ const result = createGoalSchema.safeParse({
+ name: "목표",
+ dueDate: "",
+ });
+ expect(result.success).toBe(false);
+ if (!result.success) {
+ expect(result.error.issues[0].message).toBe("날짜를 선택해주세요.");
+ }
+ });
+ });
+
+ describe("전체 유효성 검사", () => {
+ test("name과 dueDate가 모두 유효하면 통과한다", () => {
+ const result = createGoalSchema.safeParse({
+ name: "React 학습",
+ dueDate: "2026-06-30",
+ });
+ expect(result.success).toBe(true);
+ if (result.success) {
+ expect(result.data).toEqual({
+ name: "React 학습",
+ dueDate: "2026-06-30",
+ });
+ }
+ });
+
+ test("name과 dueDate가 모두 없으면 두 가지 에러를 반환한다", () => {
+ const result = createGoalSchema.safeParse({ name: "", dueDate: "" });
+ expect(result.success).toBe(false);
+ if (!result.success) {
+ expect(result.error.issues).toHaveLength(2);
+ }
+ });
+ });
+});
diff --git a/src/entities/goal/model/goal.model.ts b/src/entities/goal/model/goal.model.ts
new file mode 100644
index 00000000..0df7292c
--- /dev/null
+++ b/src/entities/goal/model/goal.model.ts
@@ -0,0 +1,12 @@
+import z from "zod";
+
+export const createGoalSchema = z.object({
+ name: z
+ .string()
+ .trim()
+ .min(1, "목표 이름을 입력해주세요.")
+ .max(30, "목표 이름은 30자 이내로 입력해주세요."),
+ dueDate: z.string().min(1, "날짜를 선택해주세요."),
+});
+
+export type CreateGoalInput = z.infer;
diff --git a/src/entities/goal/query/goal.queryKey.ts b/src/entities/goal/query/goal.queryOptions.ts
similarity index 59%
rename from src/entities/goal/query/goal.queryKey.ts
rename to src/entities/goal/query/goal.queryOptions.ts
index fd077806..29c32448 100644
--- a/src/entities/goal/query/goal.queryKey.ts
+++ b/src/entities/goal/query/goal.queryOptions.ts
@@ -1,10 +1,14 @@
import { infiniteQueryOptions, queryOptions } from "@tanstack/react-query";
-import { goalApi } from "@/entities/goal/api/api";
-import { GoalListCursor, SortType } from "@/entities/goal/types/types";
import { STALE_TIME } from "@/shared/constants/query/staleTime";
-export const goalQueries = {
+import { goalApi } from "../api/api";
+import type { FavoriteGoalsQueryParams } from "../types/favorite.types";
+import type { GoalListCursor, SortType } from "../types/goalList.types";
+
+const FAVORITE_GOALS_PAGE_SIZE = 20;
+
+export const goalQueryOptions = {
getPersonalGoalList: () =>
queryOptions({
queryKey: ["personal", "goals"],
@@ -15,16 +19,6 @@ export const goalQueries = {
staleTime: STALE_TIME.DEFAULT,
}),
- getTeamGoalList: (teamId: string, sort: SortType = "LATEST") =>
- queryOptions({
- queryKey: ["team", teamId, "goals", sort],
- queryFn: async () => {
- const response = await goalApi.getTeamGoalList(teamId, sort);
- return response.data;
- },
- staleTime: STALE_TIME.DEFAULT,
- }),
-
getTeamGoalListInfinite: (teamId: string, sort: SortType = "LATEST") =>
infiniteQueryOptions({
queryKey: ["team", teamId, "goals", "infinite", sort],
@@ -50,4 +44,25 @@ export const goalQueries = {
},
staleTime: STALE_TIME.DEFAULT,
}),
+
+ getFavoriteGoalListInfinite: () =>
+ infiniteQueryOptions({
+ queryKey: ["favoriteGoals", "infinite"],
+ queryFn: async ({ pageParam }) => {
+ const response = await goalApi.getFavoriteGoalList(pageParam ?? {});
+ return response.data;
+ },
+ initialPageParam: {
+ size: FAVORITE_GOALS_PAGE_SIZE,
+ } as FavoriteGoalsQueryParams,
+ getNextPageParam: (lastPage): FavoriteGoalsQueryParams | undefined =>
+ lastPage.hasNext
+ ? {
+ size: FAVORITE_GOALS_PAGE_SIZE,
+ cursorId: lastPage.nextCursorId,
+ cursorCreatedAt: lastPage.nextCursorCreatedAt,
+ }
+ : undefined,
+ staleTime: STALE_TIME.DEFAULT,
+ }),
};
diff --git a/src/entities/goal/types/favorite.types.ts b/src/entities/goal/types/favorite.types.ts
index 78b08671..9a4f5fb9 100644
--- a/src/entities/goal/types/favorite.types.ts
+++ b/src/entities/goal/types/favorite.types.ts
@@ -1,13 +1,9 @@
-// favoriteGoalsApi - GET / query params
-
export type FavoriteGoalsQueryParams = {
cursorId?: number;
cursorCreatedAt?: string;
size?: number;
};
-// FavoriteGoalItem
-
export interface FavoriteGoalItem {
teamId: number;
teamName: string;
@@ -18,46 +14,9 @@ export interface FavoriteGoalItem {
createdAt: string;
}
-// FavoriteGoalsSuccessResponse
-
export interface FavoriteGoalsSuccessResponse {
- success: true;
- code: string;
- message: string;
- data: {
- items: FavoriteGoalItem[];
- hasNext: boolean;
- nextCursorCreatedAt: string;
- nextCursorId: number;
- };
- timestamp: string;
+ items: FavoriteGoalItem[];
+ hasNext: boolean;
+ nextCursorCreatedAt?: string;
+ nextCursorId?: number;
}
-
-// FavoriteGoalsErrorResponse
-
-export type FavoriteGoalsErrorResponse =
- | {
- success: false;
- code: "AUTH_LOGIN_REQUIRED";
- message: "로그인이 필요합니다.";
- data: null;
- timestamp: string;
- }
- | {
- success: false;
- code: "GOAL_CURSOR_INVALID";
- message: "커서 값이 올바르지 않습니다. cursorCreatedAt와 cursorId를 함께 전달하세요.";
- data: null;
- timestamp: string;
- }
- | {
- success: false;
- code: "MAIN_PAGE_SIZE_INVALID";
- message: "size는 1 이상이어야 합니다.";
- data: null;
- timestamp: string;
- };
-
-export type FavoriteGoalsResponse =
- | FavoriteGoalsSuccessResponse
- | FavoriteGoalsErrorResponse;
diff --git a/src/entities/goal/types/goal.types.ts b/src/entities/goal/types/goal.types.ts
new file mode 100644
index 00000000..b83859f6
--- /dev/null
+++ b/src/entities/goal/types/goal.types.ts
@@ -0,0 +1,42 @@
+interface CreateGoalRequest {
+ name: string;
+ dueDate: string;
+}
+
+export interface CreatePersonalGoalRequest extends CreateGoalRequest {
+ type: "PERSONAL";
+}
+
+export interface CreateTeamGoalRequest extends CreateGoalRequest {
+ teamId: number;
+ type: "TEAM";
+}
+
+export interface CreateGoalResponse {
+ success: boolean;
+}
+
+export interface UpdateGoalRequest {
+ name: string;
+ dueDate: string;
+}
+
+export interface UpdateGoalResponse {
+ id: number;
+ name: string;
+ dueDate: string;
+}
+
+export type DeleteGoalResponse = null;
+
+export interface ToggleGoalFavoriteResponse {
+ success: boolean;
+}
+
+export interface GoalSummaryResponse {
+ goalId: number;
+ goalName: string;
+ dueDate: string;
+ dDay: number;
+ progressPercent: number;
+}
diff --git a/src/entities/goal/types/goalList.types.ts b/src/entities/goal/types/goalList.types.ts
new file mode 100644
index 00000000..71b952f9
--- /dev/null
+++ b/src/entities/goal/types/goalList.types.ts
@@ -0,0 +1,25 @@
+export type SortType = "LATEST" | "OLDEST";
+
+export interface GoalListCursor {
+ cursorCreatedAt: string;
+ cursorId: number;
+}
+
+export type PersonalGoalListResponse = {
+ goalId: number;
+ goalName: string;
+}[];
+
+export interface TeamGoalListItem {
+ goalId: number;
+ name: string;
+ progressPercent: number;
+ isFavorite: boolean;
+ createdAt: string;
+}
+
+export interface TeamGoalListResponse {
+ items: TeamGoalListItem[];
+ nextCursor: GoalListCursor | null;
+ size: number;
+}
diff --git a/src/entities/goal/types/types.ts b/src/entities/goal/types/types.ts
deleted file mode 100644
index acbc5461..00000000
--- a/src/entities/goal/types/types.ts
+++ /dev/null
@@ -1,77 +0,0 @@
-import z from "zod";
-
-export const createGoalCreateSchema = z.object({
- name: z
- .string()
- .trim()
- .min(1, "목표 이름을 입력해주세요.")
- .max(30, "목표 이름은 30자 이내로 입력해주세요."),
- date: z.string().min(1, "날짜를 선택해주세요."),
-});
-
-interface CreateGoalInput {
- name: string;
- dueDate: string;
-}
-
-export interface CreatePersonalGoalInput extends CreateGoalInput {
- type: "PERSONAL";
-}
-
-export interface CreateTeamGoalInput extends CreateGoalInput {
- teamId: number;
- type: "TEAM";
-}
-
-export interface CreateGoalResponse {
- success: boolean;
-}
-
-export interface PersonalGoalListResponse {
- success: boolean;
- code: string;
- message: string;
- data: {
- goalId: number;
- goalName: string;
- }[];
-}
-
-export type SortType = "LATEST" | "OLDEST";
-
-export interface GoalListCursor {
- cursorCreatedAt: string;
- cursorId: number;
-}
-
-export interface TeamGoalListItem {
- goalId: number;
- name: string;
- progressPercent: number;
- isFavorite: boolean;
- createdAt: string;
-}
-
-export interface TeamGoalListResponse {
- success: boolean;
- code: string;
- message: string;
- data: {
- items: TeamGoalListItem[];
- nextCursor: GoalListCursor | null;
- size: number;
- };
-}
-
-export interface GoalSummaryResponse {
- success: boolean;
- code: string;
- message: string;
- data: {
- goalId: number;
- goalName: string;
- dueDate: string;
- dDay: number;
- progressPercent: number;
- };
-}
diff --git a/src/entities/team/api/team.api.ts b/src/entities/team/api/team.api.ts
new file mode 100644
index 00000000..cd22afda
--- /dev/null
+++ b/src/entities/team/api/team.api.ts
@@ -0,0 +1,70 @@
+import { apiClient } from "@/shared/lib/api/client";
+import type { ApiResponse } from "@/shared/lib/api/types";
+
+import type { TeamInvitationDetail } from "../types/invitation.types";
+import type {
+ Member,
+ MemberRole,
+ TeamDetail,
+ TeamListItem,
+ TeamSummary,
+} from "../types/team.types";
+
+export const teamApi = {
+ // 팀 목록·생성·탈퇴
+ create: (name: string) =>
+ apiClient.post>("/api/teams", { name }),
+
+ getAll: () => apiClient.get>("/api/teams/me"),
+
+ getSummary: (teamId: string) =>
+ apiClient.get>(`/api/teams/${teamId}/summary`),
+
+ getMemberList: (teamId: string) =>
+ apiClient.get>(`/api/teams/${teamId}/members`),
+
+ quitTeam: (teamId: string) =>
+ apiClient.delete>(`/api/teams/${teamId}/leave`),
+
+ // 팀 상세·수정·삭제·멤버 관리
+ getDetail: (teamId: number) =>
+ apiClient.get>(`/api/teams/${teamId}`),
+
+ update: (teamId: number, name: string) =>
+ apiClient.patch>(`/api/teams/${teamId}`, { name }),
+
+ deleteTeam: (teamId: number) =>
+ apiClient.delete>(`/api/teams/${teamId}`),
+
+ updateMemberRole: (teamId: number, memberId: number, role: MemberRole) =>
+ apiClient.patch>(
+ `/api/teams/${teamId}/members/${memberId}/role`,
+ { role },
+ ),
+
+ deleteMember: (teamId: number, memberId: number) =>
+ apiClient.delete>(
+ `/api/teams/${teamId}/members/${memberId}`,
+ ),
+
+ createInvitation: (teamId: string, email: string) =>
+ apiClient.post>(`/api/teams/${teamId}/invitations`, {
+ email,
+ }),
+
+ // 초대 수락·거절
+ getInvitationByToken: (inviteToken: string) =>
+ apiClient.get>(
+ `/api/teams/invitations/${encodeURIComponent(inviteToken)}`,
+ ),
+
+ acceptInvitation: (inviteToken: string) =>
+ apiClient.post>(
+ `/api/teams/invitations/${encodeURIComponent(inviteToken)}/accept`,
+ ),
+
+ rejectInvitation: (inviteToken: string) =>
+ apiClient.post>(
+ `/api/teams/invitations/${encodeURIComponent(inviteToken)}/reject`,
+ ),
+};
diff --git a/src/entities/team/index.ts b/src/entities/team/index.ts
new file mode 100644
index 00000000..ec946b1d
--- /dev/null
+++ b/src/entities/team/index.ts
@@ -0,0 +1,7 @@
+export { teamApi } from "./api/team.api";
+export type { CreateTeamInput } from "./model/team.model";
+export { createTeamSchema } from "./model/team.model";
+export { teamQueryOptions } from "./query/team.queryOptions";
+export type { TeamInvitationDetail } from "./types/invitation.types";
+export type { Member, MemberRole } from "./types/team.types";
+export { TEAM_NAME_MAX_LENGTH } from "./types/team.types";
diff --git a/src/entities/team/model/team.model.ts b/src/entities/team/model/team.model.ts
new file mode 100644
index 00000000..c76c3571
--- /dev/null
+++ b/src/entities/team/model/team.model.ts
@@ -0,0 +1,16 @@
+import z from "zod";
+
+import { TEAM_NAME_MAX_LENGTH } from "../types/team.types";
+
+export const createTeamSchema = z.object({
+ name: z
+ .string()
+ .trim()
+ .min(1, "팀 이름을 입력해주세요.")
+ .max(
+ TEAM_NAME_MAX_LENGTH,
+ `팀 이름은 ${TEAM_NAME_MAX_LENGTH}자 이내로 입력해주세요.`,
+ ),
+});
+
+export type CreateTeamInput = z.infer;
diff --git a/src/entities/team/query/team.queryOptions.ts b/src/entities/team/query/team.queryOptions.ts
new file mode 100644
index 00000000..388fcc78
--- /dev/null
+++ b/src/entities/team/query/team.queryOptions.ts
@@ -0,0 +1,47 @@
+import { queryOptions } from "@tanstack/react-query";
+
+import { STALE_TIME } from "@/shared/constants/query/staleTime";
+
+import { teamApi } from "../api/team.api";
+
+export const teamQueryOptions = {
+ all: () =>
+ queryOptions({
+ queryKey: ["teams", "all"],
+ queryFn: async () => {
+ const response = await teamApi.getAll();
+ return response.data;
+ },
+ staleTime: STALE_TIME.DEFAULT,
+ }),
+
+ summary: (teamId: string) =>
+ queryOptions({
+ queryKey: ["team", teamId, "summary"],
+ queryFn: async () => {
+ const response = await teamApi.getSummary(teamId);
+ return response.data;
+ },
+ staleTime: STALE_TIME.DEFAULT,
+ }),
+
+ memberList: (teamId: string) =>
+ queryOptions({
+ queryKey: ["team", teamId, "memberList"],
+ queryFn: async () => {
+ const response = await teamApi.getMemberList(teamId);
+ return response.data;
+ },
+ staleTime: STALE_TIME.DEFAULT,
+ }),
+
+ invitation: (token: string) =>
+ queryOptions({
+ queryKey: ["teamInvitation", token],
+ queryFn: async () => {
+ const res = await teamApi.getInvitationByToken(token);
+ return res.data;
+ },
+ enabled: Boolean(token),
+ }),
+};
diff --git a/src/entities/team/types/team.types.ts b/src/entities/team/types/team.types.ts
new file mode 100644
index 00000000..27fbfa9a
--- /dev/null
+++ b/src/entities/team/types/team.types.ts
@@ -0,0 +1,37 @@
+export const TEAM_NAME_MAX_LENGTH = 50;
+
+export type MemberRole = "ADMIN" | "MEMBER";
+
+export interface Member {
+ id: number;
+ userId: number;
+ userEmail: string;
+ profileImageUrl: string | null;
+ userNickname: string;
+ role: MemberRole;
+ joinedAt: string;
+}
+
+export interface TeamSummary {
+ teamId: number;
+ teamName: string;
+ isAdmin: boolean;
+ todayProgressPercent: number;
+ todayTodoCount: number;
+ overdueTodoCount: number;
+ doneTodoCount: number;
+}
+
+export interface TeamListItem {
+ teamId: number;
+ teamName: string;
+ goals: { goalId: number; goalName: string }[];
+}
+
+export interface TeamDetail {
+ id: number;
+ name: string;
+ createdBy: number;
+ createdAt: string;
+ updatedAt: string;
+}
diff --git a/src/entities/todo/api/api.ts b/src/entities/todo/api/api.ts
deleted file mode 100644
index d432b525..00000000
--- a/src/entities/todo/api/api.ts
+++ /dev/null
@@ -1,61 +0,0 @@
-import type {
- CreateTodoInput,
- ResponseCreateTodo,
- TodoListQueryParams,
- TodoListResponse,
- UpdateTodoInput,
-} from "@/entities/todo/types/types";
-import { apiClient } from "@/shared/lib/api/client";
-
-function todoListSearchParams(params: TodoListQueryParams) {
- const optional = Object.fromEntries(
- (
- [
- ["cursorDueDate", params.cursorDueDate],
- ["cursorCreatedAt", params.cursorCreatedAt],
- ["cursorId", params.cursorId],
- ["limit", params.limit],
- ] as const
- ).filter(([, value]) => {
- if (value === undefined) return false;
- if (typeof value === "string" && value === "") return false;
- return true;
- }),
- );
-
- return {
- sort: params.sort,
- mineOnly: params.mineOnly ? "true" : "false",
- titleContains: params.titleContains,
- ...optional,
- };
-}
-
-export const todoApi = {
- create: (goalId: string, todoData: CreateTodoInput) =>
- apiClient.post(`/api/goals/${goalId}/todos`, todoData),
-
- getTodoList: (goalId: string, params: TodoListQueryParams) =>
- apiClient.get(`/api/goals/${goalId}/todos`, {
- params: { status: "TODO", ...todoListSearchParams(params) },
- }),
-
- getDoingList: (goalId: string, params: TodoListQueryParams) =>
- apiClient.get(`/api/goals/${goalId}/todos`, {
- params: { status: "DOING", ...todoListSearchParams(params) },
- }),
-
- getDoneList: (goalId: string, params: TodoListQueryParams) =>
- apiClient.get(`/api/goals/${goalId}/todos`, {
- params: { status: "DONE", ...todoListSearchParams(params) },
- }),
-
- patch: (goalId: string, todoId: string, todoData: UpdateTodoInput) => {
- return apiClient.patch(`/api/goals/${goalId}/todos/${todoId}`, todoData);
- },
-
- delete: (goalId: string, todoId: string) =>
- apiClient.delete<{ success: boolean }>(
- `/api/goals/${goalId}/todos/${todoId}`,
- ),
-};
diff --git a/src/entities/todo/api/todo.api.test.ts b/src/entities/todo/api/todo.api.test.ts
new file mode 100644
index 00000000..73b8f5a7
--- /dev/null
+++ b/src/entities/todo/api/todo.api.test.ts
@@ -0,0 +1,272 @@
+import { apiClient } from "@/shared/lib/api/client";
+
+import { todoApi } from "./todo.api";
+
+jest.mock("@/shared/lib/api/client", () => ({
+ apiClient: {
+ get: jest.fn(),
+ post: jest.fn(),
+ patch: jest.fn(),
+ delete: jest.fn(),
+ },
+}));
+
+const mockApiClient = apiClient as jest.Mocked;
+
+const makeResponse = (data: T) => ({
+ success: true,
+ code: "OK",
+ message: "success",
+ data,
+ timestamp: "2026-01-01T00:00:00Z",
+});
+
+const BASE_LIST_PARAMS = {
+ sort: "DUE_DATE" as const,
+ mineOnly: false,
+ titleContains: "",
+};
+
+beforeEach(() => {
+ jest.clearAllMocks();
+});
+
+describe("todoApi", () => {
+ describe("create", () => {
+ test("POST /api/goals/{goalId}/todos를 호출한다", async () => {
+ mockApiClient.post.mockResolvedValue(makeResponse(null));
+
+ await todoApi.create("1", {
+ title: "테스트 할 일",
+ startDate: "2026-04-01",
+ dueDate: "2026-04-30",
+ assigneeIds: [101],
+ memo: "메모",
+ });
+
+ expect(mockApiClient.post).toHaveBeenCalledWith(
+ "/api/goals/1/todos",
+ expect.objectContaining({ title: "테스트 할 일" }),
+ );
+ });
+ });
+
+ describe("getTodoList", () => {
+ test("GET /api/goals/{goalId}/todos?status=TODO를 호출한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getTodoList("1", BASE_LIST_PARAMS);
+
+ expect(mockApiClient.get).toHaveBeenCalledWith(
+ "/api/goals/1/todos",
+ expect.objectContaining({
+ params: expect.objectContaining({ status: "TODO" }),
+ }),
+ );
+ });
+
+ test("mineOnly가 true이면 params에 'true' 문자열로 전달한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getTodoList("1", { ...BASE_LIST_PARAMS, mineOnly: true });
+
+ expect(mockApiClient.get).toHaveBeenCalledWith(
+ "/api/goals/1/todos",
+ expect.objectContaining({
+ params: expect.objectContaining({ mineOnly: "true" }),
+ }),
+ );
+ });
+
+ test("mineOnly가 false이면 params에 'false' 문자열로 전달한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getTodoList("1", { ...BASE_LIST_PARAMS, mineOnly: false });
+
+ expect(mockApiClient.get).toHaveBeenCalledWith(
+ "/api/goals/1/todos",
+ expect.objectContaining({
+ params: expect.objectContaining({ mineOnly: "false" }),
+ }),
+ );
+ });
+
+ test("cursor 파라미터가 있으면 params에 포함한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getTodoList("1", {
+ ...BASE_LIST_PARAMS,
+ sort: "DUE_DATE",
+ cursorDueDate: "2026-05-01",
+ cursorId: 42,
+ });
+
+ expect(mockApiClient.get).toHaveBeenCalledWith(
+ "/api/goals/1/todos",
+ expect.objectContaining({
+ params: expect.objectContaining({
+ cursorDueDate: "2026-05-01",
+ cursorId: 42,
+ }),
+ }),
+ );
+ });
+
+ test("cursor 파라미터가 undefined이면 params에서 제외한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getTodoList("1", BASE_LIST_PARAMS);
+
+ const [, options] = mockApiClient.get.mock.calls[0];
+ expect(options?.params).not.toHaveProperty("cursorDueDate");
+ expect(options?.params).not.toHaveProperty("cursorCreatedAt");
+ expect(options?.params).not.toHaveProperty("cursorId");
+ });
+
+ test("빈 문자열 cursor는 params에서 제외한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getTodoList("1", {
+ ...BASE_LIST_PARAMS,
+ cursorDueDate: "",
+ cursorCreatedAt: "",
+ });
+
+ const [, options] = mockApiClient.get.mock.calls[0];
+ expect(options?.params).not.toHaveProperty("cursorDueDate");
+ expect(options?.params).not.toHaveProperty("cursorCreatedAt");
+ });
+
+ test("limit이 있으면 params에 포함한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getTodoList("1", { ...BASE_LIST_PARAMS, limit: 10 });
+
+ expect(mockApiClient.get).toHaveBeenCalledWith(
+ "/api/goals/1/todos",
+ expect.objectContaining({
+ params: expect.objectContaining({ limit: 10 }),
+ }),
+ );
+ });
+ });
+
+ describe("getDoingList", () => {
+ test("GET /api/goals/{goalId}/todos?status=DOING를 호출한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getDoingList("2", BASE_LIST_PARAMS);
+
+ expect(mockApiClient.get).toHaveBeenCalledWith(
+ "/api/goals/2/todos",
+ expect.objectContaining({
+ params: expect.objectContaining({ status: "DOING" }),
+ }),
+ );
+ });
+ });
+
+ describe("getDoneList", () => {
+ test("GET /api/goals/{goalId}/todos?status=DONE를 호출한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getDoneList("3", BASE_LIST_PARAMS);
+
+ expect(mockApiClient.get).toHaveBeenCalledWith(
+ "/api/goals/3/todos",
+ expect.objectContaining({
+ params: expect.objectContaining({ status: "DONE" }),
+ }),
+ );
+ });
+ });
+
+ describe("patch", () => {
+ test("PATCH /api/goals/{goalId}/todos/{todoId}를 body와 함께 호출한다", async () => {
+ mockApiClient.patch.mockResolvedValue(makeResponse(null));
+
+ const updateData = {
+ title: "수정된 제목",
+ startDate: "2026-04-01",
+ dueDate: "2026-04-30",
+ status: "DOING" as const,
+ memo: "수정 메모",
+ assigneeIds: [101],
+ };
+
+ await todoApi.patch("1", "99", updateData);
+
+ expect(mockApiClient.patch).toHaveBeenCalledWith(
+ "/api/goals/1/todos/99",
+ updateData,
+ );
+ });
+ });
+
+ describe("delete", () => {
+ test("DELETE /api/goals/{goalId}/todos/{todoId}를 호출한다", async () => {
+ mockApiClient.delete.mockResolvedValue(makeResponse(null));
+
+ await todoApi.delete("1", "55");
+
+ expect(mockApiClient.delete).toHaveBeenCalledWith(
+ "/api/goals/1/todos/55",
+ );
+ });
+ });
+
+ describe("getRecent", () => {
+ test("params 없이 호출하면 빈 params로 요청한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getRecent();
+
+ expect(mockApiClient.get).toHaveBeenCalledWith("/api/todos/recent", {
+ params: {},
+ });
+ });
+
+ test("cursor params를 전달하면 함께 요청한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getRecent({
+ cursorId: 10,
+ cursorCreatedAt: "2026-04-01T00:00:00Z",
+ size: 20,
+ });
+
+ expect(mockApiClient.get).toHaveBeenCalledWith("/api/todos/recent", {
+ params: {
+ cursorId: 10,
+ cursorCreatedAt: "2026-04-01T00:00:00Z",
+ size: 20,
+ },
+ });
+ });
+ });
+
+ describe("getDueSoon", () => {
+ test("params 없이 호출하면 빈 params로 요청한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getDueSoon();
+
+ expect(mockApiClient.get).toHaveBeenCalledWith("/api/todos/due-soon", {
+ params: {},
+ });
+ });
+
+ test("cursor params를 전달하면 함께 요청한다", async () => {
+ mockApiClient.get.mockResolvedValue(makeResponse({ items: [] }));
+
+ await todoApi.getDueSoon({
+ cursorId: 5,
+ size: 20,
+ });
+
+ expect(mockApiClient.get).toHaveBeenCalledWith("/api/todos/due-soon", {
+ params: { cursorId: 5, size: 20 },
+ });
+ });
+ });
+});
diff --git a/src/entities/todo/api/todo.api.ts b/src/entities/todo/api/todo.api.ts
index a5610e13..b0fdb600 100644
--- a/src/entities/todo/api/todo.api.ts
+++ b/src/entities/todo/api/todo.api.ts
@@ -1,21 +1,75 @@
import { apiClient } from "@/shared/lib/api/client";
+import type { ApiResponse } from "@/shared/lib/api/types";
-import {
- DueSoonSuccessResponse,
- InfiniteQueryParams,
- RecentSuccessResponse,
-} from "../types/types";
+import type {
+ CreateTodoRequest,
+ DueSoonTodoListResponse,
+ RecentTodoListResponse,
+ TodoInfiniteQueryParams,
+ TodoListQueryParams,
+ TodoListResponse,
+ UpdateTodoRequest,
+} from "../types/todo.types";
-export const recentApi = {
- read: (params: InfiniteQueryParams = {}) =>
- apiClient.get("/api/todos/recent", {
+function todoListSearchParams(params: TodoListQueryParams) {
+ const optional = Object.fromEntries(
+ (
+ [
+ ["cursorDueDate", params.cursorDueDate],
+ ["cursorCreatedAt", params.cursorCreatedAt],
+ ["cursorId", params.cursorId],
+ ["limit", params.limit],
+ ] as const
+ ).filter(([, value]) => {
+ if (value === undefined) return false;
+ if (typeof value === "string" && value === "") return false;
+ return true;
+ }),
+ );
+
+ return {
+ sort: params.sort,
+ mineOnly: params.mineOnly ? "true" : "false",
+ titleContains: params.titleContains,
+ ...optional,
+ };
+}
+
+export const todoApi = {
+ create: (goalId: string, todoData: CreateTodoRequest) =>
+ apiClient.post>(`/api/goals/${goalId}/todos`, todoData),
+
+ getTodoList: (goalId: string, params: TodoListQueryParams) =>
+ apiClient.get>(`/api/goals/${goalId}/todos`, {
+ params: { status: "TODO", ...todoListSearchParams(params) },
+ }),
+
+ getDoingList: (goalId: string, params: TodoListQueryParams) =>
+ apiClient.get>(`/api/goals/${goalId}/todos`, {
+ params: { status: "DOING", ...todoListSearchParams(params) },
+ }),
+
+ getDoneList: (goalId: string, params: TodoListQueryParams) =>
+ apiClient.get>(`/api/goals/${goalId}/todos`, {
+ params: { status: "DONE", ...todoListSearchParams(params) },
+ }),
+
+ patch: (goalId: string, todoId: string, todoData: UpdateTodoRequest) =>
+ apiClient.patch>(
+ `/api/goals/${goalId}/todos/${todoId}`,
+ todoData,
+ ),
+
+ delete: (goalId: string, todoId: string) =>
+ apiClient.delete>(`/api/goals/${goalId}/todos/${todoId}`),
+
+ getRecent: (params: TodoInfiniteQueryParams = {}) =>
+ apiClient.get>("/api/todos/recent", {
params,
}),
-};
-export const dueSoonApi = {
- read: (params: InfiniteQueryParams = {}) =>
- apiClient.get("/api/todos/due-soon", {
+ getDueSoon: (params: TodoInfiniteQueryParams = {}) =>
+ apiClient.get>("/api/todos/due-soon", {
params,
}),
};
diff --git a/src/entities/todo/index.ts b/src/entities/todo/index.ts
new file mode 100644
index 00000000..5fea1fdc
--- /dev/null
+++ b/src/entities/todo/index.ts
@@ -0,0 +1,11 @@
+export { todoApi } from "./api/todo.api";
+export type { TodoListInfiniteFilters } from "./query/todo.queryOptions";
+export { todoQueryOptions } from "./query/todo.queryOptions";
+export type {
+ CreateTodoRequest,
+ Todo,
+ TodoItem,
+ TodoListSort,
+ TodoStatus,
+ UpdateTodoRequest,
+} from "./types/todo.types";
diff --git a/src/entities/todo/query/todo.queryKey.ts b/src/entities/todo/query/todo.queryOptions.ts
similarity index 77%
rename from src/entities/todo/query/todo.queryKey.ts
rename to src/entities/todo/query/todo.queryOptions.ts
index 3544e711..8f932fb8 100644
--- a/src/entities/todo/query/todo.queryKey.ts
+++ b/src/entities/todo/query/todo.queryOptions.ts
@@ -1,16 +1,18 @@
+import { infiniteQueryOptions } from "@tanstack/react-query";
+
import { STALE_TIME } from "@/shared/constants/query/staleTime";
-import { todoApi } from "../api/api";
+import { todoApi } from "../api/todo.api";
import type {
TodoListQueryParams,
TodoListResponse,
TodoListSort,
TodoListStatus,
-} from "../types/types";
+} from "../types/todo.types";
const TODO_LIST_PAGE_LIMIT = 10;
-type TodoCursor = Pick<
+type TodoListCursor = Pick<
TodoListQueryParams,
"cursorDueDate" | "cursorCreatedAt" | "cursorId"
>;
@@ -22,8 +24,8 @@ export type TodoListInfiniteFilters = {
};
function getTodoListInfiniteNextPageParam(
- lastPage: TodoListResponse["data"],
-): TodoCursor | undefined {
+ lastPage: TodoListResponse,
+): TodoListCursor | undefined {
if (!lastPage.hasNext || !lastPage.nextCursorId) return undefined;
if (lastPage.sort === "DUE_DATE") {
return {
@@ -41,12 +43,9 @@ function todoListInfiniteOptions(
goalId: string,
status: TodoListStatus,
filters: TodoListInfiniteFilters,
- fetchPage: (
- goalId: string,
- params: TodoListQueryParams,
- ) => ReturnType<(typeof todoApi)["getTodoList"]>,
+ fetchPage: typeof todoApi.getTodoList,
) {
- return {
+ return infiniteQueryOptions({
queryKey: [
"todo",
goalId,
@@ -58,8 +57,8 @@ function todoListInfiniteOptions(
sort: filters.sort,
},
] as const,
- initialPageParam: {} as TodoCursor,
- queryFn: async ({ pageParam }: { pageParam: TodoCursor }) => {
+ initialPageParam: {} as TodoListCursor,
+ queryFn: async ({ pageParam }: { pageParam: TodoListCursor }) => {
const response = await fetchPage(goalId, {
sort: filters.sort,
mineOnly: filters.isMyTodo,
@@ -69,13 +68,12 @@ function todoListInfiniteOptions(
});
return response.data;
},
- getNextPageParam: (lastPage: TodoListResponse["data"]) =>
- getTodoListInfiniteNextPageParam(lastPage),
+ getNextPageParam: getTodoListInfiniteNextPageParam,
staleTime: STALE_TIME.DEFAULT,
- };
+ });
}
-export const todoQueries = {
+export const todoQueryOptions = {
todoListInfinite: (goalId: string, filters: TodoListInfiniteFilters) =>
todoListInfiniteOptions(goalId, "TODO", filters, todoApi.getTodoList),
diff --git a/src/entities/todo/types/types.ts b/src/entities/todo/types/todo.types.ts
similarity index 54%
rename from src/entities/todo/types/types.ts
rename to src/entities/todo/types/todo.types.ts
index 5469697b..676335f9 100644
--- a/src/entities/todo/types/types.ts
+++ b/src/entities/todo/types/todo.types.ts
@@ -1,6 +1,8 @@
export type TodoStatus = "TODO" | "DOING" | "DONE";
+export type TodoListStatus = "TODO" | "DOING" | "DONE";
+export type TodoListSort = "DUE_DATE" | "CREATED_LATEST" | "CREATED_OLDEST";
-export type CreateTodoInput = {
+export type CreateTodoRequest = {
title: string;
startDate: string;
dueDate: string;
@@ -8,7 +10,7 @@ export type CreateTodoInput = {
memo: string;
};
-export type UpdateTodoInput = {
+export type UpdateTodoRequest = {
title: string;
startDate: string;
dueDate: string;
@@ -17,11 +19,7 @@ export type UpdateTodoInput = {
assigneeIds: number[];
};
-export type ResponseCreateTodo = {
- success: boolean;
- code: string;
- message: string;
-};
+export type CreateTodoResponse = null;
export interface Todo {
id: number;
@@ -39,22 +37,14 @@ export interface Todo {
}
export interface TodoListResponse {
- success: boolean;
- code: string;
- message: string;
- data: {
- sort: TodoListSort;
- items: Todo[];
- hasNext: boolean;
- nextCursorDueDate: string | null;
- nextCursorCreatedAt: string | null;
- nextCursorId: number | null;
- };
+ sort: TodoListSort;
+ items: Todo[];
+ hasNext: boolean;
+ nextCursorDueDate: string | null;
+ nextCursorCreatedAt: string | null;
+ nextCursorId: number | null;
}
-export type TodoListStatus = "TODO" | "DOING" | "DONE";
-export type TodoListSort = "DUE_DATE" | "CREATED_LATEST" | "CREATED_OLDEST";
-
export interface TodoListQueryParams {
sort: TodoListSort;
mineOnly: boolean;
@@ -65,9 +55,7 @@ export interface TodoListQueryParams {
limit?: number;
}
-// GET - query params
-
-export type InfiniteQueryParams = {
+export type TodoInfiniteQueryParams = {
cursorId?: number;
cursorCreatedAt?: string;
size?: number;
@@ -81,28 +69,16 @@ export type TodoItem = {
dueDate: string;
};
-export type RecentSuccessResponse = {
- success: true;
- code: string;
- message: string;
- data: {
- items: TodoItem[];
- hasNext: boolean;
- nextCursorCreatedAt: string;
- nextCursorId: number;
- };
- timestamp: string;
+export type RecentTodoListResponse = {
+ items: TodoItem[];
+ hasNext: boolean;
+ nextCursorCreatedAt?: string;
+ nextCursorId?: number;
};
-export type DueSoonSuccessResponse = {
- success: true;
- code: string;
- message: string;
- data: {
- items: TodoItem[];
- hasNext: boolean;
- nextCursorDueDate: string;
- nextCursorId: number;
- };
- timestamp: string;
+export type DueSoonTodoListResponse = {
+ items: TodoItem[];
+ hasNext: boolean;
+ nextCursorDueDate?: string;
+ nextCursorId?: number;
};
diff --git a/src/features/goal/hooks/useGoalActions.test.tsx b/src/features/goal/hooks/useGoalActions.test.tsx
new file mode 100644
index 00000000..68dc3eff
--- /dev/null
+++ b/src/features/goal/hooks/useGoalActions.test.tsx
@@ -0,0 +1,163 @@
+import { act, renderHook } from "@testing-library/react";
+
+import { useDeleteGoalMutation } from "@/features/goal/mutation/useDeleteGoalMutation";
+import { useUpdateGoalMutation } from "@/features/goal/mutation/useUpdateGoalMutation";
+import type { GoalEditModalProps } from "@/features/goal/ui/GoalEditModal";
+import { useOverlay } from "@/shared/hooks/useOverlay";
+
+import { useGoalActions } from "./useGoalActions";
+
+jest.mock("@/shared/hooks/useOverlay");
+jest.mock("@/features/goal/mutation/useDeleteGoalMutation");
+jest.mock("@/features/goal/mutation/useUpdateGoalMutation");
+jest.mock("@/features/goal/ui/GoalEditModal", () => ({
+ GoalEditModal: () => null,
+}));
+jest.mock("@/shared/ui/ConfirmModal", () => ({
+ default: () => null,
+}));
+
+const mockUseOverlay = useOverlay as jest.MockedFunction;
+const mockUseDeleteGoalMutation = useDeleteGoalMutation as jest.MockedFunction<
+ typeof useDeleteGoalMutation
+>;
+const mockUseUpdateGoalMutation = useUpdateGoalMutation as jest.MockedFunction<
+ typeof useUpdateGoalMutation
+>;
+
+const defaultSummary = {
+ goalName: "디자인 시스템 완성",
+ dueDate: "2026-12-31",
+};
+
+const defaultParams = {
+ goalId: "1",
+ teamId: null,
+ summary: defaultSummary,
+ onMenuClose: jest.fn(),
+};
+
+describe("useGoalActions", () => {
+ let mockOpen: jest.Mock;
+ let mockClose: jest.Mock;
+
+ beforeEach(() => {
+ jest.clearAllMocks();
+
+ mockOpen = jest.fn();
+ mockClose = jest.fn();
+
+ mockUseOverlay.mockReturnValue({ open: mockOpen, close: mockClose });
+
+ mockUseDeleteGoalMutation.mockReturnValue({
+ isPending: false,
+ mutate: jest.fn(),
+ } as unknown as ReturnType);
+
+ mockUseUpdateGoalMutation.mockReturnValue({
+ isPending: false,
+ mutate: jest.fn(),
+ } as unknown as ReturnType);
+ });
+
+ describe("openEditModal", () => {
+ test("onMenuClose를 먼저 호출한다", () => {
+ const onMenuClose = jest.fn();
+ const { result } = renderHook(() =>
+ useGoalActions({ ...defaultParams, onMenuClose }),
+ );
+
+ act(() => {
+ result.current.openEditModal();
+ });
+
+ expect(onMenuClose).toHaveBeenCalledTimes(1);
+ });
+
+ test("goal-edit-modal ID로 overlay를 연다", () => {
+ const { result } = renderHook(() => useGoalActions(defaultParams));
+
+ act(() => {
+ result.current.openEditModal();
+ });
+
+ expect(mockOpen).toHaveBeenCalledWith(
+ "goal-edit-modal",
+ expect.anything(),
+ );
+ });
+
+ test("GoalEditModal에 summary의 초기값을 전달한다", () => {
+ const { result } = renderHook(() => useGoalActions(defaultParams));
+
+ act(() => {
+ result.current.openEditModal();
+ });
+
+ const [, element] = mockOpen.mock.calls[0] as [
+ string,
+ React.ReactElement,
+ ];
+ expect(element.props.initialName).toBe("디자인 시스템 완성");
+ expect(element.props.initialDueDate).toBe("2026-12-31");
+ });
+ });
+
+ describe("openDeleteConfirm", () => {
+ test("onMenuClose를 먼저 호출한다", () => {
+ const onMenuClose = jest.fn();
+ const { result } = renderHook(() =>
+ useGoalActions({ ...defaultParams, onMenuClose }),
+ );
+
+ act(() => {
+ result.current.openDeleteConfirm();
+ });
+
+ expect(onMenuClose).toHaveBeenCalledTimes(1);
+ });
+
+ test("goal-delete-confirm-modal ID로 overlay를 연다", () => {
+ const { result } = renderHook(() => useGoalActions(defaultParams));
+
+ act(() => {
+ result.current.openDeleteConfirm();
+ });
+
+ expect(mockOpen).toHaveBeenCalledWith(
+ "goal-delete-confirm-modal",
+ expect.anything(),
+ );
+ });
+ });
+
+ describe("isMutationPending", () => {
+ test("두 mutation이 모두 pending이 아니면 false를 반환한다", () => {
+ const { result } = renderHook(() => useGoalActions(defaultParams));
+
+ expect(result.current.isMutationPending).toBe(false);
+ });
+
+ test("deleteMutation이 pending이면 true를 반환한다", () => {
+ mockUseDeleteGoalMutation.mockReturnValue({
+ isPending: true,
+ mutate: jest.fn(),
+ } as unknown as ReturnType);
+
+ const { result } = renderHook(() => useGoalActions(defaultParams));
+
+ expect(result.current.isMutationPending).toBe(true);
+ });
+
+ test("updateMutation이 pending이면 true를 반환한다", () => {
+ mockUseUpdateGoalMutation.mockReturnValue({
+ isPending: true,
+ mutate: jest.fn(),
+ } as unknown as ReturnType);
+
+ const { result } = renderHook(() => useGoalActions(defaultParams));
+
+ expect(result.current.isMutationPending).toBe(true);
+ });
+ });
+});
diff --git a/src/features/goal/hooks/useGoalActions.tsx b/src/features/goal/hooks/useGoalActions.tsx
new file mode 100644
index 00000000..028a6a28
--- /dev/null
+++ b/src/features/goal/hooks/useGoalActions.tsx
@@ -0,0 +1,73 @@
+"use client";
+
+import { useDeleteGoalMutation } from "@/features/goal/mutation/useDeleteGoalMutation";
+import { useUpdateGoalMutation } from "@/features/goal/mutation/useUpdateGoalMutation";
+import { GoalEditModal } from "@/features/goal/ui/GoalEditModal";
+import { useOverlay } from "@/shared/hooks/useOverlay";
+import ConfirmModal from "@/shared/ui/ConfirmModal";
+
+const GOAL_EDIT_MODAL_ID = "goal-edit-modal";
+const GOAL_DELETE_MODAL_ID = "goal-delete-confirm-modal";
+
+type UseGoalActionsParams = {
+ goalId: string;
+ teamId: string | null;
+ summary: { goalName: string; dueDate: string };
+ onMenuClose: () => void;
+};
+
+export function useGoalActions({
+ goalId,
+ teamId,
+ summary,
+ onMenuClose,
+}: UseGoalActionsParams) {
+ const overlay = useOverlay();
+
+ const deleteMutation = useDeleteGoalMutation({
+ goalId,
+ teamId,
+ onDeleted: () => overlay.close(),
+ });
+
+ const updateMutation = useUpdateGoalMutation({
+ goalId,
+ teamId,
+ onUpdated: () => overlay.close(),
+ });
+
+ const openEditModal = () => {
+ onMenuClose();
+ overlay.open(
+ GOAL_EDIT_MODAL_ID,
+ overlay.close()}
+ isPending={updateMutation.isPending}
+ onSave={(input) => updateMutation.mutate(input)}
+ />,
+ );
+ };
+
+ const openDeleteConfirm = () => {
+ onMenuClose();
+ overlay.open(
+ GOAL_DELETE_MODAL_ID,
+ overlay.close()}
+ onConfirm={() => deleteMutation.mutate()}
+ />,
+ );
+ };
+
+ return {
+ openEditModal,
+ openDeleteConfirm,
+ isMutationPending: deleteMutation.isPending || updateMutation.isPending,
+ };
+}
diff --git a/src/features/goal/index.ts b/src/features/goal/index.ts
new file mode 100644
index 00000000..0b126aac
--- /dev/null
+++ b/src/features/goal/index.ts
@@ -0,0 +1,9 @@
+export { useGoalActions } from "./hooks/useGoalActions";
+export { useGoalId } from "./hooks/useGoalId";
+export { useCreatePersonalGoalMutation } from "./mutation/useCreatePersonalGoalMutation";
+export { useCreateTeamGoalMutation } from "./mutation/useCreateTeamGoalMutation";
+export { useDeleteGoalMutation } from "./mutation/useDeleteGoalMutation";
+export { useToggleGoalFavoriteMutation } from "./mutation/useToggleGoalFavoriteMutation";
+export { useUpdateGoalMutation } from "./mutation/useUpdateGoalMutation";
+export type { GoalEditModalProps } from "./ui/GoalEditModal";
+export { GoalEditModal } from "./ui/GoalEditModal";
diff --git a/src/features/goal/mutation/useCreatePersonalGoalMutation.ts b/src/features/goal/mutation/useCreatePersonalGoalMutation.ts
new file mode 100644
index 00000000..21a4278e
--- /dev/null
+++ b/src/features/goal/mutation/useCreatePersonalGoalMutation.ts
@@ -0,0 +1,27 @@
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+
+import { goalApi } from "@/entities/goal";
+
+type CreatePersonalGoalVariables = {
+ name: string;
+ dueDate: string;
+};
+
+type UseCreatePersonalGoalMutationOptions = {
+ onSuccess?: () => void;
+};
+
+export function useCreatePersonalGoalMutation({
+ onSuccess,
+}: UseCreatePersonalGoalMutationOptions = {}) {
+ const queryClient = useQueryClient();
+
+ return useMutation({
+ mutationFn: ({ name, dueDate }: CreatePersonalGoalVariables) =>
+ goalApi.createGoal({ name, dueDate, type: "PERSONAL" }),
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: ["personal", "goals"] });
+ onSuccess?.();
+ },
+ });
+}
diff --git a/src/features/goal/mutation/useCreateTeamGoalMutation.ts b/src/features/goal/mutation/useCreateTeamGoalMutation.ts
new file mode 100644
index 00000000..46103de7
--- /dev/null
+++ b/src/features/goal/mutation/useCreateTeamGoalMutation.ts
@@ -0,0 +1,28 @@
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+
+import { goalApi } from "@/entities/goal";
+
+type CreateTeamGoalVariables = {
+ name: string;
+ dueDate: string;
+ teamId: number;
+};
+
+type UseCreateTeamGoalMutationOptions = {
+ onSuccess?: () => void;
+};
+
+export function useCreateTeamGoalMutation({
+ onSuccess,
+}: UseCreateTeamGoalMutationOptions = {}) {
+ const queryClient = useQueryClient();
+
+ return useMutation({
+ mutationFn: ({ name, dueDate, teamId }: CreateTeamGoalVariables) =>
+ goalApi.createGoal({ name, dueDate, teamId, type: "TEAM" }),
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: ["teams", "all"] });
+ onSuccess?.();
+ },
+ });
+}
diff --git a/src/features/goal/mutation/useDeleteGoalMutation.ts b/src/features/goal/mutation/useDeleteGoalMutation.ts
index a1d38bc3..c0be05eb 100644
--- a/src/features/goal/mutation/useDeleteGoalMutation.ts
+++ b/src/features/goal/mutation/useDeleteGoalMutation.ts
@@ -1,7 +1,7 @@
import { useMutation, useQueryClient } from "@tanstack/react-query";
import { useRouter } from "next/navigation";
-import { goalApi } from "@/entities/goal/api/api";
+import { goalApi } from "@/entities/goal";
type UseDeleteGoalMutationOptions = {
goalId: string;
diff --git a/src/features/goal/mutation/useToggleGoalFavoriteMutation.ts b/src/features/goal/mutation/useToggleGoalFavoriteMutation.ts
new file mode 100644
index 00000000..52a758ee
--- /dev/null
+++ b/src/features/goal/mutation/useToggleGoalFavoriteMutation.ts
@@ -0,0 +1,14 @@
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+
+import { goalApi } from "@/entities/goal";
+
+export function useToggleGoalFavoriteMutation() {
+ const queryClient = useQueryClient();
+
+ return useMutation({
+ mutationFn: (goalId: number) => goalApi.toggleFavorite(String(goalId)),
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: ["favoriteGoals"] });
+ },
+ });
+}
diff --git a/src/features/goal/mutation/useUpdateGoalMutation.ts b/src/features/goal/mutation/useUpdateGoalMutation.ts
index bd8cad45..334eebfc 100644
--- a/src/features/goal/mutation/useUpdateGoalMutation.ts
+++ b/src/features/goal/mutation/useUpdateGoalMutation.ts
@@ -1,6 +1,6 @@
import { useMutation, useQueryClient } from "@tanstack/react-query";
-import { goalApi } from "@/entities/goal/api/api";
+import { goalApi } from "@/entities/goal";
type UpdateGoalVariables = {
name: string;
diff --git a/src/widgets/goal/Summary/GoalInfo/GoalEditModal.tsx b/src/features/goal/ui/GoalEditModal.tsx
similarity index 93%
rename from src/widgets/goal/Summary/GoalInfo/GoalEditModal.tsx
rename to src/features/goal/ui/GoalEditModal.tsx
index 3588a9aa..282b0e9e 100644
--- a/src/widgets/goal/Summary/GoalInfo/GoalEditModal.tsx
+++ b/src/features/goal/ui/GoalEditModal.tsx
@@ -2,7 +2,7 @@
import { useState } from "react";
-import { createGoalCreateSchema } from "@/entities/goal/types/types";
+import { createGoalSchema } from "@/entities/goal";
import Button from "@/shared/ui/Button/Button/Button";
import TextButton from "@/shared/ui/Button/TextButton/TextButton";
import Input from "@/shared/ui/Input/Input";
@@ -30,17 +30,16 @@ export function GoalEditModal({
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
- const parsed = createGoalCreateSchema.safeParse({
- name,
- date: dueDate,
- });
+ const parsed = createGoalSchema.safeParse({ name, dueDate });
+
if (!parsed.success) {
const fieldErrors = parsed.error.flatten().fieldErrors;
setNameError(fieldErrors.name?.[0] ?? "");
return;
}
+
setNameError("");
- onSave({ name: parsed.data.name, dueDate: parsed.data.date });
+ onSave({ name: parsed.data.name, dueDate: parsed.data.dueDate });
};
return (
diff --git a/src/features/team/hooks/useCreateTeamForm.ts b/src/features/team/hooks/useCreateTeamForm.ts
index c59cb932..cf9c2d52 100644
--- a/src/features/team/hooks/useCreateTeamForm.ts
+++ b/src/features/team/hooks/useCreateTeamForm.ts
@@ -4,8 +4,7 @@ import { useQueryClient } from "@tanstack/react-query";
import { useRouter } from "next/navigation";
import { ComponentProps, useState } from "react";
-import { teamQueries } from "@/entities/team/query/team.queryKey";
-import { createTeamSchema } from "@/entities/team/types/types";
+import { createTeamSchema, teamQueryOptions } from "@/entities/team";
import { useCreateTeamMutation } from "@/features/team/mutation/useCreateTeamMutation";
import { useToast } from "@/shared/hooks/useToast";
import type { ApiError } from "@/shared/lib/api/types";
@@ -19,7 +18,9 @@ export const useCreateTeamForm = () => {
const createMutation = useCreateTeamMutation({
onSuccess: () => {
- queryClient.invalidateQueries({ queryKey: teamQueries.all().queryKey });
+ queryClient.invalidateQueries({
+ queryKey: teamQueryOptions.all().queryKey,
+ });
toast({
variant: "success",
title: "팀 생성 완료",
diff --git a/src/features/team/hooks/useOptionalTeamId.test.ts b/src/features/team/hooks/useOptionalTeamId.test.ts
new file mode 100644
index 00000000..7b21c906
--- /dev/null
+++ b/src/features/team/hooks/useOptionalTeamId.test.ts
@@ -0,0 +1,44 @@
+import { renderHook } from "@testing-library/react";
+import { useParams } from "next/navigation";
+
+import { useOptionalTeamId } from "./useOptionalTeamId";
+
+jest.mock("next/navigation", () => ({
+ useParams: jest.fn(),
+}));
+
+const mockUseParams = useParams as jest.MockedFunction;
+
+describe("useOptionalTeamId", () => {
+ beforeEach(() => {
+ jest.clearAllMocks();
+ });
+
+ test("teamId가 있으면 문자열로 반환한다", () => {
+ mockUseParams.mockReturnValue({
+ teamId: "42",
+ } as ReturnType);
+
+ const { result } = renderHook(() => useOptionalTeamId());
+
+ expect(result.current).toBe("42");
+ });
+
+ test("teamId가 배열이어도 문자열로 변환해 반환한다", () => {
+ mockUseParams.mockReturnValue({
+ teamId: ["7"],
+ } as ReturnType);
+
+ const { result } = renderHook(() => useOptionalTeamId());
+
+ expect(result.current).toBe("7");
+ });
+
+ test("teamId가 없으면 null을 반환한다", () => {
+ mockUseParams.mockReturnValue({} as ReturnType);
+
+ const { result } = renderHook(() => useOptionalTeamId());
+
+ expect(result.current).toBeNull();
+ });
+});
diff --git a/src/features/team/hooks/useOptionalTeamId.ts b/src/features/team/hooks/useOptionalTeamId.ts
new file mode 100644
index 00000000..e4a7e62f
--- /dev/null
+++ b/src/features/team/hooks/useOptionalTeamId.ts
@@ -0,0 +1,8 @@
+"use client";
+
+import { useParams } from "next/navigation";
+
+export function useOptionalTeamId(): string | null {
+ const { teamId } = useParams();
+ return teamId != null ? String(teamId) : null;
+}
diff --git a/src/features/team/hooks/useTeamLeaveModal.tsx b/src/features/team/hooks/useTeamLeaveModal.tsx
index 26fe9b20..38425c2d 100644
--- a/src/features/team/hooks/useTeamLeaveModal.tsx
+++ b/src/features/team/hooks/useTeamLeaveModal.tsx
@@ -1,6 +1,6 @@
"use client";
-import { teamApi } from "@/entities/team/api/api";
+import { teamApi } from "@/entities/team";
import { useOverlay } from "@/shared/hooks/useOverlay";
import { useToast } from "@/shared/hooks/useToast";
import { ApiError } from "@/shared/lib/api/types";
diff --git a/src/features/team/mutation/useCreateTeamMutation.ts b/src/features/team/mutation/useCreateTeamMutation.ts
index 94a7ee2d..532922b2 100644
--- a/src/features/team/mutation/useCreateTeamMutation.ts
+++ b/src/features/team/mutation/useCreateTeamMutation.ts
@@ -2,12 +2,11 @@
import { useMutation, UseMutationOptions } from "@tanstack/react-query";
-import { teamApi } from "@/entities/team/api/api";
-import { ResponseCreateTeam } from "@/entities/team/types/types";
-import type { ApiError } from "@/shared/lib/api/types";
+import { teamApi } from "@/entities/team";
+import type { ApiError, ApiResponse } from "@/shared/lib/api/types";
type UseCreateTeamMutationParams = UseMutationOptions<
- ResponseCreateTeam,
+ ApiResponse,
ApiError,
string,
unknown
diff --git a/src/features/todo/constants/todoColumnSort.ts b/src/features/todo/constants/todoColumnSort.ts
index 8d8560f6..d5ff7c20 100644
--- a/src/features/todo/constants/todoColumnSort.ts
+++ b/src/features/todo/constants/todoColumnSort.ts
@@ -1,4 +1,4 @@
-import type { TodoListSort } from "@/entities/todo/types/types";
+import type { TodoListSort } from "@/entities/todo";
const TODO_LIST_SORT_BY_LABEL_CONST = {
"마감일 순": "DUE_DATE",
diff --git a/src/features/todo/hooks/useTodoCreateModal.tsx b/src/features/todo/hooks/useTodoCreateModal.tsx
index 8cc6207e..10538587 100644
--- a/src/features/todo/hooks/useTodoCreateModal.tsx
+++ b/src/features/todo/hooks/useTodoCreateModal.tsx
@@ -4,16 +4,16 @@ import { useQuery, useSuspenseQuery } from "@tanstack/react-query";
import { useParams } from "next/navigation";
import { userQueries } from "@/entities/auth/query/user.queryKey";
-import { goalQueries } from "@/entities/goal/query/goal.queryKey";
-import { teamQueries } from "@/entities/team/query/team.queryKey";
-import { Member } from "@/entities/team/types/types";
+import { goalQueryOptions } from "@/entities/goal";
+import type { Member } from "@/entities/team";
+import { teamQueryOptions } from "@/entities/team";
import { useGoalId } from "@/features/goal/hooks/useGoalId";
+import { AssigneeSelect } from "@/features/todo/ui/AssigneeSelect";
import { useOverlay } from "@/shared/hooks/useOverlay";
import Button from "@/shared/ui/Button/Button/Button";
import Input from "@/shared/ui/Input";
import { Modal } from "@/shared/ui/Modal";
import { Spacing } from "@/shared/ui/Spacing";
-import { AssigneeSelect } from "@/widgets/todo/AssigneeSelect";
import { useCreateTodoForm } from "./useCreateTodoForm";
@@ -207,9 +207,9 @@ export const useTodoCreateModal = () => {
const goalId = useGoalId();
const {
data: { goalName },
- } = useSuspenseQuery(goalQueries.getSummary(goalId));
+ } = useSuspenseQuery(goalQueryOptions.getSummary(goalId));
const { data: teamSummary } = useQuery({
- ...teamQueries.summary(teamId ?? ""),
+ ...teamQueryOptions.summary(teamId ?? ""),
enabled: Boolean(teamId),
});
@@ -219,7 +219,7 @@ export const useTodoCreateModal = () => {
});
const { data: teamMemberList } = useQuery({
- ...teamQueries.memberList(teamId ?? ""),
+ ...teamQueryOptions.memberList(teamId ?? ""),
enabled: Boolean(teamId),
});
diff --git a/src/features/todo/hooks/useTodoDeleteModal.tsx b/src/features/todo/hooks/useTodoDeleteModal.tsx
index 290c5274..e3c67445 100644
--- a/src/features/todo/hooks/useTodoDeleteModal.tsx
+++ b/src/features/todo/hooks/useTodoDeleteModal.tsx
@@ -1,6 +1,6 @@
"use client";
-import { todoApi } from "@/entities/todo/api/api";
+import { todoApi } from "@/entities/todo";
import { useGoalId } from "@/features/goal/hooks/useGoalId";
import { useOverlay } from "@/shared/hooks/useOverlay";
import Button from "@/shared/ui/Button/Button/Button";
diff --git a/src/features/todo/hooks/useTodoDetailModal.tsx b/src/features/todo/hooks/useTodoDetailModal.tsx
index 05c98997..61a86d8d 100644
--- a/src/features/todo/hooks/useTodoDetailModal.tsx
+++ b/src/features/todo/hooks/useTodoDetailModal.tsx
@@ -4,9 +4,9 @@ import { useQuery, useSuspenseQuery } from "@tanstack/react-query";
import Image from "next/image";
import { useParams } from "next/navigation";
-import { goalQueries } from "@/entities/goal/query/goal.queryKey";
-import { teamQueries } from "@/entities/team/query/team.queryKey";
-import { Todo } from "@/entities/todo/types/types";
+import { goalQueryOptions } from "@/entities/goal";
+import { teamQueryOptions } from "@/entities/team";
+import type { Todo } from "@/entities/todo";
import { useGoalId } from "@/features/goal/hooks/useGoalId";
import defaultAvatar from "@/shared/assets/images/avatar.png";
import { useOverlay } from "@/shared/hooks/useOverlay";
@@ -136,9 +136,9 @@ export const useTodoDetailModal = ({ todo }: { todo: Todo }) => {
const goalId = useGoalId();
const {
data: { goalName },
- } = useSuspenseQuery(goalQueries.getSummary(goalId));
+ } = useSuspenseQuery(goalQueryOptions.getSummary(goalId));
const { data: teamSummary } = useQuery({
- ...teamQueries.summary(teamId ?? ""),
+ ...teamQueryOptions.summary(teamId ?? ""),
enabled: Boolean(teamId),
});
diff --git a/src/features/todo/mutation/useCreateTodoMutation.ts b/src/features/todo/mutation/useCreateTodoMutation.ts
index d9451369..ef60f60f 100644
--- a/src/features/todo/mutation/useCreateTodoMutation.ts
+++ b/src/features/todo/mutation/useCreateTodoMutation.ts
@@ -1,14 +1,14 @@
import { useMutation } from "@tanstack/react-query";
import { useQueryClient } from "@tanstack/react-query";
-import { todoApi } from "@/entities/todo/api/api";
-import { CreateTodoInput } from "@/entities/todo/types/types";
+import type { CreateTodoRequest } from "@/entities/todo";
+import { todoApi } from "@/entities/todo";
import { useToast } from "@/shared/hooks/useToast";
import type { ApiError } from "@/shared/lib/api/types";
type CreateTodoVariables = {
goalId: string;
- todoData: CreateTodoInput;
+ todoData: CreateTodoRequest;
};
export const useCreateTodoMutation = () => {
diff --git a/src/features/todo/mutation/usePatchTodoStatusMutation.ts b/src/features/todo/mutation/usePatchTodoStatusMutation.ts
index 33c1b40f..fabbdb7a 100644
--- a/src/features/todo/mutation/usePatchTodoStatusMutation.ts
+++ b/src/features/todo/mutation/usePatchTodoStatusMutation.ts
@@ -2,17 +2,13 @@
import { useMutation, useQueryClient } from "@tanstack/react-query";
-import { todoApi } from "@/entities/todo/api/api";
-import type {
- Todo,
- TodoStatus,
- UpdateTodoInput,
-} from "@/entities/todo/types/types";
+import type { Todo, TodoStatus, UpdateTodoRequest } from "@/entities/todo";
+import { todoApi } from "@/entities/todo";
type PatchTodoStatusVariables = {
goalId: string;
todoId: string;
- todoData: UpdateTodoInput;
+ todoData: UpdateTodoRequest;
};
export const usePatchTodoStatusMutation = () => {
diff --git a/src/features/todo/ui/AssigneeSelect/index.test.tsx b/src/features/todo/ui/AssigneeSelect/index.test.tsx
new file mode 100644
index 00000000..2594e4f7
--- /dev/null
+++ b/src/features/todo/ui/AssigneeSelect/index.test.tsx
@@ -0,0 +1,275 @@
+import { render, screen, within } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+
+import { AssigneeSelect } from "./index";
+
+jest.mock("next/image", () => ({
+ __esModule: true,
+ default: ({ src, alt }: { src: string; alt: string }) => (
+ 
+ ),
+}));
+
+jest.mock("@/shared/ui/Icon", () => ({
+ Icon: ({ name }: { name: string }) => ,
+}));
+
+jest.mock("@/shared/assets/images/avatar.png", () => ({
+ src: "/avatar-fallback.png",
+}));
+
+const members = [
+ {
+ id: 1,
+ userId: 101,
+ userEmail: "alice@test.com",
+ profileImageUrl: "https://example.com/alice.jpg",
+ userNickname: "Alice",
+ role: "MEMBER" as const,
+ joinedAt: "2026-01-01T00:00:00Z",
+ },
+ {
+ id: 2,
+ userId: 102,
+ userEmail: "bob@test.com",
+ profileImageUrl: null,
+ userNickname: "Bob",
+ role: "ADMIN" as const,
+ joinedAt: "2026-01-01T00:00:00Z",
+ },
+];
+
+describe("AssigneeSelect", () => {
+ describe("초기 상태", () => {
+ test("선택된 멤버가 없으면 기본 플레이스홀더를 표시한다", () => {
+ render(
+ ("");
+ const { mutate: createGoal } = useCreatePersonalGoalMutation({
+ onSuccess: () => router.back(),
+ });
- const handleSubmit = async (e: React.FormEvent) => {
+ const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
const formData = new FormData(e.currentTarget);
- const parsed = createGoalCreateSchema.safeParse({
+ const parsed = createGoalSchema.safeParse({
name: String(formData.get("name") ?? ""),
- date: String(formData.get("date") ?? ""),
+ dueDate: String(formData.get("dueDate") ?? ""),
});
if (!parsed.success) {
const fieldErrors = parsed.error.flatten().fieldErrors;
@@ -30,14 +31,7 @@ export const PersonalCreateForm = () => {
return;
}
- await goalApi.createPersonalGoal({
- name: formData.get("name") as string,
- dueDate: formData.get("date") as string,
- type: "PERSONAL",
- });
- await queryClient.invalidateQueries({ queryKey: ["personal", "goals"] });
-
- router.back();
+ createGoal({ name: parsed.data.name, dueDate: parsed.data.dueDate });
};
return (
@@ -67,7 +61,7 @@ export const PersonalCreateForm = () => {
-
+
+
+ ))}
+
+ )}
{
const router = useRouter();
- const queryClient = useQueryClient();
const teamId = useTeamId();
const [goalNameError, setGoalNameError] = useState("");
+ const { mutate: createGoal } = useCreateTeamGoalMutation({
+ onSuccess: () => router.back(),
+ });
- const handleSubmit = async (e: React.FormEvent) => {
+ const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
const formData = new FormData(e.currentTarget);
- const parsed = createGoalCreateSchema.safeParse({
+ const parsed = createGoalSchema.safeParse({
name: String(formData.get("name") ?? ""),
- date: String(formData.get("date") ?? ""),
+ dueDate: String(formData.get("dueDate") ?? ""),
});
if (!parsed.success) {
@@ -34,16 +35,11 @@ export const TeamCreateForm = () => {
}
setGoalNameError("");
-
- await goalApi.createTeamGoal({
+ createGoal({
name: parsed.data.name,
- dueDate: parsed.data.date,
+ dueDate: parsed.data.dueDate,
teamId: Number(teamId),
- type: "TEAM",
});
- await queryClient.invalidateQueries({ queryKey: ["teams", "all"] });
-
- router.back();
};
return (
@@ -73,7 +69,7 @@ export const TeamCreateForm = () => {
{}}
+ />,
+ );
+
+ expect(screen.getByText("서버 오류가 발생했습니다.")).toBeInTheDocument();
+ });
+
+ test("다시 요청하기 버튼 클릭 시 onReset이 호출된다", async () => {
+ const onReset = jest.fn();
+
+ render(
+ ;
+const mockUseGoalActions = useGoalActions as jest.MockedFunction<
+ typeof useGoalActions
+>;
+
+const mockSummary = {
+ goalId: 1,
+ goalName: "디자인 시스템 완성",
+ dueDate: "2026-12-31",
+ dDay: 42,
+ progressPercent: 68,
+};
+
+const makeQueryClient = () =>
+ new QueryClient({ defaultOptions: { queries: { retry: false } } });
+
+const createWrapper = (queryClient: QueryClient) => {
+ function Wrapper({ children }: { children: React.ReactNode }) {
+ return (
+
+ loading }>{children}
+
+ );
+ }
+ return Wrapper;
+};
+
+describe("GoalInfo", () => {
+ beforeEach(() => {
+ mockUseParams.mockReturnValue({
+ goalId: "1",
+ } as ReturnType);
+
+ mockUseGoalActions.mockReturnValue({
+ openEditModal: jest.fn(),
+ openDeleteConfirm: jest.fn(),
+ isMutationPending: false,
+ });
+ });
+
+ const renderGoalInfo = () => {
+ const queryClient = makeQueryClient();
+ queryClient.setQueryData(["goal", "1", "summary"], mockSummary);
+ return render((null);
-
- const { data: summary } = useSuspenseQuery(goalQueries.getSummary(goalId));
-
- const deleteMutation = useDeleteGoalMutation({
- goalId,
- teamId,
- onDeleted: () => overlay.close(),
- });
- const updateMutation = useUpdateGoalMutation({
- goalId,
- teamId,
- onUpdated: () => overlay.close(),
- });
-
- const openEditModal = () => {
- setOptionOpen(false);
- overlay.open(
- GOAL_EDIT_MODAL_ID,
- overlay.close()}
- isPending={updateMutation.isPending}
- onSave={(input) => updateMutation.mutate(input)}
- />,
- );
- };
+ const { data: summary } = useSuspenseQuery(
+ goalQueryOptions.getSummary(goalId),
+ );
- const openDeleteConfirm = () => {
- setOptionOpen(false);
- overlay.open(
- GOAL_DELETE_MODAL_ID,
- overlay.close()}
- onConfirm={() => deleteMutation.mutate()}
- />,
- );
- };
+ const { openEditModal, openDeleteConfirm, isMutationPending } =
+ useGoalActions({
+ goalId,
+ teamId,
+ summary,
+ onMenuClose: () => setOptionOpen(false),
+ });
return (
-
+ );
+}
+
+// --- internal component ---
+
+type GoalOptionMenuProps = {
+ isOpen: boolean;
+ isPending: boolean;
+ onToggle: () => void;
+ onEdit: () => void;
+ onDelete: () => void;
+};
+
+const GOAL_ACTIONS: { key: "edit" | "delete"; label: string }[] = [
+ { key: "edit", label: "목표 수정" },
+ { key: "delete", label: "목표 삭제" },
+];
+
+function GoalOptionMenu({
+ isOpen,
+ isPending,
+ onToggle,
+ onEdit,
+ onDelete,
+}: GoalOptionMenuProps) {
+ const handleAction = (key: "edit" | "delete") => {
+ if (key === "edit") onEdit();
+ else onDelete();
+ };
- {optionOpen && (
-
{
+ function Wrapper({ children }: { children: React.ReactNode }) {
+ return (
+
+ loading
}>{children}
+
+ );
+ }
+
+ return Wrapper;
+};
+
+const makeQueryClient = () =>
+ new QueryClient({ defaultOptions: { queries: { retry: false } } });
+
+describe("HeadingContent", () => {
+ test("닉네임을 포함한 인사말을 렌더링한다", () => {
+ const queryClient = makeQueryClient();
+ queryClient.setQueryData(userQueries.myInfo().queryKey, {
+ id: 1,
+ email: "test@test.com",
+ nickname: "테스터",
+ profileImageUrl: null,
+ provider: "LOCAL",
+ createdAt: "2026-01-01T00:00:00Z",
+ });
+
+ render(
+
+ );
+}
diff --git a/src/widgets/goal/Heading/Error.test.tsx b/src/widgets/goal/Heading/Error.test.tsx
new file mode 100644
index 00000000..d7979511
--- /dev/null
+++ b/src/widgets/goal/Heading/Error.test.tsx
@@ -0,0 +1,36 @@
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+
+import HeadingError from "./Error";
+
+describe("HeadingError", () => {
+ test("에러 메시지를 렌더링한다", () => {
+ const error = new Error("서버 오류가 발생했습니다.");
+
+ render(
+ + {nickname}님! +
+ + + 목표와 할 일을 확인해보세요! + +
-
+ - {nickname}님! -
- - - 목표와 할 일을 확인해보세요! - -
-
+ setOptionOpen((prev) => !prev)}
+ onEdit={openEditModal}
+ onDelete={openDeleteConfirm}
+ />
+
+ -
+
+
+ {isOpen && (
+
- - {GOAL_ACTIONS.map((label) => ( -
- { - if (label === "목표 수정") openEditModal(); - else openDeleteConfirm(); - }} - > - - {label} - - - ))} -
-
+ {GOAL_ACTIONS.map(({ key, label }) => (
+
+
+
@@ -57,63 +83,26 @@ export const TodoSection = () => {
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
-
-
-
-
- 생성된 할 일이 없어요
-+
새로운 할 일을 만들고 관리해보세요
diff --git a/src/widgets/team/TodoSection/state/Error.tsx b/src/widgets/todo/TodoSection/state/Error.tsx similarity index 92% rename from src/widgets/team/TodoSection/state/Error.tsx rename to src/widgets/todo/TodoSection/state/Error.tsx index d3aee798..b5c936f2 100644 --- a/src/widgets/team/TodoSection/state/Error.tsx +++ b/src/widgets/todo/TodoSection/state/Error.tsx @@ -27,7 +27,7 @@ export const Error = ({ error, onReset }: TodoSectionErrorProps) => {할 일 목록을 불러오지 못했어요
-+
{error.message}
diff --git a/src/widgets/team/TodoSection/state/Loading.tsx b/src/widgets/todo/TodoSection/state/Loading.tsx similarity index 83% rename from src/widgets/team/TodoSection/state/Loading.tsx rename to src/widgets/todo/TodoSection/state/Loading.tsx index 853ff321..21a106be 100644 --- a/src/widgets/team/TodoSection/state/Loading.tsx +++ b/src/widgets/todo/TodoSection/state/Loading.tsx @@ -12,7 +12,7 @@ export const Loading = () => { size={48} aria-label="할 일 목록 로딩 중" /> -+
할 일 목록을 불러오고 있어요
diff --git a/src/widgets/team/TodoSection/state/Wrapper.tsx b/src/widgets/todo/TodoSection/state/Wrapper.tsx similarity index 100% rename from src/widgets/team/TodoSection/state/Wrapper.tsx rename to src/widgets/todo/TodoSection/state/Wrapper.tsx