web/src/components/EmojiReaction/EmojiReaction.js

@@ -121,7 +121,9 @@ const EmojiReaction = ({
               </button>
             ))}
           </div>
-          <button onClick={onShowPartReactions}>View Reactions</button>
+          <button className="text-gray-700" onClick={onShowPartReactions}>
+            View Reactions
+          </button>
         </div>
       </Popover>
     </>

web/src/components/PartCell/PartCell.js

@@ -3,6 +3,7 @@ import { navigate, routes } from '@redwoodjs/router'
 import { useAuth } from '@redwoodjs/auth'
 
 import PartProfile from 'src/components/PartProfile'
+import { QUERY as PART_REACTION_QUERY } from 'src/components/PartReactionsCell/PartReactionsCell'
 
 export const QUERY = gql`
   query FIND_PART_BY_USERNAME_TITLE(
@@ -156,6 +157,12 @@ export const Success = ({ userPart, variables: { isEditable }, refetch }) => {
 
   const [toggleReaction] = useMutation(TOGGLE_REACTION_MUTATION, {
     onCompleted: () => refetch(),
+    refetchQueries: [
+      {
+        query: PART_REACTION_QUERY,
+        variables: { partId: userPart?.Part?.id },
+      },
+    ],
   })
   const onReaction = (emote) =>
     toggleReaction({

web/src/components/PartReactionsCell/PartReactionsCell.js

@@ -17,7 +17,11 @@ export const QUERY = gql`
 
 export const Loading = () => <div>Loading...</div>
 
-export const Empty = () => <div>Empty</div>
+export const Empty = () => (
+  <div className="text-center py-8 font-roboto text-gray-700">
+    No reactions to this part yet 😕
+  </div>
+)
 
 export const Failure = ({ error }) => <div>Error: {error.message}</div>