Continue work on brewery page, implement like system

src/components/BeerById/BeerInfoHeader.tsx

@@ -6,7 +6,7 @@ import UserContext from '@/contexts/userContext';
 import { FaRegEdit } from 'react-icons/fa';
 import beerPostQueryResult from '@/services/BeerPost/schema/BeerPostQueryResult';
 import { z } from 'zod';
-import useGetLikeCount from '@/hooks/useGetLikeCount';
+import useGetBeerPostLikeCount from '@/hooks/useBeerPostLikeCount';
 import useTimeDistance from '@/hooks/useTimeDistance';
 import BeerPostLikeButton from './BeerPostLikeButton';
 
@@ -20,7 +20,7 @@ const BeerInfoHeader: FC<{
   const idMatches = user && beerPost.postedBy.id === user.id;
   const isPostOwner = !!(user && idMatches);
 
-  const { likeCount, mutate } = useGetLikeCount(beerPost.id);
+  const { likeCount, mutate } = useGetBeerPostLikeCount(beerPost.id);
 
   return (
     <main className="card flex flex-col justify-center bg-base-300">

src/components/BeerById/BeerPostLikeButton.tsx

@@ -1,13 +1,13 @@
 import useCheckIfUserLikesBeerPost from '@/hooks/useCheckIfUserLikesBeerPost';
-import sendLikeRequest from '@/requests/sendLikeRequest';
+import sendBeerPostLikeRequest from '@/requests/sendBeerPostLikeRequest';
 import { FC, useEffect, useState } from 'react';
-import { FaThumbsUp, FaRegThumbsUp } from 'react-icons/fa';
 
-import useGetLikeCount from '@/hooks/useGetLikeCount';
+import useGetBeerPostLikeCount from '@/hooks/useBeerPostLikeCount';
+import LikeButton from '../ui/LikeButton';
 
 const BeerPostLikeButton: FC<{
   beerPostId: string;
-  mutateCount: ReturnType<typeof useGetLikeCount>['mutate'];
+  mutateCount: ReturnType<typeof useGetBeerPostLikeCount>['mutate'];
 }> = ({ beerPostId, mutateCount }) => {
   const { isLiked, mutate: mutateLikeStatus } = useCheckIfUserLikesBeerPost(beerPostId);
   const [loading, setLoading] = useState(true);
@@ -19,7 +19,7 @@ const BeerPostLikeButton: FC<{
   const handleLike = async () => {
     try {
       setLoading(true);
-      await sendLikeRequest(beerPostId);
+      await sendBeerPostLikeRequest(beerPostId);
 
       await Promise.all([mutateCount(), mutateLikeStatus()]);
       setLoading(false);
@@ -28,30 +28,7 @@ const BeerPostLikeButton: FC<{
     }
   };
 
-  return (
-    <button
-      type="button"
-      className={`btn-sm btn gap-2 rounded-2xl lg:btn-md ${
-        !isLiked ? 'btn-ghost outline' : 'btn-primary'
-      }`}
-      onClick={() => {
-        handleLike();
-      }}
-      disabled={loading}
-    >
-      {isLiked ? (
-        <>
-          <FaThumbsUp className="lg:text-2xl" />
-          Liked
-        </>
-      ) : (
-        <>
-          <FaRegThumbsUp className="lg:text-2xl" />
-          Like
-        </>
-      )}
-    </button>
-  );
+  return <LikeButton isLiked={!!isLiked} handleLike={handleLike} loading={loading} />;
 };
 
 export default BeerPostLikeButton;