사이드바 반응형 구현

.vscode/settings.json

@@ -0,0 +1,2 @@
+{
+}

Mocks/ReservationView.mock.ts

@@ -0,0 +1,55 @@
+import type { Reservation } from "../types/reservationview.types";
+
+// TODO: API 연동 시 삭제
+export const RESERVATION_MOCK_LIST: Reservation[] = [
+  {
+    id: 1,
+    title: "함께 배우는 플로잉 댄스",
+    date: "2023.02.14 · 11:00 - 12:30",
+    price: 10000,
+    people: 1,
+    status: "pending",
+  },
+  {
+    id: 2,
+    title: "내 강아지 인생 사진 찍어주기",
+    date: "2023.02.11 · 13:00 - 14:00",
+    price: 35000,
+    people: 1,
+    status: "canceled",
+  },
+  {
+    id: 3,
+    title: "이색 액티비티 체험",
+    date: "2023.01.10 · 10:00 - 12:00",
+    price: 60000,
+    people: 3,
+    status: "declined",
+  },
+  {
+    id: 4,
+    title: "별과 함께하는 북촌 체험",
+    date: "2023.01.14 · 15:00 - 16:00",
+    price: 40000,
+    people: 2,
+    status: "completed",
+    reviewWritten: true,
+  },
+  {
+    id: 5,
+    title: "요리 클래스 체험",
+    date: "2023.09.20 · 09:00 - 10:30",
+    price: 25000,
+    people: 1,
+    status: "completed",
+    reviewWritten: false,
+  },
+  {
+    id: 6,
+    title: "여행 클래스 체험",
+    date: "2023.11.20 · 09:00 - 10:30",
+    price: 37000,
+    people: 1,
+    status: "confirmed",
+  },
+];

Mocks/detail/activity-reviews.mock.ts

@@ -0,0 +1,92 @@
+import type { ReviewResponse } from "@/types/reviews/review.types";
+
+export const mockActivityReviewsResponse: ReviewResponse = {
+  averageRating: 4.3,
+  totalCount: 6,
+  reviews: [
+    {
+      id: 101,
+      user: {
+        profileImageUrl: "https://picsum.photos/seed/user101/80/80",
+        nickname: "댄스초보",
+        id: 9001,
+      },
+      activityId: 777,
+      rating: 5,
+      content:
+        "처음인데도 동작을 단계별로 잘 풀어주셔서 부담이 없었어요. 분위기도 좋아서 시간 금방 갔습니다!",
+      createdAt: "2025-12-10T12:20:00.000Z",
+      updatedAt: "2025-12-10T12:20:00.000Z",
+    },
+    {
+      id: 102,
+      user: {
+        profileImageUrl: "https://picsum.photos/seed/user102/80/80",
+        nickname: "퇴근후한시간",
+        id: 9002,
+      },
+      activityId: 777,
+      rating: 4,
+      content:
+        "리듬감 없는 편인데도 따라가기 쉬웠어요. 마지막에 짧게 루틴 맞춰보는 게 재미있었습니다.",
+      createdAt: "2025-12-11T09:05:00.000Z",
+      updatedAt: "2025-12-11T09:05:00.000Z",
+    },
+    {
+      id: 103,
+      user: {
+        profileImageUrl: "https://picsum.photos/seed/user103/80/80",
+        nickname: "주말취미러",
+        id: 9003,
+      },
+      activityId: 777,
+      rating: 5,
+      content:
+        "음악 선곡이 좋고, 자세 교정도 꼼꼼합니다. 사진/영상 찍을 시간도 주셔서 만족!",
+      createdAt: "2025-12-12T15:40:00.000Z",
+      updatedAt: "2025-12-12T15:40:00.000Z",
+    },
+    {
+      id: 104,
+      user: {
+        profileImageUrl: "https://picsum.photos/seed/user104/80/80",
+        nickname: "몸치탈출",
+        id: 9004,
+      },
+      activityId: 777,
+      rating: 3,
+      content:
+        "난이도는 무난했는데 제가 체력이 부족해서 중간에 숨 찼네요. 그래도 친절해서 좋았습니다.",
+      createdAt: "2025-12-13T18:12:00.000Z",
+      updatedAt: "2025-12-13T18:12:00.000Z",
+    },
+    {
+      id: 105,
+      user: {
+        profileImageUrl: "https://picsum.photos/seed/user105/80/80",
+        nickname: "스트릿감성",
+        id: 9005,
+      },
+      activityId: 777,
+      rating: 4,
+      content:
+        "공간이 깔끔하고 미러/음향도 괜찮아요. 다음에는 다른 장르 클래스도 듣고 싶습니다.",
+      createdAt: "2025-12-15T06:30:00.000Z",
+      updatedAt: "2025-12-15T06:30:00.000Z",
+    },
+    {
+      id: 106,
+      user: {
+        profileImageUrl: "https://picsum.photos/seed/user106/80/80",
+        nickname: "리뷰요정",
+        id: 9006,
+      },
+      activityId: 777,
+      rating: 5,
+      content:
+        "설명→연습→피드백 흐름이 좋아요. 초보자 기준으로 포인트를 딱딱 집어줘서 확실히 배우는 느낌!",
+      createdAt: "2025-12-18T10:01:00.000Z",
+      updatedAt: "2025-12-18T10:01:00.000Z",
+    },
+  ],
+};

Mocks/detail/activityDetail.mock.ts

@@ -0,0 +1,39 @@
+export const mockActivityDetail = {
+  id: 7,
+  userId: 21,
+  title: "함께 배우면 즐거운 스트릿댄스",
+  description: "둠칫 둠칫 두둠칫",
+  category: "투어",
+  price: 10000,
+  address: "서울특별시 강남구 테헤란로 427",
+  bannerImageUrl: "/mock/mock1.png",
+  subImages: [
+    {
+      id: 1,
+      imageUrl: "/mock/mock2.png",
+    },
+    {
+      id: 2,
+      imageUrl: "/mock/mock3.png",
+    },
+    {
+      id: 3,
+      imageUrl: "/mock/mock4.png",
+    },
+    {
+      id: 4,
+      imageUrl: "/mock/mock5.png",
+    },
+  ],
+  schedules: [
+    { id: 1, date: "2026-01-01", startTime: "12:00", endTime: "13:00" },
+    { id: 2, date: "2026-01-05", startTime: "12:00", endTime: "13:00" },
+  ],
+  subImageUrls: [
+    "https://sprint-fe-project.s3.ap-northeast-2.amazonaws.com/globalnomad/activity_registration_image/b.png",
+  ],
+  reviewCount: 5,
+  rating: 4.74,
+  createdAt: "2026-01-10T21:28:50.589Z",
+  updatedAt: "2026-01-10T21:28:50.589Z",
+} as const;

Mocks/detail/availableSchedule.mock.ts

@@ -0,0 +1,19 @@
+import { AvailableScheduleItem } from "@/types/reservation/types";
+
+export const MOCK_AVAILABLE_SCHEDULE: AvailableScheduleItem[] = [
+  {
+    date: "2026-01-15",
+    times: [
+      { id: 1, startTime: "14:00", endTime: "15:00" },
+      { id: 2, startTime: "15:00", endTime: "16:00" },
+    ],
+  },
+  {
+    date: "2026-01-22",
+    times: [{ id: 3, startTime: "10:00", endTime: "11:30" }],
+  },
+  {
+    date: "2026-02-02",
+    times: [{ id: 4, startTime: "14:00", endTime: "19:30" }],
+  },
+];

Mocks/detail/reservations.mock.ts

@@ -0,0 +1,26 @@
+export type CreateReservationBody = {
+  scheduleId: number;
+  headCount: number;
+};
+
+export const MOCK_CREATE_RESERVATION_BODY: CreateReservationBody = {
+  scheduleId: 2,
+  headCount: 10,
+};
+
+export const MOCK_RESERVATION_RESPONSE = {
+  id: 1,
+  teamId: "team_01",
+  userId: 1,
+  activityId: 1,
+  scheduleId: 2,
+  status: "pending",
+  reviewSubmitted: false,
+  totalPrice: 10000,
+  headCount: 10,
+  date: "2025-11-04",
+  startTime: "15:00",
+  endTime: "16:00",
+  createdAt: "2025-12-24T08:38:28.312Z",
+  updatedAt: "2025-12-24T08:38:28.312Z",
+} as const;

app/activities/[id]/error.tsx

@@ -0,0 +1,25 @@
+// app/activities/[id]/error.tsx
+"use client";
+
+export default function Error({
+  error,
+  reset,
+}: {
+  error: Error & { digest?: string };
+  reset: () => void;
+}) {
+  return (
+    <main className="max-w-[1200px] mx-auto px-6 mt-[34px] mb-45">
+      <p className="text-18-b text-gray-950">문제가 발생했습니다.</p>
+      <p className="text-14-body-m text-gray-600 mt-2">{error.message}</p>
+
+      <button
+        type="button"
+        className="mt-6 px-4 py-2 rounded-xl bg-gray-900 text-white"
+        onClick={() => reset()}
+      >
+        다시 시도
+      </button>
+    </main>
+  );
+}