From e09e9505ca1c6f902ac80404d2b2582454cfa91a Mon Sep 17 00:00:00 2001 From: presentKey Date: Mon, 20 Nov 2023 16:59:56 +0900 Subject: [PATCH 1/6] =?UTF-8?q?feat:=20sidebar=20=EB=A9=94=EB=89=B4?= =?UTF-8?q?=EC=97=90=EC=84=9C=20=EC=83=81=EB=8B=A8=20=ED=94=84=EB=A1=9C?= =?UTF-8?q?=ED=95=84=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C,=20sidebar=20?= =?UTF-8?q?=EB=8B=AB=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Layout/Sidebar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Layout/Sidebar.tsx b/src/components/Layout/Sidebar.tsx index a762ab34..64d7c5db 100644 --- a/src/components/Layout/Sidebar.tsx +++ b/src/components/Layout/Sidebar.tsx @@ -112,7 +112,7 @@ export default function Sidebar({
{user && ( <> - + Date: Mon, 20 Nov 2023 17:06:16 +0900 Subject: [PATCH 2/6] =?UTF-8?q?feat:=20=EB=B3=84=EC=A0=90=20=ED=8F=89?= =?UTF-8?q?=EA=B0=80=20=EC=8B=9C,=20=ED=94=84=EB=A1=9C=ED=95=84=20?= =?UTF-8?q?=EB=B6=81=EB=A7=88=ED=81=AC=20query=20=EB=AC=B4=ED=9A=A8?= =?UTF-8?q?=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/features/reviews/hook/useEvaluation.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/features/reviews/hook/useEvaluation.ts b/src/features/reviews/hook/useEvaluation.ts index 82cdc993..492e917c 100644 --- a/src/features/reviews/hook/useEvaluation.ts +++ b/src/features/reviews/hook/useEvaluation.ts @@ -33,6 +33,8 @@ export default function useEvaluation(animeId: number) { queryClient.invalidateQueries(["evaluation", animeId, user?.memberId]); // 애니 평균 평점 조회 query 무효화 queryClient.invalidateQueries(["averageRating", animeId, user?.memberId]); + // 프로필 북마크 query 무효화 + queryClient.invalidateQueries(["profile", user?.memberId, "bookmark"]); }, onError: (error) => { if (error instanceof AxiosError && error.response?.status) { From a6389d344537aa0b414d67c78503c0b53fb9c0a0 Mon Sep 17 00:00:00 2001 From: presentKey Date: Mon, 20 Nov 2023 17:59:43 +0900 Subject: [PATCH 3/6] =?UTF-8?q?refactor:=20calcStarRatingAvg=20=ED=95=A8?= =?UTF-8?q?=EC=88=98=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/features/animes/hooks/useAnime.ts | 5 ++--- src/utils/common.ts | 4 ++++ 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/src/features/animes/hooks/useAnime.ts b/src/features/animes/hooks/useAnime.ts index ff0cd32a..3bb15773 100644 --- a/src/features/animes/hooks/useAnime.ts +++ b/src/features/animes/hooks/useAnime.ts @@ -2,6 +2,7 @@ import { useQuery } from "@tanstack/react-query"; import useAuth from "@/features/auth/hooks/useAuth"; import { useApi } from "@/hooks/useApi"; +import { calcStarRatingAvg } from "@/utils/common"; export default function useAnime(animeId: number) { const { animeApi } = useApi(); @@ -17,9 +18,7 @@ export default function useAnime(animeId: number) { queryFn: () => animeApi.getById(animeId), }); - const starRatingAvg = data - ? Math.floor((data.starRatingAvg / 2) * 10) / 10 - : 0; + const starRatingAvg = calcStarRatingAvg(data?.starRatingAvg); return { starRatingAvg, anime, isLoading }; } diff --git a/src/utils/common.ts b/src/utils/common.ts index 8dc2382e..5ff63e1d 100644 --- a/src/utils/common.ts +++ b/src/utils/common.ts @@ -11,3 +11,7 @@ export function compactNumber(data: number | string, lang: Lang = "en-US") { maximumFractionDigits: 1, }).format(data); } + +export function calcStarRatingAvg(score: number | undefined) { + return score ? Math.floor((score / 2) * 10) / 10 : 0; +} From c212606980a3ce768e00dae0480614ef10ae6ad4 Mon Sep 17 00:00:00 2001 From: presentKey Date: Mon, 20 Nov 2023 19:42:30 +0900 Subject: [PATCH 4/6] =?UTF-8?q?feat:=20calcStarRatingAvg()=20=EC=A0=81?= =?UTF-8?q?=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/features/animes/components/AnimeCard/index.tsx | 6 +++++- .../users/routes/Profile/TabMenu/BookmarkCard.tsx | 12 ++++++++++-- 2 files changed, 15 insertions(+), 3 deletions(-) diff --git a/src/features/animes/components/AnimeCard/index.tsx b/src/features/animes/components/AnimeCard/index.tsx index 41476193..b2e4212e 100644 --- a/src/features/animes/components/AnimeCard/index.tsx +++ b/src/features/animes/components/AnimeCard/index.tsx @@ -1,6 +1,8 @@ import { Star } from "@phosphor-icons/react"; import { Link } from "react-router-dom"; +import { calcStarRatingAvg } from "@/utils/common"; + import { AnimeCardContainer, Image, @@ -41,7 +43,9 @@ export default function AnimeCard({ {title} - {starScoreAvg === 0 ? "평가 전" : starScoreAvg / 2} + + {starScoreAvg === 0 ? "평가 전" : calcStarRatingAvg(starScoreAvg)}{" "} + diff --git a/src/features/users/routes/Profile/TabMenu/BookmarkCard.tsx b/src/features/users/routes/Profile/TabMenu/BookmarkCard.tsx index 5663effd..048c4983 100644 --- a/src/features/users/routes/Profile/TabMenu/BookmarkCard.tsx +++ b/src/features/users/routes/Profile/TabMenu/BookmarkCard.tsx @@ -2,6 +2,8 @@ import { AnimatePresence } from "framer-motion"; import { useState } from "react"; import { useNavigate } from "react-router-dom"; +import { calcStarRatingAvg } from "@/utils/common"; + import { BookmarkCardContainer, BottomContainer, @@ -44,13 +46,19 @@ export default function BookmarkCard({ bookmark, isMine }: BookmarkCardProps) { - 평균 {bookmark.avgScore / 2} + + {bookmark.avgScore < 0 ? ( + 평가전 + ) : ( + `별점 ${calcStarRatingAvg(bookmark.avgScore)}` + )} + {bookmark.myScore >= 0 && ( <> - 내 평점 {bookmark.myScore / 2} + 내 별점 {bookmark.myScore / 2} )} {bookmark.myScore < 0 && 평가전} From 57575a88bdf21c77536d329844c495e120e86d83 Mon Sep 17 00:00:00 2001 From: presentKey Date: Mon, 20 Nov 2023 19:45:35 +0900 Subject: [PATCH 5/6] =?UTF-8?q?style:=20=EC=BD=94=EB=93=9C=20=EA=B3=B5?= =?UTF-8?q?=EB=B0=B1=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/features/animes/components/AnimeCard/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/features/animes/components/AnimeCard/index.tsx b/src/features/animes/components/AnimeCard/index.tsx index b2e4212e..e8309b72 100644 --- a/src/features/animes/components/AnimeCard/index.tsx +++ b/src/features/animes/components/AnimeCard/index.tsx @@ -44,7 +44,7 @@ export default function AnimeCard({ - {starScoreAvg === 0 ? "평가 전" : calcStarRatingAvg(starScoreAvg)}{" "} + {starScoreAvg === 0 ? "평가 전" : calcStarRatingAvg(starScoreAvg)} From 7b395c3056139a8eae15011c4ca5ca0b29ac864f Mon Sep 17 00:00:00 2001 From: presentKey Date: Mon, 20 Nov 2023 19:59:19 +0900 Subject: [PATCH 6/6] =?UTF-8?q?style:=20BookmarkCard=20hover=20=EC=8B=9C,?= =?UTF-8?q?=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20scale=20=EB=B3=80=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Profile/TabMenu/BookmarkCard.style.ts | 17 ++++++++++++----- .../routes/Profile/TabMenu/BookmarkCard.tsx | 5 ++++- 2 files changed, 16 insertions(+), 6 deletions(-) diff --git a/src/features/users/routes/Profile/TabMenu/BookmarkCard.style.ts b/src/features/users/routes/Profile/TabMenu/BookmarkCard.style.ts index cd1bf4e7..f5b248e1 100644 --- a/src/features/users/routes/Profile/TabMenu/BookmarkCard.style.ts +++ b/src/features/users/routes/Profile/TabMenu/BookmarkCard.style.ts @@ -8,23 +8,30 @@ export const BookmarkCardContainer = styled.div` padding: 16px; margin: 0 -16px; cursor: pointer; - transition: background-color ease 0.1s; @media (hover: hover) and (pointer: fine) { - &:hover { - background-color: #fdfdfd; + &:hover img { + transform: scale(1.2); } } `; -export const Image = styled.img` +export const ImageContainer = styled.div` flex-shrink: 0; width: 80px; height: 100px; + overflow: hidden; border-radius: 4px; - background-color: #d9d9d9; margin-right: 8px; `; +export const Image = styled.img` + width: 100%; + object-fit: cover; + background-color: #d9d9d9; + overflow: hidden; + transition: transform ease 0.2s; +`; + export const InfoContainer = styled.div` display: flex; flex-direction: column; diff --git a/src/features/users/routes/Profile/TabMenu/BookmarkCard.tsx b/src/features/users/routes/Profile/TabMenu/BookmarkCard.tsx index 048c4983..152c2697 100644 --- a/src/features/users/routes/Profile/TabMenu/BookmarkCard.tsx +++ b/src/features/users/routes/Profile/TabMenu/BookmarkCard.tsx @@ -9,6 +9,7 @@ import { BottomContainer, CreatedDate, Image, + ImageContainer, InfoContainer, MyScore, RatingContainer, @@ -39,7 +40,9 @@ export default function BookmarkCard({ bookmark, isMine }: BookmarkCardProps) { return ( <> - {bookmark.title} + + {bookmark.title} + {bookmark.title}