fix: bookmark error

Tra-Book · Oct 1, 2024 · efc4462 · efc4462
1 parent eeeaa7f
commit efc4462
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 9 deletions.
diff --git a/components/plan/details/Comments.tsx b/components/plan/details/Comments.tsx
@@ -9,6 +9,7 @@ import { Button } from '@/components/ui/button'
 import { Textarea } from '@/components/ui/textarea'
 import { USER_DEFAULT_IMAGE } from '@/lib/constants/dummy_data'
 import { ClientModalData } from '@/lib/constants/errors'
+import { NO_USER_DESCRIPTION, NO_USER_NAME } from '@/lib/constants/no_data'
 import { ROUTES } from '@/lib/constants/routes'
 import { queryClient } from '@/lib/HTTP/http'
 import { addComment } from '@/lib/HTTP/plan/API'
@@ -301,7 +302,7 @@ const PlanComment = ({ id, comment, handleAddChildComment }: PlanCommentProps):
 
         <div className='flex flex-grow flex-col items-start justify-start'>
           <div className='relative flex w-full items-center justify-start gap-2 text-lg font-semibold'>
-            <span>{userName}</span>
+            <span>{userName || NO_USER_NAME}</span>
             <span className='text-xs text-tbGray'>{getRelativeTimeString(new Date(time))}</span>
             <div className='absolute right-0 top-0 flex flex-row items-center justify-end gap-2'>
               {id === 'parentComment' && (
@@ -311,7 +312,7 @@ const PlanComment = ({ id, comment, handleAddChildComment }: PlanCommentProps):
               <LucideIcon name='EllipsisVertical' size={18} className='cursor-pointer' />
             </div>
           </div>
-          <p className='text-sm text-tbGray'>{userStatusMessage}</p>
+          <p className='text-sm text-tbGray'>{userStatusMessage || NO_USER_DESCRIPTION}</p>
         </div>
       </div>
       <div className='line-clamp-2 flex w-full items-end justify-start gap-4'>{content}</div>

diff --git a/components/plan/details/Description.tsx b/components/plan/details/Description.tsx
@@ -49,7 +49,7 @@ const Description = ({ plan, planUser, user, className }: DescriptionProps): Rea
     id,
   } = plan
   const [tmpIsLiked, setTmpIsLiked] = useState<boolean>(isLiked)
-  const [tmpIsScrap, setTmpIsScrap] = useState<boolean>(isScraped)
+  const [tmpIsScraped, setTmpIsScraped] = useState<boolean>(isScraped)
 
   const onConfirm = () => {
     if (modalData.id === 'confirm') {
@@ -92,13 +92,13 @@ const Description = ({ plan, planUser, user, className }: DescriptionProps): Rea
   // #1. Plan Scrap Mutations
   const { mutate: scrapMutate } = useMutation({
     mutationKey: ['plan', 'scrap', { planId: id }],
-    mutationFn: !tmpIsScrap ? planAddScrap : planDeleteScrap,
+    mutationFn: !tmpIsScraped ? planAddScrap : planDeleteScrap,
     onSuccess: () => {
-      setTmpIsScrap(prev => !prev)
+      setTmpIsScraped(prev => !prev)
       toast({ title: '변경 완료!' })
     },
     onError: () => {
-      setTmpIsScrap(prev => !prev)
+      setTmpIsScraped(prev => !prev)
     },
     onSettled: () => {
       queryClient.invalidateQueries({ queryKey: ['plan', 'scrap', { planId: id }] })
@@ -160,16 +160,16 @@ const Description = ({ plan, planUser, user, className }: DescriptionProps): Rea
               fill={tmpIsLiked ? 'tbRed' : undefined}
               // strokeWidth={tmpIsLiked ? 0 : 2}
               size={20}
-              className={cn(tmpIsScrap ? 'hover:fill-none' : 'hover:fill-tbRed')}
+              // className={cn(tmpIsScraped ? 'hover:fill-none' : 'hover:fill-tbRed')}
             />
             <span>{likeCnt}</span>
           </div>
           <div className='flex w-fit items-center justify-start gap-1 text-lg'>
             <LucideIcon
               onClick={scrapHandler}
               name='Bookmark'
-              className={cn(tmpIsScrap ? 'hover:fill-none' : 'hover:fill-tbPrimaryHover')}
-              fill={isScraped ? 'tbPrimaryHover' : undefined}
+              // className={cn(tmpIsScraped ? 'hover:fill-none' : 'hover:fill-tbPrimaryHover')}
+              fill={tmpIsScraped ? 'tbPrimaryHover' : undefined}
               size={20}
             />
             <span>{scrapCnt}</span>

diff --git a/lib/HTTP/plan/API.ts b/lib/HTTP/plan/API.ts
@@ -361,6 +361,7 @@ interface PlanDeleteScrapType {
 }
 export const planDeleteScrap = async ({ planId, accessToken }: PlanDeleteScrapType) => {
   const Route = BACKEND_ROUTES.PLAN.SCRAP.DELETE
+  console.log('Plan Delete scrap')
 
   const queries: Queries = [
     {