[feat] 프로필 수정 api 연결

package.json

@@ -15,6 +15,7 @@
     "@tanstack/react-query-devtools": "^5.84.1",
     "axios": "^1.11.0",
     "clsx": "^2.1.1",
+    "lodash": "^4.17.21",
     "lottie-react": "^2.4.1",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
@@ -29,6 +30,7 @@
     "@eslint/js": "^9.29.0",
     "@svgr/cli": "^8.1.0",
     "@tailwindcss/vite": "^4.1.11",
+    "@types/lodash": "^4.17.20",
     "@types/node": "^24.0.7",
     "@types/react": "^19.1.8",
     "@types/react-dom": "^19.1.6",

src/api/image/image.api.ts

@@ -36,4 +36,4 @@ const uploadToS3 = async (url: string, file: File): Promise<void> => {
   });
 };
 
-export { getPresignedUrls, uploadToS3 };
+export { getPresignedUrls, uploadToS3 };

src/api/profile/profile.api.ts

@@ -11,4 +11,4 @@ export const getUserProfile = async (): Promise<UserProfile> => {
     console.error('프로필 로딩 에러:', apiError);
     throw apiError;
   }
-};
+};

src/api/user/userEdit.api.ts

@@ -0,0 +1,10 @@
+import api from '@/api/api';
+import type { ApiResponse } from '@/types/api-response';
+import type { UpdateUserProfileRequest, UserProfileResponse } from '@/types/userEdit';
+
+export const updateUserProfile = async (
+  data: UpdateUserProfileRequest
+): Promise<UserProfileResponse> => {
+  const response = await api.patch<ApiResponse<UserProfileResponse>>('/profile', data);
+  return response.data.data;
+};

src/assets/index.tsx

@@ -88,9 +88,9 @@ export {
   SoundIcon,
   EnvironmentIcon,
   CompanionIcon,
-  TicketAlt,
   SmileIcon,
   GalleryProfileIcon,
+  TicketAlt,
   DolbyImage,
   ImaxImage,
   HomeBanner,

src/components/common/ImagePreview/ImagePreviewItem.tsx

@@ -47,4 +47,4 @@ export default function ImagePreviewItem({
       )}
     </div>
   );
-}
+}

src/components/index.tsx

@@ -70,4 +70,3 @@ export {
   TheaterList,
   Loading,
 };
-

src/constants/theater.ts

@@ -0,0 +1,15 @@
+export const THEATER_ID_MAP: Record<string, string> = {
+  'CGV 용산': '13018',
+  '메가박스 성수': '13019',
+  'CGV 강남': '13020',
+  '롯데시네마 홍대': '13021',
+  '메가박스 코엑스': '13022',
+};
+
+export const THEATER_NAME_MAP: Record<string, string> = {
+  '13018': 'CGV 용산',
+  '13019': '메가박스 성수',
+  '13020': 'CGV 강남',
+  '13021': '롯데시네마 홍대',
+  '13022': '메가박스 코엑스',
+};

src/hooks/mutations/usePresignedUrlMutation.ts

@@ -7,4 +7,4 @@ export const usePresignedUrlMutation = () => {
   return useMutation<PresignedUrlInfo[], ApiError, { fileNames: string[] }>({
     mutationFn: ({ fileNames }) => getPresignedUrls(fileNames),
   });
-};
+};

src/hooks/mutations/useUploadToS3Mutation.ts

@@ -11,4 +11,4 @@ export const useUploadToS3Mutation = () => {
   return useMutation<void, ApiError, UploadParams>({
     mutationFn: ({ url, file }) => uploadToS3(url, file),
   });
-};
+};

src/hooks/useImageUpload.ts

@@ -51,4 +51,4 @@ export function useImgUpload(maxCount: number = 5) {
     isMax,
     selectedFiles: images,
   };
-}
+}

src/hooks/useS3UploadFlow.ts

@@ -68,4 +68,4 @@ export const useS3UploadFlow = async (
 //   };
 
 //   return { uploadImagesToS3 };
-// };
+// };

src/pages/my/CinemaChoice.tsx

@@ -1,7 +1,8 @@
 import { useState } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate, useLocation } from 'react-router-dom';
 import { Button, Header, ToggleTab } from '@/components';
 import type { CinemaFormat, CinemaType } from '@/types/onboarding';
+import { THEATER_ID_MAP } from '@/constants/theater';
 
 const IMAX_THEATERS: CinemaType[] = ['CGV 용산', '메가박스 성수'];
 const DOLBY_CINEMA_THEATERS: CinemaType[] = ['CGV 강남', '롯데시네마 홍대', '메가박스 코엑스'];
@@ -15,6 +16,8 @@ const MAX_SELECTABLE_THEATERS = 2;
 
 export default function CinemaChoice() {
   const navigate = useNavigate();
+  const location = useLocation();
+
   const [selectedTheaters, setSelectedTheaters] = useState<CinemaType[]>([]);
   const [activeFormat, setActiveFormat] = useState<CinemaFormat>('Dolby');
 
@@ -32,13 +35,18 @@ export default function CinemaChoice() {
   };
 
   const handleConfirmSelection = () => {
-    console.log('선택된 영화관:', selectedTheaters);
-    navigate(-1);
+    const auditoriumIds = selectedTheaters.map((name) => THEATER_ID_MAP[name]);
+    navigate('/my/profile-edit', {
+      state: {
+        auditoriums: auditoriumIds,
+        nickname: location.state?.nickname,
+        genres: location.state?.genres,
+      },
+    });
   };
 
   const handleFormatSelect = (format: string) => {
-    setActiveFormat(format as CinemaFormat);
-    setSelectedTheaters([]);
+    setActiveFormat(format as CinemaFormat); // ✅ 선택만 바꾸고, 선택 목록 유지
   };
 
   const currentTheaters = THEATERS_BY_FORMAT[activeFormat];
@@ -64,10 +72,9 @@ export default function CinemaChoice() {
             { label: 'Dolby Cinema', value: 'Dolby' },
           ]}
           selected={activeFormat}
-          onSelect={(selectedValue) => handleFormatSelect(selectedValue)}
+          onSelect={handleFormatSelect}
         />
 
-        {/* 영화관 목록 */}
         <div className="mt-4 flex flex-col gap-y-3">
           {currentTheaters.map((theater) => (
             <Button