fix: prevent Create PR button overflow in narrow sidebar

[naaa760]

fix : #1417

summary

• Ensure the right sidebar "Create PR" button and header actions wrap instead of overflowing when the sidebar is narrow.

Fixes

• Fixes: Create PR button clipping in narrow right sidebar.

Snapshot

• Before: "Create PR" button clipped when sidebar width is reduced.
• After: Header buttons wrap to a new line and remain fully visible.

Type of change

• Bug fix (non-breaking change which fixes an issue)

Mandatory Tasks

• I have self-reviewed the code

Checklist
[x] I have read the contributing guide
[x] My code follows the style guidelines of this project (pnpm run format)
[x] I have checked if my changes generate no new warnings (pnpm run lint)

[vercel]

@naaa760 is attempting to deploy a commit to the General Action Team on Vercel.

A member of the Team first needs to authorize it.

[greptile-apps]

Greptile Summary

This PR fixes button clipping in the narrow right sidebar by adding flex-wrap and min-w-0 to the header action containers in FileChangesPanel.tsx, allowing the "Create PR" and other action buttons to wrap to a new line rather than overflow.

• Has-changes branch (line 623): shrink-0 is replaced with min-w-0 flex-wrap on the button container. The outer row already uses flex-wrap, so this is consistent and correct.
• No-changes branch (line 698): shrink-0 is removed and min-w-0 flex-wrap is added. Critically, removing shrink-0 is necessary here — without it, the container would never shrink even with min-w-0, so the wrapping behaviour would not activate. This is correct.
• Minor inconsistency: the outer wrapper of the no-changes branch (flex w-full items-center justify-between gap-2) does not have flex-wrap, unlike its counterpart in the has-changes branch. At very narrow widths the stats and button columns remain side-by-side (only inner buttons wrap), but this is an acceptable trade-off and does not reintroduce overflow.

Confidence Score: 4/5

• This PR is safe to merge — it makes two minimal, isolated Tailwind class changes with no logic impact.
• The diff is exactly two one-line CSS class changes that only affect layout. There are no data-flow changes, no new dependencies, and no logic alterations. The approach (min-w-0 + flex-wrap + removing shrink-0) is a well-established Tailwind pattern for preventing flex overflow. Docking one point for the minor inconsistency in outer-container wrapping behaviour between the two branches, which could surface in edge-case narrow widths.
• No files require special attention.

Important Files Changed

Filename

Overview

src/renderer/components/FileChangesPanel.tsx

Two targeted Tailwind class changes prevent button overflow in narrow sidebar: adds flex-wrap and min-w-0 to both button container divs. In the second change (no-changes branch), shrink-0 is also removed to allow the container to shrink — which is necessary for the fix to actually work. Slightly inconsistent outer-container behavior between the two branches (one has flex-wrap on the outer wrapper, the other does not) but does not cause a bug.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[FileChangesPanel header row] --> B{hasChanges?}

    B -- Yes --> C["Outer: flex w-full flex-wrap justify-between"]
    C --> D["Left: stats + staged badge"]
    C --> E["Right buttons container\n(BEFORE): flex items-center gap-2\n(AFTER): flex min-w-0 flex-wrap items-center gap-2"]
    E --> F["Changes btn · Stage All btn · PrActionButton"]

    B -- No --> G["Outer: flex w-full justify-between\n(no flex-wrap)"]
    G --> H["Left: em-dash stats (shrink-0)"]
    G --> I["Right buttons container\n(BEFORE): flex shrink-0 items-center gap-2\n(AFTER): flex min-w-0 flex-wrap items-center gap-2"]
    I --> J["Changes btn · PR status / Create PR btn"]

    style E fill:#d4edda,stroke:#28a745
    style I fill:#d4edda,stroke:#28a745

Loading

_{Last reviewed commit: 7d69dbf}

[arnestrickmann]

Hi @naaa760
Would appreciate it if you could attach screenshots / screen recordings for PRs of this sort.

Thank you

[arnestrickmann]

Hi @naaa760
would be great if you could add screenshots or recordings to this sort of PRs.
Thank you!

[naaa760]

see please @arnestrickmann