From e99d7bfa41f18896255d2d813938aabf0198c1aa Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 15:12:34 +0900 Subject: [PATCH 01/24] =?UTF-8?q?=F0=9F=90=9B=20fix:=20=ED=94=84=EB=A6=AC?= =?UTF-8?q?=ED=8C=A8=EC=B9=98=20=EA=B8=B0=EB=8A=A5=20=EB=8B=A4=EC=8B=9C=20?= =?UTF-8?q?=EC=82=B4=EB=A6=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/crew-list/crew-card.tsx | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/src/components/common/crew-list/crew-card.tsx b/src/components/common/crew-list/crew-card.tsx index 90ebdabf..07cefacd 100644 --- a/src/components/common/crew-list/crew-card.tsx +++ b/src/components/common/crew-list/crew-card.tsx @@ -26,7 +26,7 @@ export default function CrewCard({ crewMembers, inWhere, }: CrewCardProps) { - const [prefetched, setPrefetched] = useState(new Set()); + const [prefetchedPages, setPrefetchedPages] = useState(new Set()); const CREWPAGE = `/crew/detail/${id}`; const router = useRouter(); @@ -34,17 +34,18 @@ export default function CrewCard({ router.push(CREWPAGE); }; - const handleCardMouseUp = () => { - if (!prefetched.has(CREWPAGE)) { - router.prefetch(CREWPAGE); - setPrefetched(new Set(prefetched).add(CREWPAGE)); + const handleMouseEnter = () => { + if (!prefetchedPages.has(CREWPAGE)) { + router.prefetch(CREWPAGE); // 페이지 프리패치 + setPrefetchedPages(new Set(prefetchedPages).add(CREWPAGE)); } }; return (
router.push(CREWPAGE)} + onClick={handleCardClick} + onMouseEnter={handleMouseEnter} className="relative mx-auto flex w-full animate-fade cursor-pointer flex-col overflow-hidden rounded-[14px] bg-white transition-shadow hover:shadow-card md:h-[203px] md:flex-row" > {/* 썸네일 */} From 50f2d61204df84b5c5ac36561530d8fbaa50c213 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 15:42:50 +0900 Subject: [PATCH 02/24] =?UTF-8?q?=E2=9C=A8=20feat:=20=ED=81=AC=EB=A3=A8=20?= =?UTF-8?q?=EB=A6=AC=EB=B7=B0=20=ED=83=80=EC=9E=85=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/types/review.d.ts | 24 +++++++++++++++++++++++- 1 file changed, 23 insertions(+), 1 deletion(-) diff --git a/src/types/review.d.ts b/src/types/review.d.ts index f9e7cc7a..b738478e 100644 --- a/src/types/review.d.ts +++ b/src/types/review.d.ts @@ -26,7 +26,29 @@ export interface CrewReview { export interface ReviewerType { id: number; nickname: string; - imageUrl: string; + profileImageUrl: string; +} + +export interface ReviewRateInfo { + totalRate: number; + averageRate: number; + ratingsData: Array<{ + score: number; + count: number; + }>; +} + +export interface ReviewList { + content: ReviewContent[]; + pageNumber: number; + pageSize: number; + totalElements: number; + totalPages: number; +} + +export interface CrewReviewResponse { + reviewRateInfo: ReviewRateInfo; + reviewList: ReviewList; } // NOTE: 나의 리뷰 From 16d4832fe43c5260337af82558099986e136152f Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 15:43:35 +0900 Subject: [PATCH 03/24] =?UTF-8?q?=F0=9F=90=9B=20fix:=20=EB=A6=AC=EB=B7=B0?= =?UTF-8?q?=EC=B9=B4=EB=93=9C=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../common/review-list/review-card.tsx | 21 +++++++++---------- 1 file changed, 10 insertions(+), 11 deletions(-) diff --git a/src/components/common/review-list/review-card.tsx b/src/components/common/review-list/review-card.tsx index 8a2686ab..516b39d9 100644 --- a/src/components/common/review-list/review-card.tsx +++ b/src/components/common/review-list/review-card.tsx @@ -12,23 +12,17 @@ import { Profile } from '@/src/components/common/profile'; import ReviewHearts from '@/src/components/common/review-heart/hearts'; import { ReviewerType } from '@/src/types/review'; -export interface GatheringInform { - id: number; - image: string; - name: string; -} - interface ReviewCardProps { rate: number; comment: string; createdAt: string; - id: number; + id?: number; clickable?: boolean; isMine?: boolean; crewId?: number; crewName?: string; gatheringName?: string; - refetch: () => void; + refetch?: () => void; reviewer?: ReviewerType; } @@ -53,18 +47,23 @@ export default function ReviewCard({ const router = useRouter(); const handleDelete = async () => { + if (!id) { + toast.error('리뷰 ID가 없습니다.'); + return; + } + try { await deleteReview(id); toast.success('리뷰가 성공적으로 삭제되었습니다.'); closeConfirmDeleteModal(); - refetch(); + refetch?.(); } catch (error) { toast.error('리뷰 삭제에 실패했습니다.'); } }; const handleClick = (e: React.MouseEvent) => { - e.stopPropagation(); // 이벤트 전파 중지 + e.stopPropagation(); if (clickable && crewId) { router.push(`/crew/detail/${crewId}`); } @@ -103,7 +102,7 @@ export default function ReviewCard({
{!isMine && ( <> - {reviewer && } + {reviewer && } {reviewer?.nickname} From 4d15e0197996a1af55805a0bd815ce471365c30f Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 15:44:19 +0900 Subject: [PATCH 04/24] =?UTF-8?q?=F0=9F=90=9B=20fix:=20=EC=82=AC=EC=9A=A9?= =?UTF-8?q?=ED=95=98=EC=A7=80=20=EC=95=8A=EB=8A=94=20import=20=EC=82=AD?= =?UTF-8?q?=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/review-list/review-card.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/common/review-list/review-card.tsx b/src/components/common/review-list/review-card.tsx index 516b39d9..eb40eddd 100644 --- a/src/components/common/review-list/review-card.tsx +++ b/src/components/common/review-list/review-card.tsx @@ -1,6 +1,6 @@ 'use client'; -import React, { useState } from 'react'; +import React from 'react'; import { toast } from 'react-toastify'; import { useRouter } from 'next/navigation'; import { useDisclosure } from '@mantine/hooks'; From fbf8570e5affeb56b69d9dce0257c230d14369c7 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 15:44:51 +0900 Subject: [PATCH 05/24] =?UTF-8?q?=F0=9F=9A=91=20fix:=20=ED=83=80=EC=9E=85?= =?UTF-8?q?=EC=97=90=20=EB=94=B0=EB=9D=BC=20=EC=9D=B4=EB=A6=84=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../crew/detail/[id]/_components/rating-display.tsx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/app/(crew)/crew/detail/[id]/_components/rating-display.tsx b/src/app/(crew)/crew/detail/[id]/_components/rating-display.tsx index 9abb53ae..14417550 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/rating-display.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/rating-display.tsx @@ -7,7 +7,7 @@ interface HeartProps { } export interface ReviewRateInfo { - totalReviewCount: number; + totalRate: number; averageRate: number; ratingsData: { score: number; count: number }[]; } @@ -40,7 +40,7 @@ function Heart({ fillPercentage }: HeartProps) { } export default function RatingDisplay({ reviewRateInfo }: RatingDisplayProps) { - const { totalReviewCount, averageRate, ratingsData } = reviewRateInfo; + const { totalRate, averageRate, ratingsData } = reviewRateInfo; const renderHearts = () => { const hearts = []; @@ -55,7 +55,7 @@ export default function RatingDisplay({ reviewRateInfo }: RatingDisplayProps) {
{/* 왼쪽: 평균 평점 및 하트 표시 */}
-
(총 {totalReviewCount}개의 평가)
+
(총 {totalRate}개의 평가)
평점 {averageRate.toFixed(1)} /5 @@ -69,11 +69,11 @@ export default function RatingDisplay({ reviewRateInfo }: RatingDisplayProps) {
{score}점
- +
{count}/ - {totalReviewCount} + {totalRate}
))} From df2b9de18584a54ba16369fe6ed2cb260c0bfba7 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 15:45:10 +0900 Subject: [PATCH 06/24] =?UTF-8?q?=E2=9C=A8=20feat:=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=20=ED=8C=A8=EC=B9=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/_apis/crew/crew-review-apis.ts | 16 ++++++++++++++++ src/_queries/crew/crew-review-queries.ts | 9 +++++++++ 2 files changed, 25 insertions(+) create mode 100644 src/_apis/crew/crew-review-apis.ts create mode 100644 src/_queries/crew/crew-review-queries.ts diff --git a/src/_apis/crew/crew-review-apis.ts b/src/_apis/crew/crew-review-apis.ts new file mode 100644 index 00000000..e883e066 --- /dev/null +++ b/src/_apis/crew/crew-review-apis.ts @@ -0,0 +1,16 @@ +import { fetchApi } from '@/src/utils/api'; +import { CrewReviewResponse } from '@/src/types/review'; + +// 크루 리뷰 조회 +export async function getCrewReviews(crewId: number, page: number): Promise { + const url = `/api/review/${crewId}?page=${page}&size=5`; + + const response = await fetchApi<{ data: CrewReviewResponse }>(url, { + method: 'GET', + headers: { + 'Content-Type': 'application/json', + }, + }); + + return response.data; +} diff --git a/src/_queries/crew/crew-review-queries.ts b/src/_queries/crew/crew-review-queries.ts new file mode 100644 index 00000000..9b5758e3 --- /dev/null +++ b/src/_queries/crew/crew-review-queries.ts @@ -0,0 +1,9 @@ +import { useQuery } from '@tanstack/react-query'; +import { getCrewReviews } from '@/src/_apis/crew/crew-review-apis'; + +export function useGetCrewReviewsQuery(crewId: number, page: number) { + return useQuery({ + queryKey: ['crewReviews', crewId, page], + queryFn: () => getCrewReviews(crewId, page - 1), + }); +} From 0dee2566647fcda0b832d3ab1f06d9816dacf8b6 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 15:45:47 +0900 Subject: [PATCH 07/24] =?UTF-8?q?=E2=9C=A8=20feat:=20=EB=A0=88=EC=9D=B4?= =?UTF-8?q?=EC=A7=80=20=EB=A1=9C=EB=94=A9=EC=9D=84=20=ED=86=B5=ED=95=B4=20?= =?UTF-8?q?=EC=8B=9C=EA=B0=84=EB=8B=A8=EC=B6=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/(crew)/crew/detail/[id]/page.tsx | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/src/app/(crew)/crew/detail/[id]/page.tsx b/src/app/(crew)/crew/detail/[id]/page.tsx index 8b02bb80..8df25bda 100644 --- a/src/app/(crew)/crew/detail/[id]/page.tsx +++ b/src/app/(crew)/crew/detail/[id]/page.tsx @@ -1,8 +1,12 @@ -import { getGatheringList } from '@/src/_apis/crew/crew-gathering-list-apis'; -import CreateGathering from './_components/create-gathering'; +import dynamic from 'next/dynamic'; import DetailCrew from './_components/detail-crew-container'; -import GatheringListSection from './_components/gathering-list-section'; -import CrewReviewSection from './_components/review-section'; + +// Lazy Import +const CreateGathering = dynamic(() => import('./_components/create-gathering'), { ssr: false }); +const GatheringListSection = dynamic(() => import('./_components/gathering-list-section'), { + ssr: false, +}); +const CrewReviewSection = dynamic(() => import('./_components/review-section'), { ssr: false }); interface CrewDetailPageProps { params: { id: string }; @@ -33,12 +37,12 @@ export default async function CrewDetailPage({ params }: CrewDetailPageProps) { {/* Crew Review Section */} - {/*
+

크루 리뷰

- +
-
*/} +
); } From 2591599d9ea55355bae5c1149fe5b8fc57365460 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 15:48:41 +0900 Subject: [PATCH 08/24] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20refactor:=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EB=84=A4=EC=9D=B4=EC=85=98=20?= =?UTF-8?q?=EB=A6=AC=ED=8C=A9=ED=86=A0=EB=A7=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../[id]/_components/crew-review-list.tsx | 20 +++++++++---------- 1 file changed, 9 insertions(+), 11 deletions(-) diff --git a/src/app/(crew)/crew/detail/[id]/_components/crew-review-list.tsx b/src/app/(crew)/crew/detail/[id]/_components/crew-review-list.tsx index b1bdbc14..ecb34167 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/crew-review-list.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/crew-review-list.tsx @@ -2,6 +2,7 @@ import React from 'react'; import { Pagination } from '@mantine/core'; +import { cn } from '@/src/utils/cn'; import ReviewCard from '@/src/components/common/review-list/review-card'; import { CrewReview } from '@/src/types/review'; @@ -21,7 +22,7 @@ export default function CrewReviewList({ return (
- {/* {reviews.map((review) => ( + {reviews.map((review) => ( - ))} */} + ))}
Date: Thu, 21 Nov 2024 15:49:10 +0900 Subject: [PATCH 09/24] =?UTF-8?q?=F0=9F=90=9B=20fix:=20=EC=84=A0=EC=96=B8?= =?UTF-8?q?=ED=96=88=EC=A7=80=EB=A7=8C=20=EC=82=AC=EC=9A=A9=ED=95=98?= =?UTF-8?q?=EC=A7=80=20=EC=95=8A=EB=8A=94=20=EA=B0=92=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/gathering-list/liked-list-presenter.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/gathering-list/liked-list-presenter.tsx b/src/components/gathering-list/liked-list-presenter.tsx index e89a15e9..1b6d1f24 100644 --- a/src/components/gathering-list/liked-list-presenter.tsx +++ b/src/components/gathering-list/liked-list-presenter.tsx @@ -18,7 +18,7 @@ export default function LikedListPresenter({ onUnlike, page, }: LikedListPresenterProps) { - const { content, pageSize, totalPages } = gatheringData; + const { content, totalPages } = gatheringData; return (
From 8d67fd4cb0dca573279c24e72013040c80770bde Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 16:15:30 +0900 Subject: [PATCH 10/24] =?UTF-8?q?=E2=9C=A8=20feat:=20=EB=A6=AC=EB=B7=B0=20?= =?UTF-8?q?=EB=A6=AC=EC=8A=A4=ED=8A=B8=20=EC=8A=A4=EC=BC=88=EB=A0=88?= =?UTF-8?q?=ED=86=A4=20UI=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../common/skeleton/review-skeleton/index.tsx | 30 ++++++++++++++ .../skeleton/review-skeleton/review-card.tsx | 39 +++++++++++++++++++ 2 files changed, 69 insertions(+) create mode 100644 src/components/common/skeleton/review-skeleton/index.tsx create mode 100644 src/components/common/skeleton/review-skeleton/review-card.tsx diff --git a/src/components/common/skeleton/review-skeleton/index.tsx b/src/components/common/skeleton/review-skeleton/index.tsx new file mode 100644 index 00000000..6fbd3829 --- /dev/null +++ b/src/components/common/skeleton/review-skeleton/index.tsx @@ -0,0 +1,30 @@ +import ReviewCardSkeleton from './review-card'; + +interface SkeletonListProps { + type: 'mine' | 'crew'; +} + +export default function ReviewListSkeleton({ type }: SkeletonListProps) { + return ( +
+ {type === 'mine' && ( +
    + {Array.from({ length: 3 }).map((_, idx) => ( + // eslint-disable-next-line react/no-array-index-key +
  • + +
    • + ))} +
+ )} + {type === 'crew' && ( +
+ {Array.from({ length: 2 }).map((_, idx) => ( + // eslint-disable-next-line react/no-array-index-key + + ))} +
+ )} +
+ ); +} diff --git a/src/components/common/skeleton/review-skeleton/review-card.tsx b/src/components/common/skeleton/review-skeleton/review-card.tsx new file mode 100644 index 00000000..a81a2ca5 --- /dev/null +++ b/src/components/common/skeleton/review-skeleton/review-card.tsx @@ -0,0 +1,39 @@ +import { Skeleton } from '@mantine/core'; + +interface ReviewCardSkeletonProps { + isMine?: boolean; +} + +export default function ReviewCardSkeleton({ isMine = false }: ReviewCardSkeletonProps) { + return ( +
+ {isMine && } +
+
+ {isMine && } + +
+ + + +
+ +
+ {!isMine && ( + <> + + + + )} + +
+
+
+
+ ); +} From 1997e3cd45d1a4316b367d289d33ec1b07df7487 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 16:17:53 +0900 Subject: [PATCH 11/24] =?UTF-8?q?=E2=9C=A8=20feat:=20=EC=8A=A4=EC=BC=88?= =?UTF-8?q?=EB=A0=88=ED=86=A4=20=EC=82=AC=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/(crew)/my-page/my-review/page.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/app/(crew)/my-page/my-review/page.tsx b/src/app/(crew)/my-page/my-review/page.tsx index 21c8fd3d..69e21e14 100644 --- a/src/app/(crew)/my-page/my-review/page.tsx +++ b/src/app/(crew)/my-page/my-review/page.tsx @@ -5,6 +5,7 @@ import { Loader } from '@mantine/core'; import { useGetMyReviewsQuery } from '@/src/_queries/review/my-review-queries'; import { useInfiniteScroll } from '@/src/hooks/use-infinite-scroll'; import ReviewCardList from '@/src/components/common/review-list/review-card-list'; +import ReviewListSkeleton from '@/src/components/common/skeleton/review-skeleton'; export default function MyReviewPage() { const size = 6; @@ -16,7 +17,7 @@ export default function MyReviewPage() { if (isLoading) { return (
- +
); } From 182af6e260595a57e0f8672dac0e41b81109a5d3 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 16:18:20 +0900 Subject: [PATCH 12/24] =?UTF-8?q?=E2=9C=A8=20feat:=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=20=ED=8C=A8=EC=B9=98,=20=EC=8A=A4=EC=BC=88=EB=A0=88?= =?UTF-8?q?=ED=86=A4=20=EC=82=AC=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../[id]/_components/review-section.tsx | 54 +++++++++++++++---- 1 file changed, 45 insertions(+), 9 deletions(-) diff --git a/src/app/(crew)/crew/detail/[id]/_components/review-section.tsx b/src/app/(crew)/crew/detail/[id]/_components/review-section.tsx index 056f7ee2..f7f5dd58 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/review-section.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/review-section.tsx @@ -1,23 +1,59 @@ 'use client'; -import { useEffect, useState } from 'react'; +import { useState } from 'react'; +import { useGetCrewReviewsQuery } from '@/src/_queries/crew/crew-review-queries'; +import ReviewListSkeleton from '@/src/components/common/skeleton/review-skeleton'; import CrewReviewList from './crew-review-list'; import RatingDisplay from './rating-display'; -export default function CrewReviewSection() { - // TODO: review 추후 추가 +interface CrewReviewSectionProps { + crewId: number; +} + +export default function CrewReviewSection({ crewId }: CrewReviewSectionProps) { + const [page, setPage] = useState(1); + const { data, isLoading, isError } = useGetCrewReviewsQuery(crewId, page); + + const handlePageChange = (newPage: number) => { + setPage(newPage); + }; + + if (isLoading) return ; + + if (isError || data === undefined) { + return ( +
+

+ 데이터 로드 실패 +

+

+ 데이터를 불러오는 중 오류가 발생했습니다.
+ 잠시 후 다시 시도해주세요. +

+
+ ); + } + + if (data?.reviewList.content.length === 0) { + return ( +
+

리뷰가 아직 없습니다

+

크루의 약속에 참여하고 리뷰를 남겨보세요!

+
+ ); + } return (
- {/* */} +
- {/* */} + />
); } From 13c4578959b47a170fffba4a9935a93853c01302 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 17:20:14 +0900 Subject: [PATCH 13/24] =?UTF-8?q?=F0=9F=92=84=20design:=20=EC=8A=A4?= =?UTF-8?q?=EC=BC=88=EB=A0=88=ED=86=A4=20=EB=94=94=EC=9E=90=EC=9D=B8=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/(crew)/my-page/my-review/page.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/app/(crew)/my-page/my-review/page.tsx b/src/app/(crew)/my-page/my-review/page.tsx index 69e21e14..f0011a0b 100644 --- a/src/app/(crew)/my-page/my-review/page.tsx +++ b/src/app/(crew)/my-page/my-review/page.tsx @@ -16,8 +16,10 @@ export default function MyReviewPage() { if (isLoading) { return ( -
- +
+
+ +
); } From 3abd5bda14aab28344c2b84fb158ca472718010b Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 17:21:16 +0900 Subject: [PATCH 14/24] =?UTF-8?q?=F0=9F=92=84=20design:=20=EB=AA=A8?= =?UTF-8?q?=EB=B0=94=EC=9D=BC=20=EB=94=94=EC=9E=90=EC=9D=B8=20=EC=88=98?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../crew/detail/[id]/_components/create-gathering/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/(crew)/crew/detail/[id]/_components/create-gathering/index.tsx b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/index.tsx index 75b6193c..17d1474c 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/create-gathering/index.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/index.tsx @@ -39,9 +39,9 @@ export default function CreateGathering({ crewId }: { crewId: number }) { return (
-
+

약속 잡기

- + 현재 {totalGatheringCount}개의 약속이 개설되어 있습니다.
From e68cfd2b764137eb163f6d71e7db757652de0829 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 18:14:13 +0900 Subject: [PATCH 15/24] =?UTF-8?q?=F0=9F=9A=91=20fix:=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/mock/review-data.ts | 34 +++++++++++++++++----------------- 1 file changed, 17 insertions(+), 17 deletions(-) diff --git a/src/mock/review-data.ts b/src/mock/review-data.ts index f7e92e59..98277a53 100644 --- a/src/mock/review-data.ts +++ b/src/mock/review-data.ts @@ -15,7 +15,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 1, nickname: '샘플1', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -27,7 +27,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 2, nickname: '샘플2', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -39,7 +39,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 3, nickname: '샘플3', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -51,7 +51,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 4, nickname: '샘플4', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -63,7 +63,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 5, nickname: '샘플5', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -75,7 +75,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 6, nickname: '샘플6', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -87,7 +87,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 7, nickname: '샘플7', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -99,7 +99,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 2, nickname: '샘플2', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -111,7 +111,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 3, nickname: '샘플3', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -123,7 +123,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 4, nickname: '샘플4', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -135,7 +135,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 5, nickname: '샘플5', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -147,7 +147,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 6, nickname: '샘플6', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -159,7 +159,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 7, nickname: '샘플7', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -171,7 +171,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 4, nickname: '샘플4', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -183,7 +183,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 5, nickname: '샘플5', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -195,7 +195,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 6, nickname: '샘플6', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, { @@ -207,7 +207,7 @@ export const CrewReviewData: { data: CrewReview[] } = { reviewer: { id: 7, nickname: '샘플7', - imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + profileImageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', }, }, ], From c54256d69305cc77fb7ce1dbfde9a2dcea454dbb Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 18:54:22 +0900 Subject: [PATCH 16/24] =?UTF-8?q?=F0=9F=9A=91=20fix:=20=ED=8C=A8=ED=82=A4?= =?UTF-8?q?=EC=A7=80=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 120 ---------------------------------------------- 1 file changed, 120 deletions(-) diff --git a/package-lock.json b/package-lock.json index 24395f4c..2923c63c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14977,126 +14977,6 @@ "optional": true } } - }, - "node_modules/@next/swc-darwin-arm64": { - "version": "14.2.18", - "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.18.tgz", - "integrity": "sha512-tOBlDHCjGdyLf0ube/rDUs6VtwNOajaWV+5FV/ajPgrvHeisllEdymY/oDgv2cx561+gJksfMUtqf8crug7sbA==", - "cpu": [ - "arm64" - ], - "optional": true, - "os": [ - "darwin" - ], - "engines": { - "node": ">= 10" - } - }, - "node_modules/@next/swc-darwin-x64": { - "version": "14.2.18", - "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-14.2.18.tgz", - "integrity": "sha512-uJCEjutt5VeJ30jjrHV1VIHCsbMYnEqytQgvREx+DjURd/fmKy15NaVK4aR/u98S1LGTnjq35lRTnRyygglxoA==", - "cpu": [ - "x64" - ], - "optional": true, - "os": [ - "darwin" - ], - "engines": { - "node": ">= 10" - } - }, - "node_modules/@next/swc-linux-arm64-gnu": { - "version": "14.2.18", - "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.2.18.tgz", - "integrity": "sha512-IL6rU8vnBB+BAm6YSWZewc+qvdL1EaA+VhLQ6tlUc0xp+kkdxQrVqAnh8Zek1ccKHlTDFRyAft0e60gteYmQ4A==", - "cpu": [ - "arm64" - ], - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">= 10" - } - }, - "node_modules/@next/swc-linux-arm64-musl": { - "version": "14.2.18", - "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.2.18.tgz", - "integrity": "sha512-RCaENbIZqKKqTlL8KNd+AZV/yAdCsovblOpYFp0OJ7ZxgLNbV5w23CUU1G5On+0fgafrsGcW+GdMKdFjaRwyYA==", - "cpu": [ - "arm64" - ], - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">= 10" - } - }, - "node_modules/@next/swc-linux-x64-gnu": { - "version": "14.2.18", - "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.2.18.tgz", - "integrity": "sha512-3kmv8DlyhPRCEBM1Vavn8NjyXtMeQ49ID0Olr/Sut7pgzaQTo4h01S7Z8YNE0VtbowyuAL26ibcz0ka6xCTH5g==", - "cpu": [ - "x64" - ], - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">= 10" - } - }, - "node_modules/@next/swc-linux-x64-musl": { - "version": "14.2.18", - "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.2.18.tgz", - "integrity": "sha512-mliTfa8seVSpTbVEcKEXGjC18+TDII8ykW4a36au97spm9XMPqQTpdGPNBJ9RySSFw9/hLuaCMByluQIAnkzlw==", - "cpu": [ - "x64" - ], - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">= 10" - } - }, - "node_modules/@next/swc-win32-arm64-msvc": { - "version": "14.2.18", - "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.2.18.tgz", - "integrity": "sha512-J5g0UFPbAjKYmqS3Cy7l2fetFmWMY9Oao32eUsBPYohts26BdrMUyfCJnZFQkX9npYaHNDOWqZ6uV9hSDPw9NA==", - "cpu": [ - "arm64" - ], - "optional": true, - "os": [ - "win32" - ], - "engines": { - "node": ">= 10" - } - }, - "node_modules/@next/swc-win32-ia32-msvc": { - "version": "14.2.18", - "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.18.tgz", - "integrity": "sha512-Ynxuk4ZgIpdcN7d16ivJdjsDG1+3hTvK24Pp8DiDmIa2+A4CfhJSEHHVndCHok6rnLUzAZD+/UOKESQgTsAZGg==", - "cpu": [ - "ia32" - ], - "optional": true, - "os": [ - "win32" - ], - "engines": { - "node": ">= 10" - } } } } From 9e130dcb024164534ddaf4c0b534c51609c7fa3e Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 18:54:46 +0900 Subject: [PATCH 17/24] =?UTF-8?q?=E2=9C=A8=20feat:=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=EA=B0=80=20=EC=97=86=EB=8A=94=EA=B2=BD=EC=9A=B0=20?= =?UTF-8?q?=EC=B2=98=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../detail/[id]/_components/rating-display.tsx | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/src/app/(crew)/crew/detail/[id]/_components/rating-display.tsx b/src/app/(crew)/crew/detail/[id]/_components/rating-display.tsx index 14417550..f6a93e6b 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/rating-display.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/rating-display.tsx @@ -51,6 +51,18 @@ export default function RatingDisplay({ reviewRateInfo }: RatingDisplayProps) { return hearts; }; + // 기본 점수 데이터 (1점~5점) + const defaultRatingsData = Array.from({ length: 5 }, (_, index) => ({ + score: 5 - index, // 5점부터 1점까지 + count: 0, + })); + + // 받은 데이터를 기본 데이터에 병합 + const mergedRatingsData = defaultRatingsData.map((defaultData) => { + const foundData = ratingsData.find((data) => data.score === defaultData.score); + return foundData || defaultData; + }); + return (
{/* 왼쪽: 평균 평점 및 하트 표시 */} @@ -65,7 +77,7 @@ export default function RatingDisplay({ reviewRateInfo }: RatingDisplayProps) { {/* 오른쪽: 각 점수별 프로그레스 바 */}
- {ratingsData.map(({ score, count }) => ( + {mergedRatingsData.map(({ score, count }) => (
{score}점
From 2d28f3d9a22fb24de10a4585fcd868f4d016e248 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 18:55:38 +0900 Subject: [PATCH 18/24] =?UTF-8?q?=F0=9F=92=84=20design:=20=EC=8A=A4?= =?UTF-8?q?=EC=BC=88=EB=A0=88=ED=86=A4=20=EB=94=94=EC=9E=90=EC=9D=B8=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../my-review-skeleton-list/index.tsx | 16 ++++++------- .../skeleton/my-review-skeleton/index.tsx | 23 ++++++++++++------- 2 files changed, 22 insertions(+), 17 deletions(-) diff --git a/src/components/common/skeleton/my-review-skeleton-list/index.tsx b/src/components/common/skeleton/my-review-skeleton-list/index.tsx index e27836fd..05e96ecc 100644 --- a/src/components/common/skeleton/my-review-skeleton-list/index.tsx +++ b/src/components/common/skeleton/my-review-skeleton-list/index.tsx @@ -1,16 +1,14 @@ import MyReviewSkeleton from '../my-review-skeleton'; -interface MyReviewSkeletonListProps { - num: number; -} - -export default function MyReviewSkeletonList({ num }: MyReviewSkeletonListProps) { +export default function MyReviewSkeletonList() { return ( -
- {[...Array(num)].map((_, index) => ( +
    + {Array.from({ length: 3 }).map((_, idx) => ( // eslint-disable-next-line react/no-array-index-key - +
  • + +
    • ))} -
+ ); } diff --git a/src/components/common/skeleton/my-review-skeleton/index.tsx b/src/components/common/skeleton/my-review-skeleton/index.tsx index 057ededf..a841d070 100644 --- a/src/components/common/skeleton/my-review-skeleton/index.tsx +++ b/src/components/common/skeleton/my-review-skeleton/index.tsx @@ -2,14 +2,21 @@ import { Skeleton } from '@mantine/core'; export default function MyReviewSkeleton() { return ( -
- -
- - - - - +
+ + +
+
+ + +
+
+ + +
+
+ +
); From 59f5c64752395fce4c20e6e64dd8ef623897c9a6 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Thu, 21 Nov 2024 18:56:03 +0900 Subject: [PATCH 19/24] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20refactor:=20?= =?UTF-8?q?=EC=BD=94=EB=93=9C=20=EB=A6=AC=ED=8C=A9=ED=86=A0=EB=A7=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/review-list/review-card.tsx | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/src/components/common/review-list/review-card.tsx b/src/components/common/review-list/review-card.tsx index eb40eddd..2198663e 100644 --- a/src/components/common/review-list/review-card.tsx +++ b/src/components/common/review-list/review-card.tsx @@ -5,6 +5,7 @@ import { toast } from 'react-toastify'; import { useRouter } from 'next/navigation'; import { useDisclosure } from '@mantine/hooks'; import { deleteReview } from '@/src/_apis/review/my-review-apis'; +import { cn } from '@/src/utils/cn'; import { formatDateWithYear } from '@/src/utils/format-date'; import Button from '@/src/components/common/input/button'; import ConfirmCancelModal from '@/src/components/common/modal/confirm-cancel-modal'; @@ -23,7 +24,6 @@ interface ReviewCardProps { crewName?: string; gatheringName?: string; refetch?: () => void; - reviewer?: ReviewerType; } @@ -87,7 +87,11 @@ export default function ReviewCard({ )}
{isMine && ( @@ -111,9 +115,10 @@ export default function ReviewCard({ {reviewDate}
+
{isMine && ( )}
- {/* 삭제 확인 모달 */} Date: Thu, 21 Nov 2024 18:56:37 +0900 Subject: [PATCH 20/24] =?UTF-8?q?=F0=9F=92=84=20design:=20=EB=94=94?= =?UTF-8?q?=EC=9E=90=EC=9D=B8=EC=97=90=20=EB=A7=9E=EA=B2=8C=20=EC=88=98?= =?UTF-8?q?=EC=A0=95,=20=EB=88=84=EB=9D=BD=EB=90=9C=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=20=EC=B6=94=EA=B0=80,=20=EB=B0=98=EC=9D=91=ED=98=95?= =?UTF-8?q?=20=EC=9E=91=EC=97=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../reviewable-gathering-card-list.tsx | 10 ++- .../reviewable-gathering-card.stories.tsx | 47 ++++++++++++ .../reviewable-gathering-card.tsx | 71 +++++++++++-------- 3 files changed, 95 insertions(+), 33 deletions(-) create mode 100644 src/components/my-page/reviewable-gatherings/reviewable-gathering-card.stories.tsx diff --git a/src/components/my-page/reviewable-gatherings/reviewable-gathering-card-list.tsx b/src/components/my-page/reviewable-gatherings/reviewable-gathering-card-list.tsx index 7879e340..fd850269 100644 --- a/src/components/my-page/reviewable-gatherings/reviewable-gathering-card-list.tsx +++ b/src/components/my-page/reviewable-gatherings/reviewable-gathering-card-list.tsx @@ -2,11 +2,11 @@ import { useGetReviewableQuery } from '@/src/_queries/my-gathering/reviewable-gathering-list'; import { useInfiniteScroll } from '@/src/hooks/use-infinite-scroll'; -import { ReviewableGatheringCardInformResponse } from '@/src/types/reviewable-gathering-card'; +import MyReviewSkeletonList from '../../common/skeleton/my-review-skeleton-list/index'; import ReviewableGatheringCard from './reviewable-gathering-card'; export default function ReviewableGatheringCardList() { - const { data, ref, isFetchingNextPage } = useInfiniteScroll( + const { data, ref, isFetchingNextPage, isLoading } = useInfiniteScroll( useGetReviewableQuery({ pageable: { page: 0, size: 6, sort: ['dateTime,desc'] }, }), @@ -17,6 +17,11 @@ export default function ReviewableGatheringCardList() { data.pages.length === 0 || data.pages.every((page) => Array.isArray(page.content) && page.content.length === 0); + // 로딩 중일 때 스켈레톤 표시 + if (isLoading) { + return ; + } + return (
    {/* 데이터가 비었을 때 메시지 */} @@ -31,6 +36,7 @@ export default function ReviewableGatheringCardList() { = { + title: 'Components/ReviewableGatheringCard', + component: ReviewableGatheringCard, + tags: ['autodocs'], + parameters: { + layout: 'fullscreen', + }, + decorators: [ + (Story) => ( +
    + +
    + ), + ], +}; + +export default meta; + +type Story = StoryObj; + +export const Default: Story = { + args: { + id: 1, + gatheringName: '모임모임모임모임모임모밈미밈미미미미미미', + location: '모임모임모임모임모임모밈미밈미미미미미미', + dateTime: '2024-11-21T18:30:00.000Z', + currentCount: 8, + totalCount: 12, + imageUrl: 'https://i.pinimg.com/736x/5d/83/ce/5d83cec545201e5ca8f2477070e2eac9.jpg', + participants: [ + { id: 1, nickname: '유저1', profileImageUrl: '' }, + { id: 2, nickname: '유저2', profileImageUrl: '' }, + { id: 3, nickname: '유저3', profileImageUrl: '' }, + ], + }, +}; diff --git a/src/components/my-page/reviewable-gatherings/reviewable-gathering-card.tsx b/src/components/my-page/reviewable-gatherings/reviewable-gathering-card.tsx index a302809d..c479b416 100644 --- a/src/components/my-page/reviewable-gatherings/reviewable-gathering-card.tsx +++ b/src/components/my-page/reviewable-gatherings/reviewable-gathering-card.tsx @@ -12,6 +12,7 @@ import ReviewingModal from '../reviewing-modal/reviewing-modal'; interface ReviewableGatheringCardProps { id: number; gatheringName: string; + location: string; dateTime: string; currentCount: number; totalCount: number; @@ -23,6 +24,7 @@ export default function ReviewableGatheringCard({ id, currentCount, dateTime, + location, gatheringName, imageUrl, participants, @@ -38,8 +40,9 @@ export default function ReviewableGatheringCard({ })); return ( -
    - +
    + {/* 이미지 영역 */} +
    {gatheringName} - -
    -
    -
    -
    - {gatheringName} -
    -
    - - 참여 인원 - - - {currentCount}/{totalCount} - - -
    +
    + {/* 텍스트 및 버튼 영역 */} +
    + {/* 모임 이름 */} +
    + + {gatheringName} + + {location} +
    + {/* 참여 인원 */} +
    +
    + 참여 인원
    -
    {formatDate}
    + + {currentCount}/{totalCount} + +
    - + {/* 날짜 */} +
    {formatDate}
    + {/* 리뷰 작성 버튼 */} + + {/* 모달 */} Date: Thu, 21 Nov 2024 19:05:48 +0900 Subject: [PATCH 21/24] =?UTF-8?q?=F0=9F=90=9B=20fix:=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=EB=AA=85=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../[id]/_components/rating-display.stories.tsx | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/app/(crew)/crew/detail/[id]/_components/rating-display.stories.tsx b/src/app/(crew)/crew/detail/[id]/_components/rating-display.stories.tsx index aa2875c7..290d7fbc 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/rating-display.stories.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/rating-display.stories.tsx @@ -7,29 +7,29 @@ export default { component: RatingDisplay, tags: ['autodocs'], argTypes: { - totalReviewCount: { control: 'number', description: '총 평가 개수' }, + totalRate: { control: 'number', description: '총 평가 개수' }, averageRate: { control: 'number', description: '평균 평점' }, ratingsData: { control: 'object', description: '각 점수별 평가 개수' }, }, } as Meta; interface RatingDisplayStoryProps { - totalReviewCount: number; + totalRate: number; averageRate: number; ratingsData: { score: number; count: number }[]; } // Template을 함수 선언으로 변경하고 StoryFn 타입을 사용 const Template: StoryFn = function Template(args) { - const { totalReviewCount, averageRate, ratingsData } = args; - const reviewRateInfo: ReviewRateInfo = { totalReviewCount, averageRate, ratingsData }; + const { totalRate, averageRate, ratingsData } = args; + const reviewRateInfo: ReviewRateInfo = { totalRate, averageRate, ratingsData }; return ; }; // 스토리 정의 export const Default = Template.bind({}); Default.args = { - totalReviewCount: 24, + totalRate: 24, averageRate: 3.5, ratingsData: [ { score: 5, count: 6 }, @@ -42,7 +42,7 @@ Default.args = { export const HighRating = Template.bind({}); HighRating.args = { - totalReviewCount: 15, + totalRate: 15, averageRate: 4.7, ratingsData: [ { score: 5, count: 10 }, @@ -55,7 +55,7 @@ HighRating.args = { export const LowRating = Template.bind({}); LowRating.args = { - totalReviewCount: 20, + totalRate: 20, averageRate: 1.8, ratingsData: [ { score: 5, count: 1 }, From 735f463ce0f46589f0dfc120f3bd8f2e385c6ab6 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Fri, 22 Nov 2024 10:15:58 +0900 Subject: [PATCH 22/24] =?UTF-8?q?=F0=9F=9A=91=20fix:=20=EB=A7=88=EC=9D=B4?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20401=EB=A1=9C=EC=A7=81=20=EC=88=98?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../_components/profile-card/container.tsx | 33 ++++--------------- 1 file changed, 6 insertions(+), 27 deletions(-) diff --git a/src/app/(crew)/my-page/_components/profile-card/container.tsx b/src/app/(crew)/my-page/_components/profile-card/container.tsx index 807377bd..b7c99061 100644 --- a/src/app/(crew)/my-page/_components/profile-card/container.tsx +++ b/src/app/(crew)/my-page/_components/profile-card/container.tsx @@ -14,32 +14,13 @@ import ProfileSkeleton from '@/src/components/common/skeleton/profile-skeleton'; import ProfileCardPresenter from './presenter'; export default function ProfileCard() { - const router = useRouter(); - const { isAuth } = useAuth(); const { data: user, isLoading: userLoading, refetch: refetchUser } = useUser(); - const [profileImageUrl, setProfileImageUrl] = useState(''); - const [isAuthChecked, setIsAuthChecked] = useState(false); + const profileImageUrl = user?.profileImageUrl || ''; - useEffect(() => { - if (userLoading) return; + // 로딩 중일 때 스켈레톤 표시 + if (userLoading) return ; - if (user) { - setIsAuthChecked(true); - } else if (!isAuth) { - toast.error('로그인이 필요합니다.'); - router.push('/login'); - } else { - setIsAuthChecked(true); - } - }, [user, userLoading, isAuth, router]); - - useEffect(() => { - if (user?.profileImageUrl) { - setProfileImageUrl(user.profileImageUrl); - } - }, [user]); - - if (userLoading || !isAuthChecked) return ; + // 사용자 데이터가 없는 경우 null 반환 if (!user) return null; const handleEdit = () => { @@ -58,10 +39,9 @@ export default function ProfileCard() { await updateUserProfile(file); const tempUrl = URL.createObjectURL(file); - setProfileImageUrl(tempUrl); - - await refetchUser(); + // 임시 URL을 React Query가 refetch로 갱신될 때까지 보여줌 toast.success('프로필 이미지가 업데이트되었습니다.'); + await refetchUser(); } catch (error) { toast.error('파일 업로드에 실패했습니다.'); } @@ -74,7 +54,6 @@ export default function ProfileCard() { try { await resetUserProfileImage(); await refetchUser(); - setProfileImageUrl(''); // 초기화된 이미지 반영 toast.success('프로필 이미지가 초기화되었습니다.'); } catch (error) { toast.error('프로필 이미지 초기화에 실패했습니다.'); From 6de093861ceae1d6b611e24bcc8105ac4189d1ee Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Fri, 22 Nov 2024 10:16:43 +0900 Subject: [PATCH 23/24] =?UTF-8?q?=E2=9C=A8=20feat:=20=EB=A1=9C=EA=B7=B8?= =?UTF-8?q?=EC=9D=B8=EC=83=81=ED=83=9C=EA=B0=80=20=EC=95=84=EB=8B=90?= =?UTF-8?q?=EA=B2=BD=EC=9A=B0=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=EB=A1=9C=20=EC=9D=B4=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../[id]/_components/detail-crew-container.tsx | 6 +++++- .../gathering-detail-modal/container.tsx | 10 +++++++--- .../[id]/_components/gathering-list-section.tsx | 14 ++++++++++---- 3 files changed, 22 insertions(+), 8 deletions(-) diff --git a/src/app/(crew)/crew/detail/[id]/_components/detail-crew-container.tsx b/src/app/(crew)/crew/detail/[id]/_components/detail-crew-container.tsx index e7e2b577..71f1b2fe 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/detail-crew-container.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/detail-crew-container.tsx @@ -62,7 +62,11 @@ export default function DetailCrew({ id }: DetailCrewContainerProps) { await refetch(); } catch (joinError) { if (joinError instanceof ApiError) { - toast.error(joinError.message); + if (joinError.status === 401) { + router.push(`/login?redirect=${encodeURIComponent(window.location.pathname)}`); + } else { + toast.error(joinError.message); + } } else { toast.error('🚫 크루 참여 중 에러가 발생했습니다.'); } diff --git a/src/app/(crew)/crew/detail/[id]/_components/gathering-detail-modal/container.tsx b/src/app/(crew)/crew/detail/[id]/_components/gathering-detail-modal/container.tsx index 37a61136..3895049b 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/gathering-detail-modal/container.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/gathering-detail-modal/container.tsx @@ -1,6 +1,7 @@ 'use client'; import { toast } from 'react-toastify'; +import { useRouter } from 'next/navigation'; import { CancelGathering, JoinGathering, @@ -26,16 +27,19 @@ export default function GatheringDetailModalContainer({ const showToast = (message: string, type: 'success' | 'error' | 'warning') => { toast(message, { type }); }; + const router = useRouter(); const handleJoin = async () => { try { await JoinGathering(data.crewId, data.id); - showToast('약속에 참여했습니다.', 'success'); close(); onUpdate?.(); } catch (error) { - if (error instanceof ApiError) { - showToast(`참여 중 에러 발생: ${error.message}`, 'error'); + if (error instanceof ApiError && error.status === 401) { + const redirectUrl = `/login?redirect=${encodeURIComponent(window.location.pathname)}`; + router.push(redirectUrl); + } else { + showToast('참여 중 에러가 발생했습니다.', 'error'); } } }; diff --git a/src/app/(crew)/crew/detail/[id]/_components/gathering-list-section.tsx b/src/app/(crew)/crew/detail/[id]/_components/gathering-list-section.tsx index 59d9c11f..bf70da8a 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/gathering-list-section.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/gathering-list-section.tsx @@ -22,9 +22,12 @@ export default function GatheringListSection({ id }: GatheringListSectionProps) const handleLike = async (gatheringId: number) => { try { await addLike(gatheringId); + toast.success('찜하기가 완료되었습니다!'); } catch (apiError) { - if (apiError instanceof ApiError) { - toast.error(`찜하기에 실패했습니다`); + if (apiError instanceof ApiError && apiError.status === 401) { + toast.error('로그인이 필요합니다.'); + } else { + toast.error('찜하기에 실패했습니다.'); } } }; @@ -32,9 +35,12 @@ export default function GatheringListSection({ id }: GatheringListSectionProps) const handleUnlike = async (gatheringId: number) => { try { await removeLike(gatheringId); + toast.success('찜하기 해제가 완료되었습니다!'); } catch (apiError) { - if (apiError instanceof ApiError) { - toast.error(`찜하기 해제에 실패했습니다`); + if (apiError instanceof ApiError && apiError.status === 401) { + toast.error('로그인이 필요합니다.'); + } else { + toast.error('찜하기 해제에 실패했습니다.'); } } }; From 5a89fe7dc7133e73fe00a60c894b2b3a9536c268 Mon Sep 17 00:00:00 2001 From: HaeJungg Date: Fri, 22 Nov 2024 10:24:46 +0900 Subject: [PATCH 24/24] =?UTF-8?q?=F0=9F=90=9B=20fix:=20=EC=95=88=EC=93=B0?= =?UTF-8?q?=EB=8A=94=20=EC=9E=84=EC=8B=9C=ED=8C=8C=EC=9D=BC=20=EC=82=AD?= =?UTF-8?q?=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/(crew)/my-page/_components/profile-card/container.tsx | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/app/(crew)/my-page/_components/profile-card/container.tsx b/src/app/(crew)/my-page/_components/profile-card/container.tsx index b7c99061..263f9a1e 100644 --- a/src/app/(crew)/my-page/_components/profile-card/container.tsx +++ b/src/app/(crew)/my-page/_components/profile-card/container.tsx @@ -37,9 +37,6 @@ export default function ProfileCard() { try { await updateUserProfile(file); - - const tempUrl = URL.createObjectURL(file); - // 임시 URL을 React Query가 refetch로 갱신될 때까지 보여줌 toast.success('프로필 이미지가 업데이트되었습니다.'); await refetchUser(); } catch (error) {