[#49]관광지 상세 페이지

app/(tabs)/myPage/index.tsx

@@ -10,10 +10,12 @@ import LastTripIcon from "@/assets/icons/last-trip-icon.svg";
 import MyStoryIcon from "@/assets/icons/mystory-icon.svg";
 
 import { useAuthStore } from "@/store/useAuthStore";
+import { useBookmarkStore } from "@/store/useBookmarkStore";
 
 export default function MyPageIndex() {
   const router = useRouter();
   const { isLogined, user, logout } = useAuthStore();
+  const { resetUserBookmarkList } = useBookmarkStore();
 
   const handleLogout = () => {
     Alert.alert("로그아웃", "정말 로그아웃 하시겠습니까?", [
@@ -28,6 +30,7 @@ export default function MyPageIndex() {
           try {
             await logout();
             Alert.alert("알림", "로그아웃 되었습니다.");
+            resetUserBookmarkList();
           } catch (error) {
             console.error(error);
             Alert.alert("오류", "로그아웃 처리 중 문제가 발생했습니다.");

app/(tabs)/myPage/login.tsx

@@ -1,13 +1,14 @@
 import React, { useState } from "react";
 
-import { Alert, Platform,TouchableOpacity  } from "react-native";
+import { Alert, Platform, TouchableOpacity } from "react-native";
 
 import { useRouter } from "expo-router";
 import styled from "styled-components/native";
 
 import Button from "@/components/common/Button";
 import Input from "@/components/common/Input";
 
+import { useBookmark } from "@/hooks/sight/useBookmark";
 import { useAppleLogin } from "@/hooks/useAppleLogin";
 
 import { theme } from "@/styles/theme";
@@ -22,7 +23,12 @@ export default function Login() {
   const [isLoading, setIsLoading] = useState(false);
   const router = useRouter();
   const { login } = useAuthStore();
-  const { handleAppleLogin, isLoading: isAppleLoading, error: appleError } = useAppleLogin();
+  const { fetchBookmark } = useBookmark();
+  const {
+    handleAppleLogin,
+    isLoading: isAppleLoading,
+    error: appleError,
+  } = useAppleLogin();
   const isIOS = Platform.OS === "ios";
 
   const handleLogin = async () => {
@@ -34,6 +40,7 @@ export default function Login() {
     try {
       setIsLoading(true);
       await login({ email, password });
+      fetchBookmark();
       router.back();
     } catch (error: any) {
       Alert.alert("로그인 실패", "이메일 또는 비밀번호를 확인해주세요.");

src/api/sight/getSightBookMark.ts

@@ -0,0 +1,66 @@
+import { BaseResponse, User } from "@/types/auth";
+import {
+  BookmarkEditResponse,
+  BookmarkInfoList,
+  BookmarkInfoRequest,
+} from "@/types/bookmark";
+
+import API_ENDPOINTS from "@/constants/endpoints";
+
+import api from "../axios";
+
+//북마크 추가
+export const getAddBookmark = async (
+  sightId: string,
+  userId: number
+): Promise<BookmarkEditResponse> => {
+  try {
+    const response = await api.post<BaseResponse<BookmarkEditResponse>>(
+      API_ENDPOINTS.SIGHT.BOOKMARK.ADD(sightId),
+      {},
+      {
+        headers: {
+          "X-USER-ID": userId,
+        },
+      }
+    );
+    return response.data.data;
+  } catch (error) {
+    throw error;
+  }
+};
+
+//북마크 삭제
+export const getDeleteBookmark = async (
+  sightId: string,
+  userId: number
+): Promise<BookmarkEditResponse> => {
+  try {
+    const response = await api.delete<BaseResponse<BookmarkEditResponse>>(
+      API_ENDPOINTS.SIGHT.BOOKMARK.DELETE(sightId),
+      {
+        headers: {
+          "X-USER_ID": userId,
+        },
+      }
+    );
+    return response.data.data;
+  } catch (error) {
+    throw error;
+  }
+};
+
+//북마크 리스트 보기
+export const getBookmarkInfo = async (
+  param: BookmarkInfoRequest | undefined
+) => {
+  try {
+    const response = await api.get<BaseResponse<BookmarkInfoList>>(
+      `${API_ENDPOINTS.SIGHT.BOOKMARK.GET_BOOKMARK}`,
+      { params: param }
+    );
+    return response.data.data;
+  } catch (error) {
+    throw error;
+  }
+};

src/components/common/AddressLabel.tsx

@@ -10,6 +10,10 @@ interface AddressLabelProps {
   fontSize?: number;
 }
 
+interface TextFontSizeProps {
+  fontSize?: number;
+}
+
 const AddressLabel: React.FC<AddressLabelProps> = ({
   address,
   distance,
@@ -26,14 +30,10 @@ const AddressLabel: React.FC<AddressLabelProps> = ({
 
   return (
     <AddressLavelContainer>
-      <MapPin
-        size={iconSize}
-        fontSize={fontSize}
-        color={theme.colors.text.textPrimary}
-      />
+      <MapPin size={iconSize} color={theme.colors.text.textPrimary} />
       <AddressSection>
-        <Distance>{formatDistance()}</Distance>
-        <Address>{address}</Address>
+        <Distance fontSize={fontSize}>{formatDistance()}</Distance>
+        <Address fontSize={fontSize}>{address}</Address>
       </AddressSection>
     </AddressLavelContainer>
   );
@@ -51,13 +51,15 @@ const AddressSection = styled.View`
   gap: 2px;
 `;
 
-const Distance = styled.Text`
-  font-size: ${theme.typography.fontSize.xs};
+const Distance = styled.Text<TextFontSizeProps>`
+  font-size: ${({ fontSize }) =>
+    fontSize ? `${fontSize}px` : theme.typography.fontSize.xs};
   color: ${theme.colors.text.textSecondary};
 `;
 
-const Address = styled.Text`
-  font-size: ${theme.typography.fontSize.xs};
+const Address = styled.Text<TextFontSizeProps>`
+  font-size: ${({ fontSize }) =>
+    fontSize ? `${fontSize}px` : theme.typography.fontSize.xs};
   color: ${theme.colors.text.textSecondary};
 `;
 

src/components/curation/CurationDetail.tsx

@@ -34,14 +34,12 @@ const CurationDetail: React.FC<CurationDetailProps> = ({
   selectedCurationDescription,
   handleCardPress,
   handleHeaderBackPress,
-  handleHeaderClosePress,
 }) => {
   const {
     setButtonStyle,
     setShowBackButton,
     setShowCloseButton,
     setOnBackPress,
-    setOnClosePress,
   } = useHeaderButtonStore();
   const { isInCart } = useCurationDetail();
   const { insertRouteCartItem, removeRouteCartItem } = useRouteCartStore();
@@ -51,7 +49,7 @@ const CurationDetail: React.FC<CurationDetailProps> = ({
   useEffect(() => {
     setButtonStyle("NONE");
     setShowBackButton(true);
-    setShowCloseButton(true);
+    setShowCloseButton(false);
     setOnBackPress(() => {
       handleHeaderBackPress();
     });