Merge pull request #189 from bitovi/fix-stale-data-in-voter-tooltip

Author: shoumaw

packages/client/src/components/common/ReactionStatistics/ReactionStatistics.tsx

@@ -8,6 +8,7 @@ export function ReactionStatistics({
   upvoters,
   downvotes = 0,
   downvoters,
+  isPending = false,
   onUpvote,
   onDownvote,
   className
@@ -20,6 +21,7 @@ export function ReactionStatistics({
         showCount={userVote === 'up'}
         count={upvotes}
         voters={upvoters}
+        isPending={isPending}
         onClick={onUpvote}
       />
       <VoteButton
@@ -28,6 +30,7 @@ export function ReactionStatistics({
         showCount={userVote === 'down'}
         count={downvotes}
         voters={downvoters}
+        isPending={isPending}
         onClick={onDownvote}
       />
     </div>

packages/client/src/components/common/ReactionStatistics/types.ts

@@ -37,6 +37,11 @@ export interface ReactionStatisticsProps {
    */
   onDownvote?: () => void;
 
+  /**
+   * Whether a mutation is pending
+   */
+  isPending?: boolean;
+  
   /**
    * Additional CSS classes
    */

packages/client/src/components/common/RelatedCasesAccordion/RelatedCasesAccordion.tsx

@@ -1,4 +1,4 @@
-import { formatCaseNumber } from '@carton/shared';
+import { formatCaseNumber } from '@carton/shared/client';
 import { RelationshipManagerAccordion } from '../RelationshipManagerAccordion/RelationshipManagerAccordion';
 
 interface RelatedCasesAccordionProps {

packages/client/src/components/common/VoteButton/VoteButton.tsx

@@ -9,6 +9,7 @@ export function VoteButton({
   showCount = true,
   count,
   voters,
+  isPending = false,
   onClick,
   className,
 }: VoteButtonProps) {
@@ -43,7 +44,8 @@ export function VoteButton({
   );
 
   // If voters are provided and there's a count, wrap with tooltip
-  if (voters && voters.length > 0 && count !== undefined && count > 0) {
+  // Skip tooltip if mutation is pending to avoid showing stale data
+  if (voters && voters.length > 0 && count !== undefined && count > 0 && !isPending) {
     const displayVoters = voters.slice(0, 3);
     const remainingCount = voters.length - 3;
 

packages/client/src/components/common/VoteButton/types.ts

@@ -31,6 +31,11 @@ export interface VoteButtonProps {
    */
   voters?: string[];
 
+  /**
+   * Whether a mutation is pending
+   */
+  isPending?: boolean;
+  
   /**
    * Click handler for voting interaction
    */