Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix : 여정, 관심목록 조회 페이지 QA 반영 #282

Merged
merged 4 commits into from
Jan 27, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions src/components/MyTrip/MyTrip.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,9 +30,9 @@ const MyTrip = () => {
const { ingTrips, beforeTrips, afterTrips } = classifyTrips(data);

return (
<div className="mt-3 min-h-[100vh]">
<div className="pb-[15px]">
<h1 className="text-[24px] font-bold text-gray7">나의 여정</h1>
<div className="mt-[5px] min-h-[100vh]">
<div className="py-[8px]">
<h1 className="text-[20px] font-bold text-gray7">나의 여정</h1>
</div>
{data.length > 0 ? (
<>
Expand Down
8 changes: 4 additions & 4 deletions src/components/MyTrip/MyTripAfterList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,16 +19,16 @@ const MyTripAfterList: React.FC<MyTripIngListProps> = ({ myTripsData }) => {

if (sortedTrips.length > 0) {
return (
<>
<div className="mb-[10px] mt-[30px]">
<div className="mt-[48px]">
<div className="mb-[16px]">
<h1 className="text-[18px] font-bold text-gray7">지난 여행</h1>
</div>
<div className="no-scrollbar grid grid-cols-1 gap-[5px] overflow-y-scroll">
<div className="no-scrollbar grid grid-cols-1 gap-[24px] overflow-y-scroll">
{sortedTrips.map((myTripList: MyTripType) => (
<MyTripItem key={uuidv4()} myTripList={myTripList} />
))}
</div>
</>
</div>
);
} else {
return null;
Expand Down
26 changes: 15 additions & 11 deletions src/components/MyTrip/MyTripBeforeList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,18 +12,22 @@ const MyTripBeforeList: React.FC<MyTripIngListProps> = ({ myTripsData }) => {
return <div>데이터를 불러오는 중 오류가 발생했습니다.</div>;
}

return (
<>
<div className="mb-[10px] mt-[30px]">
<h1 className="text-[18px] font-bold text-gray7">다가오는 여행</h1>
if (myTripsData.length > 0) {
return (
<div className="mt-[40px]">
<div className="mb-[16px]">
<h1 className="text-[18px] font-bold text-gray7">다가오는 여행</h1>
</div>
<div className="no-scrollbar grid grid-cols-1 gap-[24px] overflow-y-scroll">
{myTripsData.map((myTripList: MyTripType) => (
<MyTripItem key={uuidv4()} myTripList={myTripList} />
))}
</div>
</div>
<div className="no-scrollbar grid grid-cols-1 gap-[5px] overflow-y-scroll">
{myTripsData.map((myTripList: MyTripType) => (
<MyTripItem key={uuidv4()} myTripList={myTripList} />
))}
</div>
</>
);
);
} else {
return null;
}
};

export default MyTripBeforeList;
2 changes: 1 addition & 1 deletion src/components/MyTrip/MyTripIngItem.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ const MyTripIngItem: React.FC<MyTripItemProps> = ({ myTripList }) => {
alt="여행지 이미지"
/>
</div>
<div className="absolute right-3 top-[20px] inline-flex h-[22px] w-[54px] items-center justify-center gap-[8px] rounded-2xl border border-solid border-cyan-400 bg-white px-[8px] py-[10px] pt-[10px]">
<div className="absolute right-3 top-[20px] inline-flex h-[24px] w-[54px] items-center justify-center gap-[8px] rounded-2xl border border-solid border-cyan-400 bg-white px-[8px] py-[10px] pt-[10px]">
<span className="text-xs font-semibold text-cyan-400">
{tripStatus}
</span>
Expand Down
2 changes: 1 addition & 1 deletion src/components/MyTrip/MyTripIngList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ const MyTripIngList: React.FC<MyTripIngListProps> = ({ myTripsData }) => {

return (
<>
<div className="no-scrollbar grid grid-cols-1 gap-[5px] overflow-y-scroll ">
<div className="no-scrollbar mt-[8px] grid grid-cols-1 gap-[8px] overflow-y-scroll ">
{myTripsData.map((myTripList: MyTripType) => (
<MyTripIngItem key={uuidv4()} myTripList={myTripList} />
))}
Expand Down
2 changes: 1 addition & 1 deletion src/components/MyTrip/MyTripItem.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ const MyTripItem: React.FC<MyTripItemProps> = ({ myTripList }) => {
<SwipeableList>
<SwipeableListItem trailingActions={trailingActions()}>
<div
className="relative mb-[10px] cursor-pointer"
className="relative cursor-pointer"
onClick={() => navigate(`/trip/${tripId}`)}>
<div className="flex min-h-[72px]">
<div>
Expand Down
2 changes: 1 addition & 1 deletion src/components/Trip/LikedToursList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ export const LikedToursList = () => {
}, []);

return (
<div className="realtive mt-[10px]">
<div className="realtive">
<LikedToursListCategory onCategoryClick={handleCategoryClick} />

{data?.pages[0].data.content.length > 0 ? (
Expand Down
2 changes: 1 addition & 1 deletion src/components/Trip/LikedToursLists/LikedToursListBox.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ const LikedToursListBox: React.FC<LikedToursListProps> = ({
{/* <Spinner /> */}
</div>
}>
<div className="no-scrollbar grid grid-cols-1 gap-[5px] overflow-y-scroll">
<div className="no-scrollbar mt-[8px] grid grid-cols-1 gap-[24px] overflow-y-scroll">
{isLoading
? Array.from({ length: 10 }, (_, index) => (
<ToursItemSkeleton key={index} />
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ const LikedToursListCategory: React.FC<LikedToursListCategoryProps> = ({
};

return (
<div className="no-scrollbar mb-[10px] flex w-[100%] overflow-scroll overflow-y-hidden bg-white">
<div className="no-scrollbar my-[8px] flex w-[100%] overflow-scroll overflow-y-hidden bg-white py-[10px]">
{categories.map((category) => {
return (
<LikedToursListCategoryItem
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ export const LikedToursListCategoryItem: React.FC<
return (
<button
onClick={handleCategoryClick}
className={`body4 mr-[8px] flex h-[32px] w-[58px] items-center justify-center whitespace-nowrap rounded-[30px] border border-solid bg-[#28D8FF] px-[16px] py-[7px] leading-normal ${buttonStyle}`}>
className={`body4 mr-[5px] flex items-center justify-center whitespace-nowrap rounded-[30px] border border-solid bg-[#28D8FF] px-[16px] py-[7px] leading-normal ${buttonStyle}`}>
{category.name}
</button>
);
Expand Down
4 changes: 2 additions & 2 deletions src/components/Trip/LikedToursLists/LikedToursListItem.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ const LikedToursListItem: React.FC<LikedToursListItemProps> = ({
/>
</div>

<div className="ml-[8px] flex max-h-[72px] flex-col items-start">
<div className="ml-[16px] flex max-h-[72px] flex-col items-start">
<div className="mt-[-5px] flex max-w-[230px] flex-col">
<p className="truncate whitespace-nowrap text-[16px] font-bold leading-normal text-black ">
{title}
Expand All @@ -105,7 +105,7 @@ const LikedToursListItem: React.FC<LikedToursListItemProps> = ({
</div>
</div>

<div className="max-w-[200px] ">
<div className="max-w-[180px] ">
<p className="truncate text-[14px] text-gray4">
{tourAddress ? tourAddress : '주소를 제공하지 않고 있어요'}
</p>
Expand Down
8 changes: 5 additions & 3 deletions src/components/Wish/Wish.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -44,9 +44,11 @@ const Wish = () => {
}

return (
<div className="mt-[10px] min-h-[100vh]">
<div className="sticky top-0 z-[105] bg-white py-0.5">
<h1 className="title2 pt-3">나의 관심 목록</h1>
<div className="mt-[5px] min-h-[100vh]">
<div className="sticky top-0 z-[105] bg-white">
<h1 className="py-[8px] text-[20px] font-bold text-gray7">
나의 관심 목록
</h1>
<WishCategory onCategoryClick={handleCategoryClick} />
</div>

Expand Down
2 changes: 1 addition & 1 deletion src/components/Wish/WishCategoryItem.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ const WishCategoryItem: React.FC<WishCategoryItemProps> = ({
return (
<button
onClick={handleCategoryClick}
className={`body4 mr-[8px] flex h-[32px] w-[58px] items-center justify-center whitespace-nowrap rounded-[30px] border border-solid bg-[#28D8FF] px-[16px] py-[7px] leading-normal ${buttonStyle}`}>
className={`body4 mr-[5px] flex items-center justify-center whitespace-nowrap rounded-[30px] border border-solid bg-[#28D8FF] px-[16px] py-[7px] leading-normal ${buttonStyle}`}>
{category.name}
</button>
);
Expand Down
30 changes: 15 additions & 15 deletions src/components/Wish/WishItem.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ const WishItem: React.FC<WishItemProps> = ({ wishList }) => {

return (
<div
className={`relative mb-[6px] flex max-h-[72px] cursor-pointer items-center`}
className={`relative flex max-h-[72px] cursor-pointer items-center`}
onClick={() => navigate(`/detail/${id}`)}>
<div className="flex items-center">
<div>
Expand All @@ -46,12 +46,12 @@ const WishItem: React.FC<WishItemProps> = ({ wishList }) => {
</div>
</div>

<div className="ml-[8px] flex flex-col items-start justify-between gap-[15px]">
<div className=" max-w-[230px]">
<p className=" truncate whitespace-nowrap px-[2px] text-[16px] font-bold leading-normal text-black">
<div className="ml-[15px] flex flex-col items-start justify-between gap-[15px]">
<div className="max-w-[230px]">
<p className="truncate whitespace-nowrap text-[16px] font-bold leading-normal text-black">
{title}
</p>
<div className="ml-[3px] max-w-[260px]">
<div className="max-w-[260px]">
<p className="truncate text-[14px] text-gray6">
{isMetroIncluded && tourAddress
? (tourAddress.match(/(.*?[시군구])/)?.[0] || '') +
Expand All @@ -63,25 +63,25 @@ const WishItem: React.FC<WishItemProps> = ({ wishList }) => {
</div>
</div>

<div className="caption1 mb-[4px] ml-[3px] flex justify-center leading-normal text-gray4">
<div className="caption1 mb-[4px] flex h-[16px] items-center justify-center leading-normal text-gray4">
<div className="mr-[5px] flex items-center">
<div className="">
<StarIcon size={12.5} color="#FFEC3E" fill="#FFEC3E" />
<div>
<StarIcon size={15} color="#FFEC3E" fill="#FFEC3E" />
</div>
<div className="flex items-center pt-[1.5px]">
<span className="ml-1 mr-0.5 text-xs font-bold">
<div className="flex items-center">
<span className="ml-[2px] mr-0.5 text-[12px] font-bold">
{(Math.ceil(ratingAverage * 100) / 100).toFixed(1)}
</span>
<span className="text-xs">
<span className="text-[12px] font-normal ">
({reviewCount ? reviewCount.toLocaleString() : reviewCount})
</span>
</div>
</div>
<div className="flex items-center justify-center ">
<div className="">
<HeartIcon size={14} color="#FF2167" fill="#FF2167" />
<div className="flex items-center justify-center">
<div>
<HeartIcon size={16} color="#FF2167" fill="#FF2167" />
</div>
<span className="ml-1 mt-[0px] text-xs">
<span className="ml-[2px] text-[12px] font-normal">
{likedCount ? likedCount.toLocaleString() : likedCount}
</span>
</div>
Expand Down
2 changes: 1 addition & 1 deletion src/components/Wish/WishList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ const WishList: React.FC<WishListProps> = ({
<Spinner />
</div>
}>
<div className="no-scrollbar grid grid-cols-1 gap-[5px] overflow-y-scroll">
<div className="no-scrollbar grid grid-cols-1 gap-[16px] overflow-y-scroll pt-[10px]">
{isLoading
? Array.from({ length: 10 }, (_, index) => (
<ToursItemSkeleton key={index} />
Expand Down