diff --git a/src/components/BeerIndex/BeerCard.tsx b/src/components/BeerIndex/BeerCard.tsx
index 204ac61..620af43 100644
--- a/src/components/BeerIndex/BeerCard.tsx
+++ b/src/components/BeerIndex/BeerCard.tsx
@@ -9,7 +9,7 @@ import BeerPostLikeButton from '../BeerById/BeerPostLikeButton';
 
 const BeerCard: FC<{ post: z.infer<typeof beerPostQueryResult> }> = ({ post }) => {
   const { user } = useContext(UserContext);
-  const { mutate, likeCount } = useGetBeerPostLikeCount(post.id);
+  const { mutate, likeCount, isLoading } = useGetBeerPostLikeCount(post.id);
 
   return (
     <div className="card card-compact bg-base-300" key={post.id}>
@@ -44,12 +44,14 @@ const BeerCard: FC<{ post: z.infer<typeof beerPostQueryResult> }> = ({ post }) =
               <span className="text-sm lg:text-lg">{post.abv}% ABV</span>
               <span className="text-sm lg:text-lg">{post.ibu} IBU</span>
             </div>
-            <span>
-              liked by {likeCount} user{likeCount === 1 ? '' : 's'}
-            </span>
+            {!isLoading && (
+              <span>
+                liked by {likeCount} user{likeCount === 1 ? '' : 's'}
+              </span>
+            )}
           </div>
           <div>
-            {user && <BeerPostLikeButton beerPostId={post.id} mutateCount={mutate} />}
+            {!!user && <BeerPostLikeButton beerPostId={post.id} mutateCount={mutate} />}
           </div>
         </div>
       </div>
diff --git a/src/components/BreweryIndex/BreweryCard.tsx b/src/components/BreweryIndex/BreweryCard.tsx
index e4f8594..63cc934 100644
--- a/src/components/BreweryIndex/BreweryCard.tsx
+++ b/src/components/BreweryIndex/BreweryCard.tsx
@@ -11,7 +11,7 @@ const BreweryCard: FC<{ brewery: z.infer<typeof BreweryPostQueryResult> }> = ({
   brewery,
 }) => {
   const { user } = useContext(UserContext);
-  const { likeCount, mutate } = useGetBreweryPostLikeCount(brewery.id);
+  const { likeCount, mutate, isLoading } = useGetBreweryPostLikeCount(brewery.id);
   return (
     <div className="card" key={brewery.id}>
       <figure className="card-image h-96">
@@ -40,7 +40,7 @@ const BreweryCard: FC<{ brewery: z.infer<typeof BreweryPostQueryResult> }> = ({
           </h4>
         </div>
         <div className="flex justify-between">
-          <span>liked by {likeCount} users</span>
+          {!isLoading && <span>liked by {likeCount} users</span>}
           {user && (
             <BreweryPostLikeButton breweryPostId={brewery.id} mutateCount={mutate} />
           )}