feat(web): PR header state chips share one tinted style, and a ready PR says so

apps/server/src/pullRequest/PullRequestService.test.ts

@@ -149,6 +149,31 @@ it.effect("reads maintainer edits and changes them through the update command",
   }),
 );
 
+it.effect.each([
+  { reported: "approved" as const, expected: "approved" },
+  { reported: null, expected: null },
+  { reported: undefined, expected: undefined },
+])("carries the host's review decision ($reported) on the detail", ({ reported, expected }) =>
+  Effect.gen(function* () {
+    const service = yield* makeService({
+      projects: [project({ id: "p1", title: "web", workspaceRoot: "/w", repository: "acme/web" })],
+      providers: [
+        fakePullRequestProvider(SourceControlProviderKind.make("github"), {
+          getChangeRequest: () =>
+            Effect.succeed({ ...hostedChangeRequest("Body"), reviewDecision: reported }),
+        }),
+      ],
+    });
+    const detail = yield* service.detail({
+      projectId: "p1" as ProjectId,
+      repository: "acme/web",
+      number: 1,
+    });
+    assert.strictEqual(detail.reviewDecision, expected);
+    assert.strictEqual("reviewDecision" in detail, expected !== undefined);
+  }),
+);
+
 it.effect("refuses maintainer edits on a host without the capability", () =>
   Effect.gen(function* () {
     let writes = 0;

apps/server/src/pullRequest/PullRequestService.ts

@@ -1883,6 +1883,9 @@ export const make = Effect.gen(function* () {
             reviewers: changeRequest.reviewers,
             labels: changeRequest.labels,
             checks: changeRequest.checks,
+            ...(changeRequest.reviewDecision === undefined
+              ? {}
+              : { reviewDecision: changeRequest.reviewDecision }),
             mergeCapabilities: changeRequest.mergeCapabilities,
             viewerPermissions: changeRequest.viewerPermissions,
             ...(viewer === null || viewer.trim().length === 0 ? {} : { viewer }),

apps/web/src/components/pullRequest/PullRequestDetailActions.tsx

@@ -4,11 +4,17 @@ import type {
   PullRequestMergeMethod,
   PullRequestUpdateMethod,
 } from "@t3tools/contracts";
-import { CheckIcon, ChevronDownIcon, FolderGit2Icon, GitBranchIcon, PlayIcon } from "lucide-react";
+import {
+  CheckIcon,
+  ChevronDownIcon,
+  CircleCheckIcon,
+  FolderGit2Icon,
+  GitBranchIcon,
+  PlayIcon,
+} from "lucide-react";
 import type { ReactNode } from "react";
 
 import { AnimatedWidth } from "~/components/AnimatedWidth";
-import { cn } from "~/lib/utils";
 import { EnvironmentMachineIcon } from "../EnvironmentMachineIcon";
 import { Badge } from "../ui/badge";
 import { Button } from "../ui/button";
@@ -192,6 +198,7 @@ export function PullRequestPrimaryAction({
   pullRequestKey,
   primaryAction,
   mergeBlockedReason,
+  readyToMerge,
   autoMergeArmed,
   armedAutoMergeLabel,
   pendingAutoMergeLabel,
@@ -205,6 +212,7 @@ export function PullRequestPrimaryAction({
   pullRequestKey: string;
   primaryAction: ReturnType<typeof resolvePullRequestPrimaryControl> | null;
   mergeBlockedReason: string | null;
+  readyToMerge: boolean;
   autoMergeArmed: boolean;
   armedAutoMergeLabel: string;
   pendingAutoMergeLabel: string;
@@ -219,6 +227,21 @@ export function PullRequestPrimaryAction({
   const actionPending = pendingAction !== null;
   return (
     <>
+      {readyToMerge ? (
+        <Tooltip>
+          <TooltipTrigger
+            render={
+              <Badge size="control" variant="success" role="img" aria-label="Ready to merge">
+                <CircleCheckIcon aria-hidden className="size-3.5" />
+                <span className="@max-[30rem]/pr-header:hidden">Ready to merge</span>
+              </Badge>
+            }
+          />
+          <TooltipPopup side="top">
+            Ready to merge: no conflicts, checks pass, and no review blocks it
+          </TooltipPopup>
+        </Tooltip>
+      ) : null}
       {autoMergeArmed && primaryAction !== "auto-merge-armed" ? (
         <Tooltip>
           <TooltipTrigger
@@ -383,11 +406,9 @@ export function PullRequestPrimaryAction({
         </Tooltip>
       ) : (primaryAction === "merged" || primaryAction === "closed") &&
         statePresentation !== null ? (
-        <Badge size="control" variant="outline">
-          <span className={cn("flex items-center gap-1", statePresentation.toneClassName)}>
-            <statePresentation.Icon className="size-3.5" />
-            {statePresentation.label}
-          </span>
+        <Badge size="control" variant={primaryAction === "merged" ? "merged" : "error"}>
+          <statePresentation.Icon aria-hidden className="size-3.5" />
+          {statePresentation.label}
         </Badge>
       ) : null}
     </>

apps/web/src/components/pullRequest/PullRequestDetailPanel.tsx

@@ -141,6 +141,7 @@ import {
   readableFailure,
   resolvePullRequestReferenceHost,
   resolvePullRequestPrimaryControl,
+  isPullRequestReadyToMerge,
   allowedPullRequestMergeMethods,
   allowsSinglePullRequestMerge,
   canDeletePullRequestBranch,
@@ -1274,6 +1275,19 @@ export function PullRequestDetailPanel({
       ? "pending"
       : latestChecksState;
   const checksStale = checksState !== detailChecksState;
+  const readyToMerge =
+    detail !== null &&
+    isPullRequestReadyToMerge({
+      state: detail.state,
+      isDraft: detail.isDraft,
+      mergeability: detail.mergeability,
+      checksState,
+      reviewDecision:
+        sharedSummary?.reviewDecision === undefined
+          ? detail.reviewDecision
+          : sharedSummary.reviewDecision,
+      autoMergeEnabled: detail.autoMergeEnabled,
+    });
   const primaryAction = detail
     ? resolvePullRequestPrimaryControl({
         state: detail.state,
@@ -1466,6 +1480,7 @@ export function PullRequestDetailPanel({
               ) : null}
               <PullRequestPrimaryAction
                 mergeBlockedReason={mergeBlockedReason}
+                readyToMerge={readyToMerge}
                 pullRequestKey={pullRequestKey}
                 primaryAction={primaryAction}
                 autoMergeArmed={autoMergeArmed}

apps/web/src/components/pullRequest/pullRequestDetail.logic.test.ts

@@ -46,6 +46,7 @@ import {
   resolveDisplayedPullRequestDetail,
   resolvePullRequestReferenceHost,
   resolvePullRequestPrimaryControl,
+  isPullRequestReadyToMerge,
   allowsSinglePullRequestMerge,
   shouldRefreshPullRequestActivity,
   resolveBaseFreshness,
@@ -194,6 +195,36 @@ describe("pull request primary control", () => {
     );
   });
 
+  it("is ready to merge only when nothing still waits or blocks", () => {
+    const ready = {
+      state: "open" as const,
+      isDraft: false,
+      mergeability: "mergeable" as const,
+      checksState: "passing" as const,
+      reviewDecision: "approved" as const,
+      autoMergeEnabled: false,
+    };
+    expect(isPullRequestReadyToMerge(ready)).toBe(true);
+    expect(isPullRequestReadyToMerge({ ...ready, checksState: null, reviewDecision: null })).toBe(
+      true,
+    );
+    expect(isPullRequestReadyToMerge({ ...ready, autoMergeEnabled: undefined })).toBe(true);
+    for (const blocked of [
+      { state: "merged" as const },
+      { isDraft: true },
+      { mergeability: "conflicting" as const },
+      { mergeability: "unknown" as const },
+      { checksState: "pending" as const },
+      { checksState: "failing" as const },
+      { reviewDecision: undefined },
+      { reviewDecision: "review-required" as const },
+      { reviewDecision: "changes-requested" as const },
+      { autoMergeEnabled: true },
+    ]) {
+      expect(isPullRequestReadyToMerge({ ...ready, ...blocked })).toBe(false);
+    }
+  });
+
   it("does not offer auto-merge while the host state is unknown", () => {
     expect(
       resolvePullRequestPrimaryControl({

apps/web/src/components/pullRequest/pullRequestDetail.logic.ts

@@ -31,6 +31,7 @@ import {
   type PullRequestReaction,
   type PullRequestMergeMethod,
   type PullRequestRef,
+  type PullRequestReviewDecision,
   type RepositoryIdentity,
   type PullRequestConversationThread,
   type PullRequestReviewThread,
@@ -118,6 +119,31 @@ export function resolvePullRequestPrimaryControl(input: {
   return input.canMerge ? "merge" : null;
 }
 
+/**
+ * Open, conflict-free, checks green, no blocking review, and auto-merge not armed.
+ * A `null` review decision means the host requires none; `undefined` means it did not say.
+ */
+export function isPullRequestReadyToMerge(input: {
+  readonly state: PullRequestState;
+  readonly isDraft: boolean;
+  readonly mergeability: PullRequestMergeability;
+  readonly checksState: ContractPullRequestChecksState | null;
+  readonly reviewDecision: PullRequestReviewDecision | null | undefined;
+  readonly autoMergeEnabled: boolean | undefined;
+}): boolean {
+  return (
+    input.state === "open" &&
+    !input.isDraft &&
+    input.mergeability === "mergeable" &&
+    input.checksState !== "pending" &&
+    input.checksState !== "failing" &&
+    input.reviewDecision !== undefined &&
+    input.reviewDecision !== "changes-requested" &&
+    input.reviewDecision !== "review-required" &&
+    input.autoMergeEnabled !== true
+  );
+}
+
 export function pullRequestCheckoutCommand(
   provider: SourceControlProviderKind,
   number: number,

apps/web/src/components/pullRequest/useInlineActionConfirm.browser.test.tsx

@@ -87,6 +87,7 @@ it.each(["merge", "enable-auto-merge"] as const)(
         pullRequestKey="owner/repo/7"
         primaryAction={primaryAction}
         mergeBlockedReason={mergeBlockedReason}
+        readyToMerge={false}
         autoMergeArmed={false}
         armedAutoMergeLabel="Auto-merge enabled"
         pendingAutoMergeLabel="Auto-merge (squash)"

apps/web/src/components/ui/badge.tsx

@@ -26,6 +26,7 @@ const badgeVariants = cva(
         destructive: "bg-destructive text-white [button&,a&]:hover:bg-destructive/90",
         error: "bg-destructive/8 text-destructive-foreground dark:bg-destructive/16",
         info: "bg-info/8 text-info-foreground dark:bg-info/16",
+        merged: "bg-merged/8 text-merged-foreground dark:bg-merged/16",
         outline:
           "border-input bg-background text-foreground dark:bg-input/32 [button&,a&]:hover:bg-accent/50 dark:[button&,a&]:hover:bg-input/48",
         secondary: "bg-secondary text-secondary-foreground [button&,a&]:hover:bg-secondary/90",

apps/web/src/index.css

@@ -247,6 +247,8 @@ html[data-mobile-composer-route-transition="true"]::view-transition-old(t3-mobil
   --color-diff-deletion-foreground: var(--diff-deletion-foreground);
   --color-info-foreground: var(--info-foreground);
   --color-info: var(--info);
+  --color-merged-foreground: var(--merged-foreground);
+  --color-merged: var(--merged);
   --color-guest: var(--guest);
   --color-guest-foreground: var(--guest-foreground);
   --color-guest-surface: var(--guest-surface);
@@ -1155,6 +1157,8 @@ html[data-mobile-composer-route-transition="true"]::view-transition-old(t3-mobil
   --destructive-foreground: var(--error-foreground);
   --info: var(--color-blue-500);
   --info-foreground: var(--color-blue-700);
+  --merged: var(--color-violet-500);
+  --merged-foreground: var(--color-violet-700);
   /* Messages from a guest link, and the sidebar Request status. */
   --guest: var(--color-fuchsia-500);
   --guest-foreground: var(--color-fuchsia-600);
@@ -1212,6 +1216,7 @@ html[data-mobile-composer-route-transition="true"]::view-transition-old(t3-mobil
     --border: --alpha(var(--color-white) / 8%);
     --input: --alpha(var(--color-white) / 11%);
     --info-foreground: var(--color-blue-400);
+    --merged-foreground: var(--color-violet-400);
     --guest-foreground: var(--color-fuchsia-300);
     --success-foreground: var(--color-emerald-400);
     --warning-foreground: var(--color-amber-400);

packages/contracts/src/pullRequest.ts

@@ -650,6 +650,8 @@ export const PullRequestDetail = Schema.Struct({
   reviewers: Schema.Array(PullRequestActor),
   labels: Schema.Array(PullRequestLabel),
   checks: Schema.Array(PullRequestCheck),
+  /** Null means the host requires no review; absent means the read did not report one. */
+  reviewDecision: Schema.optional(Schema.NullOr(PullRequestReviewDecision)),
   mergeCapabilities: PullRequestMergeCapabilities,
   viewer: Schema.optional(TrimmedNonEmptyString),
   baseComparison: Schema.optional(PullRequestBaseComparison),