diff --git a/components/RoomCard/RoomCard.tsx b/components/RoomCard/RoomCard.tsx index 9d229a0..03e6cad 100644 --- a/components/RoomCard/RoomCard.tsx +++ b/components/RoomCard/RoomCard.tsx @@ -33,6 +33,7 @@ const UserInfo = ({ userInfo }: UserInfoProps) => { const age = formatAge(userInfo.birthDate); const handleUserClick = () => { + /* router.push( { pathname: '/userInfo', @@ -40,6 +41,7 @@ const UserInfo = ({ userInfo }: UserInfoProps) => { }, '/userInfo' ); + */ }; return ( @@ -88,7 +90,8 @@ const Footer = ({ room, isLikedRooms }: CardProps) => { const [isLiked, setIsLiked] = useState(false || isLikedRooms); const handleLikeClick = async () => { try { - !isLiked ? await makeLikedRooms(room?.id) : await makeDisLikedRooms(room?.id); + // !isLiked ? await makeLikedRooms(room?.id) : await makeDisLikedRooms(room?.id); + await makeLikedRooms(room?.id); setIsLiked(!isLiked); } catch (error) { console.error('[ERROR] in Liked Clicked', error); diff --git a/pages/index.tsx b/pages/index.tsx index 680a1b5..b97d581 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -1,3 +1,4 @@ +/* eslint-disable no-restricted-syntax */ import React, { useEffect, useRef, useState } from 'react'; import 'tailwindcss/tailwind.css'; import RoomCard from '@/components/RoomCard/RoomCard'; @@ -11,8 +12,7 @@ import useModal from '@/hooks/useModal.ts'; import Filter from '@/components/Filter/Filter.tsx'; import { getRooms } from '@/api/room'; import isEmpty from 'lodash-es/isEmpty'; -import { getProfile } from '@/api/userInfo'; -import { UserInfoProps } from '@/context/UserInfoProvider.tsx'; +import { getLikedRooms } from '@/api/userInfo'; type HomeProps = NextPage & { getLayout: (page: React.ReactElement, ctx: NextPageContext) => React.ReactNode; @@ -38,7 +38,6 @@ const defaultFilters = Object.values(FILTER_LABEL).map((value) => { function Home() { const [rooms, setRooms] = useState([]); - const [profile, setProfile] = useState(); const [filters, setFilters] = useState<{ selected: boolean; value: string }[]>(defaultFilters); const [clickedChip, setClickedChip] = useState(-1); const router = useRouter(); @@ -46,8 +45,10 @@ function Home() { const [page, setPage] = useState(0); const [totalElements, setTotalElements] = useState(0); const [searchParams, setSearchParams] = useState>({}); + const [likedRoom, setLikedRoom] = useState([]); // TODO: 전체 페이지보다 크면 페이징 처리 안되도록 수정 // TODO : ModalLayer 로 로그인한 사용자의 Context 생성 필요 + // eslint-disable-next-line consistent-return const selectRooms = async () => { try { const data = await getRooms({ @@ -56,6 +57,8 @@ function Home() { }); setRooms(data?.content || []); setTotalElements(data?.totalElements || 0); + + return data?.content; } catch (error) { console.error(error); } @@ -89,16 +92,6 @@ function Home() { setSearchParams(childData); setRooms([]); }; - const selectProfile = async () => { - try { - const data = await getProfile(); - if (data != null) { - setProfile(data); - } - } catch (error) { - console.error(error); - } - }; const openFilterPopup = () => { openModal({ props: { @@ -137,8 +130,18 @@ function Home() { // 최초 접근 시 Room 정보 조회 useEffect(() => { (async () => { - await selectRooms(); - await selectProfile(); + const resultRooms = await selectRooms(); + const resultLikedRooms = (await getLikedRooms(page))?.content; + const roomIds = []; + if (resultRooms) { + for (const room of resultRooms) { + const roomId = room?.id; + if (resultLikedRooms && resultLikedRooms.some((likedRoom) => likedRoom?.id === roomId)) { + roomIds.push(roomId); + } + } + } + // await selectProfile(); if (target?.current) { const observer = new IntersectionObserver(callback, options); observer.observe(target.current); @@ -237,7 +240,7 @@ function Home() {
-
diff --git a/pages/userInfo/index.tsx b/pages/userInfo/index.tsx index c5d37c1..183b5bf 100644 --- a/pages/userInfo/index.tsx +++ b/pages/userInfo/index.tsx @@ -1,18 +1,36 @@ -import React from 'react'; +import React, { useState, useEffect } from 'react'; import { Nav, ProfileCard } from '@/components/index.tsx'; import { useRouter } from 'next/router'; +import { getProfile } from '@/api/userInfo'; +import { UserInfoProps } from '@/context/UserInfoProvider.tsx'; interface UserProfileProps { imgSrc: string; } export default function UserProfile({ imgSrc }: UserProfileProps) { - const router = useRouter(); - const { query } = router; - const userInfo = query.data ? JSON.parse(query.data as string) : {}; + const [profile, setProfile] = useState(); + const selectProfile = async () => { + try { + const data = await getProfile(); + if (data != null) { + setProfile(data); + } + } catch (error) { + console.error(error); + } + }; + + useEffect(() => { + (async () => { + await selectProfile(); + })(); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); + return ( <> - + {profile && }