From cccd6573600507452b7834c5b462b1e6f05e9cc0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Igor=20=C5=A0=C4=87eki=C4=87?= <iscekic@protonmail.com>
Date: Fri, 18 Sep 2026 23:57:35 +0000
Subject: [PATCH] fix(mobile): keep the Submit review header button label on
 screen

Explorer finding: pr-detail: The primary "Submit review" button in the header is clipped by the right screen edge, cutting off its label.

The user-agent explorer found this while using the app like a user.
One finding per item; the explorer never edits product code.

Flow: pr-detail
Found on revision: 25e16c156

Repro:
1. set this state first: account e2e-mobile-cloud-android@example.com signed in, $10 credits, 5 Code Reviewer pull requests, a second organization to switch to, font scale 2, battery 55% discharging, device portrait.
2. open the app on emulator-5554
3. reach the screen the capture names (pr-detail)
4. the capture shows the defect named below

Observed: The primary "Submit review" button in the header is clipped by the right screen edge, cutting off its label.
Expected: the screen renders without this defect

Evidence (from the device run):
- ~/.local/share/kwf/findings/explorer-pr-detail-the-primary-submit-review-button-in-th-d85029b9/pr-detail.png
---
 .../pr-review/pr-review-screen.test.tsx       | 53 +++++++++++++++++++
 .../components/pr-review/pr-review-screen.tsx |  9 +++-
 2 files changed, 60 insertions(+), 2 deletions(-)

diff --git a/apps/mobile/src/components/pr-review/pr-review-screen.test.tsx b/apps/mobile/src/components/pr-review/pr-review-screen.test.tsx
index 9e032e372dc..01ba0feaa2a 100644
--- a/apps/mobile/src/components/pr-review/pr-review-screen.test.tsx
+++ b/apps/mobile/src/components/pr-review/pr-review-screen.test.tsx
@@ -272,6 +272,59 @@ describe('PrReviewScreen Submit review reachability (P1-F-46b)', () => {
   });
 });
 
+// The header caps a trailing action at half the row (ScreenHeader's
+// `max-w-[50%]`). A button whose label cannot shrink overflows that cap and is
+// clipped by the screen edge at large font scales — the explorer found the
+// Overview "Submit review" label cut off at font scale 2. The button and its
+// label must shrink and wrap instead, like the Agents header action.
+describe('PrReviewScreen Submit review header fit', () => {
+  function findSubmitButton(): React.ReactElement | null {
+    // eslint-disable-next-line new-cap
+    const element = PrReviewScreen({ owner: 'octocat', repo: 'hello', number: 7 });
+    return findElement({
+      node: element,
+      type: 'Button',
+      prop: 'accessibilityLabel',
+      value: 'Submit review',
+    });
+  }
+
+  it('lets the Submit review button shrink inside the header action slot', () => {
+    const button = findSubmitButton();
+    if (!button) {
+      throw new Error('Submit review button not found');
+    }
+    const className = (button.props as { className?: string }).className ?? '';
+    expect(className).toContain('shrink');
+    expect(className).not.toContain('shrink-0');
+    expect(className).toContain('min-w-0');
+  });
+
+  it('lets the Submit review label wrap instead of drawing off-screen', () => {
+    const button = findSubmitButton();
+    if (!button) {
+      throw new Error('Submit review button not found');
+    }
+    const label = findElement({
+      node: button,
+      type: 'Text',
+      prop: 'className',
+      value: 'shrink text-center',
+    });
+    if (!label) {
+      throw new Error('Submit review label not found');
+    }
+    const labelProps = label.props as {
+      numberOfLines?: number;
+      allowFontScaling?: boolean;
+    };
+    // Wrapping, not truncation: no line cap and no disabled scaling, so a
+    // large font scale grows the button instead of clipping the label.
+    expect(labelProps.numberOfLines).toBeUndefined();
+    expect(labelProps.allowFontScaling).not.toBe(false);
+  });
+});
+
 describe('PrReviewScreen share action', () => {
   beforeEach(() => {
     prQueryResult = {
diff --git a/apps/mobile/src/components/pr-review/pr-review-screen.tsx b/apps/mobile/src/components/pr-review/pr-review-screen.tsx
index 909bf753761..aee8846e9e9 100644
--- a/apps/mobile/src/components/pr-review/pr-review-screen.tsx
+++ b/apps/mobile/src/components/pr-review/pr-review-screen.tsx
@@ -296,10 +296,15 @@ export function PrReviewScreen({ owner, repo, number }: PrReviewScreenProps) {
                 onPress={openReviewSubmit}
                 disabled={loadFailed}
                 accessibilityLabel={t('prReview.submit.submitReview')}
-                className={cn('px-3')}
+                // ScreenHeader caps a trailing action at half the row. A label
+                // that cannot shrink overflows that cap and is clipped by the
+                // screen edge at large font scales, so the button and its
+                // label shrink and wrap (as the Agents header action does)
+                // instead of drawing off-screen.
+                className={cn('min-w-0 shrink px-3')}
               >
                 <Check size={14} color={colors.primaryForeground} />
-                <Text>{t('prReview.submit.submitReview')}</Text>
+                <Text className="shrink text-center">{t('prReview.submit.submitReview')}</Text>
               </Button>
             ) : null}
           </View>