Skip to content

fix: lock up top edge of the composer so suggestions list doesn't jump #2443

Open
szymeo wants to merge 2 commits into
PostHog:mainfrom
szymeo:suggestions-list-animation
Open

fix: lock up top edge of the composer so suggestions list doesn't jump #2443
szymeo wants to merge 2 commits into
PostHog:mainfrom
szymeo:suggestions-list-animation

Conversation

@szymeo
Copy link
Copy Markdown

@szymeo szymeo commented May 31, 2026

Problem

before.mp4

When new suggestions were added, centered content was jumping vertically, so the rows shifted under the cursor. While trying out a suggestion I ended up misclicking and starting a task I didn't intend to, which is easy to do on a surface people use to kick off work.

Changes

after.mp4

A small UI fix to keep the suggestions list stable and harder to misclick:

  • Page navigation now slides horizontally with a single page mounted at a time, so the panel stays anchored and no longer jumps.
  • Removed the clip that was cutting off rows mid-slide (any real overflow is still handled by the surrounding layout).
  • Card dismissal scales down and fades with a synced layout shift, and the composer is centered with the suggestions anchored below it.
  • Added a dev-only simulation harness (VITE_SIMULATE_SUGGESTIONS=1 env or the posthog-code:simulate-suggestions localStorage flag) so this can be exercised locally without waiting on real discovery.

How did you test this?

  • pnpm --filter code typecheck and Biome pass (also enforced by the pre-commit hook).
  • Confirmed manually in the running app: paging no longer shifts the list, and rows slide without being clipped — so the suggestion you click stays where you expect it.

Automatic notifications

  • Publish to changelog?
  • Alert Sales and Marketing teams?

- page navigation slides horizontally with mode="wait" so the panel no
  longer jumps from two pages briefly stacking in the layout
- dropped overflow-hidden so sliding rows are no longer clipped at the edges
- card dismiss scales down and fades with a synced layout shift
- center the task composer and anchor the suggestions panel below it
- add a dev-only suggestion simulation harness gated by
  VITE_SIMULATE_SUGGESTIONS / a localStorage flag
@greptile-apps
Copy link
Copy Markdown
Contributor

greptile-apps Bot commented May 31, 2026

Prompt To Fix All With AI
Fix the following 2 code review issues. Work through them one at a time, proposing concise fixes.

---

### Issue 1 of 2
apps/code/src/renderer/features/setup/hooks/useSetupDiscovery.ts:27-30
Missing cleanup for the simulation interval. If `selectedDirectory` transitions from a real path to `null`/`undefined`, React re-runs the effect and exits early at `if (!selectedDirectory) return;` — the `startSuggestionSimulation` call that would have cleared the old timer is never reached. The interval keeps firing and accumulates tasks in the store for a directory that is no longer active. The normal non-simulation code path avoids this by returning a cleanup function.

```suggestion
    if (shouldSimulateSuggestions()) {
      service.startSuggestionSimulation(selectedDirectory);
      return () => {
        service.stopSuggestionSimulation();
      };
    }
```

### Issue 2 of 2
apps/code/src/renderer/features/setup/services/setupRunService.ts:312-325
The simulation interval runs forever and has no upper bound. Because every tick uses a unique id (`simulated-suggestion-${index}`), `addDiscoveredTaskIfMissing` never deduplicates and the `discoveredTasks` array in the store grows without limit. Since the purpose of the harness is to exercise the incoming-suggestions animation, capping it (e.g. after one full cycle through all categories) would make the simulation repeatable and predictable.

```suggestion
    const totalSuggestions = SIMULATED_SUGGESTION_CATEGORIES.length * 2;

    const addNextSuggestion = () => {
      useSetupStore
        .getState()
        .addDiscoveredTaskIfMissing(
          buildSimulatedSuggestion(directory, this.simulatedSuggestionsCount),
        );
      this.simulatedSuggestionsCount += 1;
      if (this.simulatedSuggestionsCount >= totalSuggestions) {
        this.stopSuggestionSimulation();
      }
    };

    addNextSuggestion();
    this.simulatedSuggestionsTimer = window.setInterval(
      addNextSuggestion,
      SIMULATED_SUGGESTION_INTERVAL_MS,
    );
```

Reviews (1): Last reviewed commit: "feat: smoother suggested-tasks list anim..." | Re-trigger Greptile

Comment thread apps/code/src/renderer/features/setup/hooks/useSetupDiscovery.ts
Comment thread apps/code/src/renderer/features/setup/services/setupRunService.ts
@szymeo
Copy link
Copy Markdown
Author

szymeo commented May 31, 2026

Resolved both Greptile comments in 32788c56: the simulation interval now has effect cleanup/self-stop behavior and is capped so it cannot grow persisted suggestions indefinitely.

@szymeo szymeo changed the title feat: smoother suggested-tasks list animation fix: lock up top edge of the composer so suggestions list doesn't jump May 31, 2026
@ablaszkiewicz
Copy link
Copy Markdown
Contributor

@PostHog/team-posthog-code

@ablaszkiewicz ablaszkiewicz requested a review from a team May 31, 2026 15:18
@k11kirky
Copy link
Copy Markdown
Contributor

k11kirky commented Jun 1, 2026

@szymeo Thanks for this. Can you remove the simulation code. Its useful to show the changes, but otherwise just ads bloat

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants