chore(autofix): Refactor seer drawer into shared components

[Zylphrex]

The seer drawer component has a lot of duplicate custom components. This change refactors it to

1. share components
2. use scraps where possible

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

Autofix Details

Bugbot Autofix prepared a fix for the issue found in the latest run.

• ✅ Fixed: Auto-scroll initial value inverted from original behavior
  • Changed shouldAutoScrollRef initial value from true to false to match original behavior where auto-scroll was disabled by default.

Or push these changes by commenting:

@cursor push 2a63f68b07

Preview (2a63f68b07)

diff --git a/static/app/components/events/autofix/v1/body.tsx b/static/app/components/events/autofix/v1/body.tsx
--- a/static/app/components/events/autofix/v1/body.tsx
+++ b/static/app/components/events/autofix/v1/body.tsx
@@ -100,7 +100,7 @@
   const scrollContainerRef = useRef<HTMLDivElement>(null);
 
   const lastScrollTopRef = useRef(0);
-  const shouldAutoScrollRef = useRef(true);
+  const shouldAutoScrollRef = useRef(false);
 
   const handleScroll = useCallback(() => {
     const container = scrollContainerRef.current;

_{This Bugbot Autofix run was free. To enable autofix for future PRs, go to the Cursor dashboard.}

[sentry]

Bug: The shouldAutoScrollRef is initialized to false, preventing auto-scrolling when new content first loads. It only enables after a manual scroll to the bottom.
_{Severity: HIGH}

Suggested Fix

Invert the logic to enable auto-scrolling by default. Initialize a ref like userScrolledUpRef to false. The auto-scroll effect should then run when !userScrolledUpRef.current is true, and set the ref to true only when the user manually scrolls up. This makes auto-scrolling the default behavior.

Prompt for AI Agent

Review the code at the location below. A potential bug has been identified by an AI
agent.
Verify if this is a real issue. If it is, propose a fix; if not, explain why it's not
valid.

Location: static/app/components/events/autofix/v1/body.tsx#L103

Potential issue: The auto-scroll feature for the v1 autofix drawer is broken on initial
load. The `shouldAutoScrollRef` is initialized to `false` and is only set to `true`
after the user manually scrolls to the bottom of the content. As a result, when new
content streams in, the `useEffect` responsible for scrolling down is blocked because
`shouldAutoScrollRef.current` is `false`. This means users will not see new results as
they arrive unless they manually scroll, defeating the purpose of the auto-scroll
feature.

_{Did we get this right? 👍 / 👎 to inform future reviews.}

[Zylphrex]

This is copied from the old logic, I did rename + invert the value for clarity though.

[cursor]

Cursor Bugbot has reviewed your changes and found 3 potential issues.

^{Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

[cursor]

Duplicate InnerSeerDrawer logic across v1 and v2 drawers

Medium Severity

The InnerSeerDrawer function in v1/drawer.tsx and v2/drawer.tsx contains nearly identical logic for checking loading state, seat-based-seer configuration, quota checks, repo linking, onboarding, and welcome/consent screens. Given the PR's stated goal is to "refactor seer drawer into shared components," this duplicated setup/configuration logic is a notable oversight — it belongs in a shared component alongside the other extracted pieces like SeerDrawerHeader, SeerDrawerNavigator, and SeerWelcomeScreen.

Additional Locations (1)

• static/app/components/events/autofix/v2/drawer.tsx#L71-L134

 

[Zylphrex]

True though I can't think of a "nice" interface where the 2 can share code with making things hard to change later.

[cursor]

V1 drawer body lost flex layout and gap spacing

Medium Severity

The StyledDrawerBody in v1/body.tsx only applies overflow-y: scroll, but the old SeerDrawerBody it replaces had display: flex; flex-direction: column; gap: xl (providing spacing between child sections like SeerNotices, GroupSummary, and autofix content), overscroll-behavior: contain (preventing scroll chaining to the page behind), and padding-bottom: 80px. The base DrawerBody component only provides padding and font-size, so these layout and scroll containment styles are lost, likely causing content sections to stack without spacing and the page to scroll when the drawer reaches its scroll limit.

 

[Zylphrex]

All these custom styles were unnecessary.

[cursor]

V2 drawer body lost scroll containment and flex layout

Medium Severity

The new StyledDrawerBody only applies overflow-y: scroll, but the old explorer drawer body it replaces had overscroll-behavior: contain (preventing scroll chaining), scroll-behavior: smooth, and display: flex; flex-direction: column for layout. Without overscroll-behavior: contain, scrolling to the end of the drawer will cause the underlying page to scroll — a common UX issue in side drawers.

 

[Zylphrex]

All these custom styles were unnecessary.

[shruthilayaj]

Tony and I chatted about this in slack and this behaviour isn't introduced in this PR, but the drawer opening is laggy, seems like we're re-rendering all the components on the page when we click on the "open seer" button and then we open the drawer.