fix: keep timeline ordered and complete after submitting reviews and comments

Submitting a review inserted its event at the front of the ascending
timeline, rendering it at the top of the conversation until the next
refetch moved it into place, and the eventual-consistency fallback
dropped the reviewer's previous review. Refetches after adding a
comment, replying to a thread, editing/deleting, or deleting/restoring
the branch could serve the stale cached timeline, silently dropping
just-created items.

Reviews are now inserted at the end (their real chronological spot)
using the review identity returned by the submit mutation, and every
refetch that must observe fresh data invalidates the cache first.

Author: glehmann

src/browser/components/pr-overview.tsx

@@ -374,6 +374,9 @@ export const PROverview = memo(function PROverview() {
         author_association: newComment.author_association,
         actor: newComment.user!,
       } as TimelineEvent);
+      // Invalidate so later timeline refetches can't serve the cached
+      // pre-comment timeline and drop the local event.
+      github.invalidatePR(owner, repo, pr.number);
       setCommentText("");
     } catch (error) {
       console.error("Failed to add comment:", error);
@@ -990,6 +993,8 @@ export const PROverview = memo(function PROverview() {
         await github.createPRComment(owner, repo, pr.number, body, {
           reply_to_id: commentId,
         });
+        // Invalidate so the refetches below can't serve stale cached data
+        github.invalidatePR(owner, repo, pr.number);
         // Refresh threads to show new comment
         const result = await github.getReviewThreads(owner, repo, pr.number);
         store.setReviewThreads(result.threads);
@@ -1059,6 +1064,8 @@ export const PROverview = memo(function PROverview() {
   );
 
   const refreshConversation = useCallback(async () => {
+    // Invalidate so the refetch below can't serve the stale cached timeline
+    github.invalidatePR(owner, repo, pr.number);
     const [newComments, newTimeline] = await Promise.all([
       github.getPRComments(owner, repo, pr.number).catch(() => []),
       github.getPRTimeline(owner, repo, pr.number).catch(() => []),

src/browser/contexts/github.tsx

@@ -2267,12 +2267,22 @@ function createGitHubStore() {
     reviewId: string,
     event: "APPROVE" | "REQUEST_CHANGES" | "COMMENT",
     body?: string
-  ): Promise<void> {
+  ): Promise<{ databaseId: number; submittedAt: string | null } | null> {
     if (!batcher) throw new Error("Not initialized");
-    await batcher.query(
-      `mutation ($input: SubmitPullRequestReviewInput!) { submitPullRequestReview(input: $input) { pullRequestReview { id } } }`,
+    const result = await batcher.query<{
+      submitPullRequestReview: {
+        pullRequestReview: {
+          databaseId: number;
+          submittedAt: string | null;
+        } | null;
+      } | null;
+    }>(
+      `mutation ($input: SubmitPullRequestReviewInput!) { submitPullRequestReview(input: $input) { pullRequestReview { databaseId submittedAt } } }`,
       { input: { pullRequestReviewId: reviewId, event, body: body ?? "" } }
     );
+    const review = result.submitPullRequestReview?.pullRequestReview;
+    if (!review) return null;
+    return { databaseId: review.databaseId, submittedAt: review.submittedAt };
   }
 
   async function getReviewReactions(reviewNodeId: string): Promise<Reaction[]> {

src/browser/contexts/pr-review/index.tsx

@@ -3982,6 +3982,9 @@ export class PRReviewStore {
     try {
       await this.github.deleteBranch(owner, repo, pr.head.ref);
 
+      // Invalidate so the refetch below can't serve the stale cached timeline
+      this.invalidatePRCaches(owner, repo, pr.number);
+
       // Refetch timeline to show delete event
       const updatedTimeline = await this.github
         .getPRTimeline(owner, repo, pr.number)
@@ -4012,6 +4015,9 @@ export class PRReviewStore {
     try {
       await this.github.restoreBranch(owner, repo, pr.head.ref, pr.head.sha);
 
+      // Invalidate so the refetch below can't serve the stale cached timeline
+      this.invalidatePRCaches(owner, repo, pr.number);
+
       // Refetch timeline to show restore event
       const updatedTimeline = await this.github
         .getPRTimeline(owner, repo, pr.number)

src/browser/contexts/pr-review/useReviewActions.ts

@@ -33,12 +33,31 @@ export function useReviewActions() {
 
       if (reviewNodeId) {
         try {
-          // Submit via GraphQL - we'll find the review ID after refreshing
-          await github.submitPendingReview(
+          const submitted = await github.submitPendingReview(
             reviewNodeId,
             event,
             state.reviewBody
           );
+          if (submitted) {
+            // Build the review from server identity so the UI can show it
+            // immediately, even if the refetch below is stale.
+            newReview = {
+              id: submitted.databaseId,
+              user: currentUser
+                ? {
+                    login: currentUser,
+                    avatar_url: `https://avatars.githubusercontent.com/${currentUser}`,
+                  }
+                : null,
+              state:
+                event === "APPROVE"
+                  ? "APPROVED"
+                  : event === "REQUEST_CHANGES"
+                    ? "CHANGES_REQUESTED"
+                    : "COMMENTED",
+              submitted_at: submitted.submittedAt,
+            } as Review;
+          }
           submittedViaGraphQL = true;
         } catch {
           // GraphQL failed (e.g. pending review was already submitted).
@@ -96,53 +115,15 @@ export function useReviewActions() {
 
       // If the review we just submitted isn't in the re-fetched data yet
       // (eventual consistency), add it manually so it appears immediately.
-      const addReviewToArray = (review: Review) => {
-        // Remove any stale review by the same user so the new one takes effect
-        const existingIdx = reviews.findIndex(
-          (r) => r.user?.login === review.user?.login
-        );
-        if (existingIdx !== -1) reviews.splice(existingIdx, 1);
-        reviews.unshift(review);
-      };
-
+      // The timeline is ascending, so a just-created review goes last.
       if (newReview?.id && !reviews.some((r) => r.id === newReview!.id)) {
-        addReviewToArray(newReview);
-        timeline.unshift({
+        reviews.unshift(newReview);
+        timeline.push({
           id: newReview.id,
           event: "reviewed",
           actor: { login: currentUser ?? "", avatar_url: "" },
-          created_at: new Date().toISOString(),
+          created_at: newReview.submitted_at ?? new Date().toISOString(),
         } as TimelineEvent);
-      } else if (!newReview && currentUser) {
-        // GraphQL path: submitPendingReview returns void, so newReview is null.
-        // Construct a synthetic review so the UI updates immediately.
-        const submittedAt = new Date().toISOString();
-        const syntheticReview = {
-          id: Date.now(),
-          user: {
-            login: currentUser,
-            avatar_url: `https://avatars.githubusercontent.com/${currentUser}`,
-          },
-          state:
-            event === "APPROVE"
-              ? "APPROVED"
-              : event === "REQUEST_CHANGES"
-                ? "CHANGES_REQUESTED"
-                : "COMMENTED",
-          submitted_at: submittedAt,
-        } as Review;
-        if (!reviews.some((r) => r.user?.login === currentUser)) {
-          addReviewToArray(syntheticReview);
-          timeline.unshift({
-            id: syntheticReview.id,
-            event: "reviewed",
-            actor: {
-              login: currentUser,
-              avatar_url: `https://avatars.githubusercontent.com/${currentUser}`,
-            },
-            created_at: submittedAt,
-          } as TimelineEvent);
-        }
       }
 
       store.setComments(newComments as ReviewComment[]);