v.2

apps/what-today/package.json

@@ -4,10 +4,10 @@
   "version": "0.0.0",
   "type": "module",
   "scripts": {
-    "dev": "vite",
+    "dev": "vite --host",
     "build": "pnpm --filter @what-today/design-system... build && tsc -b && vite build",
     "lint": "eslint .",
-    "preview": "vite preview"
+    "preview": "vite preview --host"
   },
   "dependencies": {
     "@hookform/resolvers": "^5.1.1",

apps/what-today/src/apis/activities.ts

@@ -4,6 +4,7 @@ import axiosInstance from './axiosInstance';
 
 // ✅ 체험(Activity) 타입 정의 (category 추가)
 export interface Activity {
+  createdAt?: string | number | Date;
   id: number;
   title: string;
   price: number;
@@ -29,6 +30,7 @@ export const activityListSchema = z.array(
     reviewCount: z.number(),
     bannerImageUrl: z.string().url(),
     category: z.string(),
+    createdAt: z.string(),
   }),
 );
 

apps/what-today/src/apis/activityDetail.ts

@@ -1,4 +1,9 @@
-import { type ActivityWithSubImagesAndSchedules, activityWithSubImagesAndSchedulesSchema } from '@/schemas/activities';
+import {
+  type ActivityWithSubImagesAndSchedules,
+  activityWithSubImagesAndSchedulesSchema,
+  type Schedules,
+  schedulesSchema,
+} from '@/schemas/activities';
 import { type ActivityReviewsResponse, activityReviewsResponseSchema } from '@/schemas/activityReview';
 import {
   type CreateReservationBodyDto,
@@ -26,6 +31,23 @@ export const fetchActivityReviews = async (activityId: number): Promise<Activity
   return activityReviewsResponseSchema.parse(response.data);
 };
 
+/**
+ * @description 무한스크롤용 체험 리뷰 목록을 조회합니다.
+ * @param activityId 체험 ID
+ * @param page 페이지 번호 (기본값: 1)
+ * @param size 페이지 크기 (기본값: 10)
+ */
+export const fetchActivityReviewsInfinite = async (
+  activityId: number,
+  page: number = 1,
+  size: number = 10,
+): Promise<ActivityReviewsResponse> => {
+  const response = await axiosInstance.get(`/activities/${activityId}/reviews`, {
+    params: { page, size },
+  });
+  return activityReviewsResponseSchema.parse(response.data);
+};
+
 /**
  * @description 체험 예약 생성 요청
  * @param activityId 체험 ID
@@ -38,3 +60,22 @@ export const createReservation = async (
   const response = await axiosInstance.post(`/activities/${activityId}/reservations`, body);
   return reservationResponseSchema.parse(response.data);
 };
+
+// ✅ 체험 예약 가능일 리스트 조회 시 사용되는 파라미터 타입
+export interface ReservationAvailableScheduleParams {
+  year: string;
+  month: string;
+}
+
+/**
+ * @description 체험 예약 가능일 리스트를 불러옵니다.
+ * @param activityId 체험 ID
+ * @returns ActivityWithSubImagesAndSchedules 타입의 체험 상세 데이터
+ */
+export const fetchReservationAvailableSchedule = async (
+  activityId: number,
+  params: ReservationAvailableScheduleParams,
+): Promise<Schedules> => {
+  const response = await axiosInstance.get(`/activities/${activityId}/available-schedule`, { params });
+  return schedulesSchema.parse(response.data);
+};

apps/what-today/src/apis/experiences.ts

@@ -1,4 +1,8 @@
-import { type CreateActivityBody, type UpdateMyActivityBody } from '@/schemas/experiences'; // 스키마 정의된 파일 기준 경로로 수정하세요
+import {
+  type ActivityWithSchedulesResponse,
+  type CreateActivityBody,
+  type UpdateMyActivityBody,
+} from '@/schemas/experiences';
 
 import axiosInstance from './axiosInstance';
 
@@ -15,3 +19,49 @@ export const patchActivity = async (activityId: number, body: UpdateMyActivityBo
 
 //  createActivityBodySchema,   parse를 여기서 관리하지 말고 페이지 handleSubmit에서 관리
 //  updateMyActivityBodySchema,
+
+/**
+ * @description 체험 이미지 url 생성
+ *
+ * @param file 업로드할 체험 이미지 파일
+ * @returns 체험 이미지 url (string)
+ */
+export const uploadImage = async (file: File): Promise<{ file: string }> => {
+  const formData = new FormData();
+  formData.append('image', file);
+
+  const response = await axiosInstance.post('activities/image', formData, {
+    headers: {
+      'Content-Type': 'multipart/form-data',
+    },
+  });
+
+  return { file: response.data.activityImageUrl };
+};
+
+/**
+ * @description 체험 등록
+ *
+ * @param body 등록할 체험 데이터
+ * @returns 체험 등록 데이터
+ */
+export const postExperiences = async (body: CreateActivityBody): Promise<ActivityWithSchedulesResponse> => {
+  const response = await axiosInstance.post('activities', body);
+
+  return response.data;
+};
+
+/**
+ * @description 체험 수정
+ *
+ * @param body 등록할 체험 수정 데이터
+ * @returns 체험 수정 데이터
+ */
+export const patchExperiences = async (
+  body: UpdateMyActivityBody,
+  activityId?: string,
+): Promise<ActivityWithSchedulesResponse> => {
+  const response = await axiosInstance.patch(`my-activities/${activityId}`, body);
+
+  return response.data;
+};

apps/what-today/src/apis/myActivities.ts

@@ -7,8 +7,6 @@ import {
   type monthlyScheduleParam,
   type monthlyScheduleResponse,
   monthlyScheduleResponseSchema,
-  type reservation,
-  reservationSchema,
   type timeSlotReservationParam,
   type timeSlotReservationResponse,
   timeSlotReservationResponseSchema,
@@ -50,9 +48,8 @@ export async function patchReservationStatus(
   activityId: number,
   reservationId: number,
   status: ManageableReservationStatus,
-): Promise<reservation> {
-  const response = await axiosInstance.patch(`/my-activities/${activityId}/reservations/${reservationId}`, { status });
-  return reservationSchema.parse(response.data);
+): Promise<void> {
+  await axiosInstance.patch(`/my-activities/${activityId}/reservations/${reservationId}`, { status });
 }
 
 export const deleteMyActivity = async (activityId: number) => {

apps/what-today/src/components/FlagIcon.tsx

@@ -0,0 +1,34 @@
+import React from 'react';
+
+interface FlagIconProps {
+  flagCode: string;
+  alt?: string;
+  className?: string;
+  size?: 'sm' | 'md' | 'lg';
+}
+
+const FlagIcon: React.FC<FlagIconProps> = ({ flagCode, alt = 'Flag', className = '', size = 'md' }) => {
+  const sizeClasses = {
+    sm: 'w-30 h-30',
+    md: 'w-40 h-40',
+    lg: 'w-50 h-50',
+  };
+
+  const flagUrl = `https://cdn.weglot.com/flags/square/${flagCode}.svg`;
+
+  return (
+    <img
+      alt={alt}
+      className={`inline-block rounded-lg object-cover ${sizeClasses[size]} ${className}`}
+      src={flagUrl}
+      onError={(e) => {
+        // 이미지 로드 실패 시 기본 아이콘으로 대체
+        const target = e.target as HTMLImageElement;
+        target.src =
+          'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"/><path d="m9 9 5 12 1.5-2.75L17 16l-5-12-1.5 2.75L9 9z"/></svg>';
+      }}
+    />
+  );
+};
+
+export default FlagIcon;