diff --git a/src/bookmarks/ui/BookmarkArticle.tsx b/src/bookmarks/ui/BookmarkArticle.tsx index 4092e3e6..7e53f0dd 100644 --- a/src/bookmarks/ui/BookmarkArticle.tsx +++ b/src/bookmarks/ui/BookmarkArticle.tsx @@ -57,11 +57,15 @@ const BookMarkArticle = ({ memberId, }); + const isMyPost = bookmarkDetail?.memberId === memberId; + const onClickLike = () => { + if (!isMyPost) return; postBookmarkLike({ bookmarkId: bookmarkId ?? '' }); }; const onClickDislike = () => { + if (!isMyPost) return; postBookmarkDislike({ bookmarkId: bookmarkId ?? '' }); }; @@ -154,6 +158,7 @@ const BookMarkArticle = ({ diff --git a/src/bookmarks/ui/Like/BookmarkLikeButton.tsx b/src/bookmarks/ui/Like/BookmarkLikeButton.tsx index b689c446..e9f38483 100644 --- a/src/bookmarks/ui/Like/BookmarkLikeButton.tsx +++ b/src/bookmarks/ui/Like/BookmarkLikeButton.tsx @@ -4,12 +4,14 @@ import styled from '@emotion/styled'; interface BookMarkLikeButtonProps { isLike: boolean; + isMyPost?: boolean; onClickLike?: () => void; onClickDislike?: () => void; } const BookmarkLikeButton = ({ isLike, + isMyPost = true, onClickLike, onClickDislike, }: BookMarkLikeButtonProps) => { @@ -18,6 +20,7 @@ const BookmarkLikeButton = ({ onClick={() => { isLike ? onClickDislike?.() : onClickLike?.(); }} + disabled={!isMyPost} > {isLike ? ( @@ -30,10 +33,14 @@ const BookmarkLikeButton = ({ export default BookmarkLikeButton; -const LikeButton = styled.button` +interface LikeButtonProps { + disabled: boolean; +} + +const LikeButton = styled.button` width: ${getRem(40)}; height: 100%; &:active { - opacity: 0.5; + opacity: ${({ disabled }) => (disabled ? 1 : 0.5)}; } `;