fix: add issue detail jump button#3018
Closed
get6 wants to merge 2 commits into
Closed
Conversation
|
@get6 is attempting to deploy a commit to the IndexLabs Team on Vercel. A member of the Team first needs to authorize it. |
There was a problem hiding this comment.
Pull request overview
Adds a floating “jump” FAB to the Issue Detail timeline to quickly scroll to the latest activity (Virtuoso scrollToIndex) and toggle to “jump to top” when near the bottom, while keeping the chat FAB placement consistent.
Changes:
- Introduces
IssueJumpFaband renders it inIssueDetailwhen the timeline overflows and chat isn’t open. - Implements Virtuoso-backed jump-to-bottom behavior via
VirtuosoHandle.scrollToIndex. - Updates chat FAB positioning and adds i18n labels + a focused unit test for jump behavior.
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/views/issues/components/issue-detail.tsx | Tracks overflow/near-bottom state; uses Virtuoso ref to jump to latest; conditionally renders the jump FAB. |
| packages/views/issues/components/issue-jump-fab.tsx | New reusable tooltip + button component for jump-to-top/bottom. |
| packages/views/chat/components/chat-fab.tsx | Changes FAB positioning from absolute to fixed for consistent floating alignment. |
| packages/views/issues/components/issue-detail.test.tsx | Adds Virtuoso jump test; expands DOM scroll mocking to support overflow detection. |
| packages/views/locales/en/issues.json | Adds jump button labels under detail.*. |
| packages/views/locales/zh-Hans/issues.json | Adds jump button labels under detail.*. |
Comments suppressed due to low confidence (1)
packages/views/chat/components/chat-fab.tsx:53
- Changing the FAB from
absolutetofixedalters its positioning context (it’s no longer constrained by a relative parent). In the desktop renderer layout there’s an explicit note that the content area isrelativesoChatWindow/ChatFabare constrained to that inset container; withfixed, the FAB may instead pin to the window and overlap the sidebar/outside the rounded content area. If only the issues page needs viewport-fixed alignment, consider making the positioning configurable (prop/className) or keepingabsoluteand adjusting the issues jump button layout accordingly.
<TooltipTrigger
onClick={handleClick}
className={cn(
"fixed bottom-2 right-2 z-50 flex size-10 cursor-pointer items-center justify-center rounded-full ring-1 ring-foreground/10 bg-card text-muted-foreground shadow-sm transition-transform hover:scale-110 hover:text-accent-foreground active:scale-95",
// Impulse the button itself while a chat task is running — no
// outer ring to keep things calm.
isRunning && "animate-chat-impulse",
)}
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
+1037
to
+1038
| }, [scrollContainerEl, updateJumpScrollState, items.length]); | ||
|
|
Comment on lines
343
to
+362
| scrollIntoViewSpy.mockClear(); | ||
| virtuosoScrollToIndexSpy.mockClear(); | ||
| Object.defineProperty(HTMLElement.prototype, "scrollHeight", { | ||
| configurable: true, | ||
| get: () => 0, | ||
| }); | ||
| Object.defineProperty(HTMLElement.prototype, "clientHeight", { | ||
| configurable: true, | ||
| get: () => 0, | ||
| }); | ||
| Object.defineProperty(HTMLElement.prototype, "scrollTop", { | ||
| configurable: true, | ||
| writable: true, | ||
| value: 0, | ||
| }); | ||
| Object.defineProperty(HTMLElement.prototype, "scrollTo", { | ||
| configurable: true, | ||
| writable: true, | ||
| value: vi.fn(), | ||
| }); |
Author
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What does this PR do?
Adds a floating jump control to the issue detail timeline so users can quickly move to the latest activity, and back to the top when already near the bottom. The issue timeline is virtualized with Virtuoso, so the bottom jump uses
scrollToIndexinstead of relying on partially measuredscrollHeight.Related Issue
No GitHub issue found/linked.
Type of Change
Changes Made
packages/views/issues/components/issue-detail.tsx: tracks overflow/near-bottom state and renders the jump FAB when useful, scoped to the issue detail pane.packages/views/issues/components/issue-jump-fab.tsx: adds the tooltip + button component for jump-to-top/bottom.packages/views/locales/*/issues.json: adds jump labels.packages/views/issues/components/issue-detail.test.tsx: covers Virtuoso-backed jump behavior.How to Test
pnpm --filter @multica/views exec vitest run issues/components/issue-detail.test.tsxpnpm --filter @multica/views typecheckpnpm --filter @multica/views lintChecklist
apps/web/features/landing/i18n/) and relevant docs (apps/docs/content/docs/)apps/docs/content/docs/developers/conventions.zh.mdx(terminology, mixed-rule fortask/issue/skill)Risk: low UI-only change, but manual mobile verification is still recommended because this adds a floating issue-detail control and Virtuoso scrolling behavior.
AI Disclosure
AI tool used: Hermes Agent / GPT-5.5
Prompt / approach:
Implemented from user feedback that issue detail lacks a quick way to jump to the latest/bottom comment. Kept issue timeline virtualization intact, scoped the FAB to the issue detail pane to avoid overlaying the sidebar, and validated with focused unit test/typecheck/lint.
Screenshots (optional)
Not included; manual mobile visual check recommended before merge.