Commit graph

988 commits

Author SHA1 Message Date
dotta
59d913d04b Fix issue detail main-pane focus on navigation 2026-04-09 06:18:27 -05:00
dotta
e21e442033 Fix issue detail inbox archive shortcut 2026-04-09 06:18:27 -05:00
dotta
296033620f Remove main-content focus outline
Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:27 -05:00
dotta
fad5634b29 feat(ui): add keyboard shortcut cheatsheet dialog on ? keypress
Shows a beautiful categorized cheatsheet of all keyboard shortcuts
(inbox, issue detail, global) when the user presses ? with keyboard
shortcuts enabled. Respects text input focus detection — won't trigger
in text fields. Uses the existing Dialog component and Radix UI.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:27 -05:00
dotta
69ff793c6a Add issue-detail g i inbox shortcut
Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:27 -05:00
dotta
ede3206423 fix(ui): always render transcript message for non-succeeded runs
Use createHistoricalTranscriptMessage for failed/cancelled/timed_out
runs even before transcript data loads. This prevents the flash where
a plain "run X failed" status line transforms into a foldable "failed
after X minutes" header when transcripts arrive asynchronously.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:27 -05:00
dotta
2cf2a44d68 fix(ui): fix inbox nesting column alignment
Move child indentation from wrapper paddingLeft into desktopMetaLeading
so the unread dot stays in the leftmost column regardless of nesting
depth. When nesting is enabled, all issue rows get a fixed-width folding
column (chevron or empty spacer) for consistent alignment. Children
indent after the folding column. When nesting is disabled, no folding
column is rendered.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:26 -05:00
dotta
58ae23aa2c fix(ui): make j/k keyboard shortcuts traverse nested child issues in inbox
Builds a flat navigation list that includes expanded child issues alongside
top-level items, so j/k moves through every visible row including children.
Also adds the NavEntry type and updates archive/read/enter actions to work
with both top-level work items and nested child issues.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:26 -05:00
dotta
d3e66c789e feat(ui): add toggle button for inbox parent-child nesting
Adds a ListTree icon button in the inbox top bar to toggle nesting
on/off. Preference is persisted in localStorage. When disabled, all
issues display as a flat list without grouping.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:26 -05:00
dotta
097f30b138 feat(ui): nest parent-child issues in inbox/mine view
Groups child issues under their parent in the inbox, matching the
nesting pattern used on the issues list page. Parent groups sort by
the most recent activity across all family members. Archived parents
don't hide their children — orphans show independently.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:26 -05:00
dotta
c5ccafbb80 fix(ui): show shimmer and icon on initial Working... state for new agent runs
Eliminates two visual glitches when a new agent run starts:
1. The initial "Working..." was rendered as plain text without the shimmer
   animation or agent icon — now matches the proper working state styling.
2. A brief blank flash occurred when transcript chunks arrived but hadn't
   produced parseable parts yet — fixed by deriving waitingText from parts
   availability instead of the hasOutput flag.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:26 -05:00
dotta
28a28d1cb6 fix(ui): eliminate flash when auto-folding work sections on page load
Replace useEffect with synchronous state derivation during render so
the browser never paints the unfolded intermediate state. This prevents
the visible "jump" when loading an issue page with already-completed
work sections like "worked for 4 minutes".

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:26 -05:00
dotta
7edd2f7946 fix(ui): add pause between shimmer animation repeats
The sweep now completes at 60% of the cycle and holds for the
remaining 40%, giving a ~1s pause before repeating. Total cycle
duration increased from 1.5s to 2.5s.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:26 -05:00
dotta
1a82646e9d fix(ui): fix shimmer animation loop jitter by keeping gradient in view
The shimmer keyframes animated from -100% to 200%, pushing the gradient
fully off-screen at both extremes. On loop restart the text flashed
invisible for a frame. Changed to 100%→0% so the gradient always
overlaps the visible area — both endpoints show solid base-color text
and the highlight sweeps smoothly through without discontinuity.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:26 -05:00
dotta
f75c0c317c fix(ui): move useCallback hook before early returns in IssueDetail
The handleChatImageClick useCallback (and its dependencies) was defined
after conditional early returns, violating React's rules of hooks and
causing "Rendered more hooks than during the previous render" crashes.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:26 -05:00
dotta
d0920da459 feat(ui): open gallery when clicking images in chat messages
Clicking an image in a chat message now opens the same ImageGalleryModal
used by the attachments gallery. Matches by contentPath or assetId.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:26 -05:00
dotta
c830c64727 fix(ui): fix shimmer text using invalid hsl() wrapper on oklch colors
--foreground is defined as oklch(), not HSL channels. Wrapping it in
hsl() produced an invalid color, making the shimmer text invisible.
Use var(--foreground) directly and color-mix() for the highlight band.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:26 -05:00
dotta
2ec2b1f1eb fix(ui): improve shimmer gradient and add Working/Worked tokens to Chat UX Lab
Rework the shimmer-text CSS to use a Cursor-style sweep: full-opacity base
with a narrow transparent highlight band that slides across, linear timing,
tighter background-size. Add a "Status tokens" section to the Issue Chat UX
Lab showing both the active shimmer "Working" state and the static "Worked"
state side-by-side for quick visual review.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:26 -05:00
dotta
9159b44fcc fix(ui): update inbox badge test inputs 2026-04-09 06:18:26 -05:00
dotta
f5a87ab14e fix(ui): avoid issue detail ref update loops 2026-04-09 06:18:05 -05:00
dotta
185195201a Adjust execution workspace header layout 2026-04-09 06:18:05 -05:00
dotta
1e4ccb2b1f Improve mobile comment copy button feedback 2026-04-09 06:18:05 -05:00
dotta
038dd2bb82 Improve issue assignee update responsiveness 2026-04-09 06:18:05 -05:00
dotta
bac5afa647 Remove "None" text from empty Blocking and Sub-issues property rows
When there are no blocking issues or sub-issues, show nothing (or just the
"+ Add sub-issue" button) instead of displaying "None" text.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:05 -05:00
dotta
db1279dc12 Make worktree banner name clickable to copy to clipboard
Clicking the worktree name in the banner now copies it to clipboard
and shows "Copied\!" feedback for 1.5 seconds.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:05 -05:00
dotta
30dd2b78e5 Polish shared issue columns trigger styling 2026-04-09 06:18:05 -05:00
dotta
ee82a4f243 Reuse inbox issue column controls in issues lists 2026-04-09 06:18:05 -05:00
dotta
1cbb0a5e34 Add execution workspace issues tab 2026-04-09 06:18:05 -05:00
dotta
93355bae6b Debounce issues search input 2026-04-09 06:18:05 -05:00
dotta
c6779b570f feat(ui): add workspace and parent issue grouping to issues list
Adds two new groupBy options on the issues page: "Workspace" groups
issues by their projectWorkspaceId, and "Parent Issue" groups by
parentId. Groups with items sort first; sentinel groups (No Workspace /
No Parent) appear last. Creating a new issue from a parent group
pre-fills parentId.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-09 06:18:05 -05:00
Devin Foley
3264f9c1f6
Fix typing lag in long comment threads (PAPA-63) (#3163)
## Thinking Path

> - Paperclip orchestrates AI agents for zero-human companies
> - The issue detail page displays comment threads with rich timeline
rendering
> - Long threads (100+ items) cause severe typing lag in the comment
composer because every keystroke re-renders the entire timeline
> - CDP tracing confirmed 110ms avg key→paint latency and 60 long tasks
blocking the main thread for 3.7s total
> - This pull request memoizes the timeline, stabilizes callback props,
debounces editor observers, and reduces idle polling frequency
> - The benefit is responsive typing (21ms avg, 5.3× faster) even on
threads with 100+ timeline items

## What Changed

- **CommentThread.tsx**: Memoize `TimelineList` with `useMemo` so typing
state changes don't re-render 143 timeline items; extract
`handleFeedbackVote` to `useCallback`; added missing deps
(`pendingApprovalAction`, `onApproveApproval`, `onRejectApproval`) to
useMemo array
- **IssueDetail.tsx**: Extract inline callbacks (`handleCommentAdd`,
`handleCommentVote`, `handleCommentImageUpload`,
`handleCommentAttachImage`, `handleInterruptQueued`) to `useCallback`
with `.mutateAsync` deps (not full mutation objects) for stable
references; add conditional polling intervals (3s active / 30s idle) for
`liveRuns`, `activeRun`, `linkedRuns`, and timeline queries
- **MarkdownEditor.tsx**: Debounce `MutationObserver` and
`selectionchange` handlers via `requestAnimationFrame` coalescing
- **LiveRunWidget.tsx**: Accept optional `liveRunsData` and
`activeRunData` props to reuse parent-fetched data instead of duplicate
polling

## Verification

- Navigated to [IP address]:3105/PAPA/issues/PAPA-32 (thread with 100+
items)
- Typed in comment composer — lag eliminated, characters appear
instantly
- CDP trace test script (`test-typing-lag.mjs`) confirmed: avg 21ms
key→paint (was 110ms), 5 long tasks (was 60), 0.5s blocking (was 3.7s)
- Ran `pnpm test:run` locally — all tests pass

## Risks

- Low risk. All changes are additive memoization and callback
stabilization — no behavioral changes. Polling intervals are only
reduced for idle state; active runs still poll at 3–5s.

## Model Used

- Claude Opus 4.6 (`claude-opus-4-6`) via Claude Code CLI, with tool use
and extended context

## Checklist

- [x] I have included a thinking path that traces from project context
to this change
- [x] I have specified the model used (with version and capability
details)
- [x] I have run tests locally and they pass
- [x] I have added or updated tests where applicable
- [x] If this change affects the UI, I have included before/after
screenshots
- [x] I have updated relevant documentation to reflect my changes
- [x] I have considered and documented any risks above
- [x] I will address all Greptile and reviewer comments before
requesting merge

---------

Co-authored-by: Paperclip <noreply@paperclip.ing>
2026-04-08 17:54:03 -07:00
dotta
950ea065ae Reuse chat-style run feed on dashboard
Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
b5e177df7e Address greptile review feedback 2026-04-08 06:02:34 -05:00
dotta
81b96c6021 Update transcript message expectations 2026-04-08 06:02:34 -05:00
dotta
fe96a2f976 Fix rebased issue detail chat props 2026-04-08 06:02:34 -05:00
dotta
92f142f7f8 Polish issue chat transcript presentation 2026-04-08 06:02:34 -05:00
dotta
7dd3661467 Tweak issue chat run action
Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
e09dfb1a2c Reorder action bar icons and add relative date formatting
Action bar for agent messages is now: [copy] [thumbs up] [thumbs down] [date] [three dots].
Date shows relative time (e.g. "2h ago") if < 1 week old, otherwise short date (e.g. "Apr 6").
Hovering the date shows full timestamp tooltip. Date links to the comment anchor.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
a57f6f48b4 Move date/menu to action bar and fix activity label sizing
- Agent comment header now only shows name (+ running badge)
- Date, copy, thumbs up/down, and three-dots menu all in action bar
- Activity event STATUS/ASSIGNEE labels changed from text-[9px] to
  text-xs to match value font size

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
29514606bb Refactor user message avatar to flex layout
Replace absolute positioning (-right-8) with a flex row layout for the
"You" avatar. The avatar now sits naturally to the right of the bubble
via flex justify-end + gap-2.5, avoiding overflow clipping issues.
Max-width 85% is on the content column, not the bubble div, so the
bubble + avatar together fill the row naturally.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
627fbc80ac Polish issue chat chain-of-thought rendering
Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
2a372fbe8a Refine issue chat chain-of-thought mapping 2026-04-08 06:02:34 -05:00
dotta
d8a7342686 Fix avatar positioning and activity line alignment in chat
- Move "You" avatar outside content column using -right-8 negative
  positioning instead of right-0 inside pr-8 padding
- Remove pr-8 padding from user message container so bubble touches
  the column edge
- Align activity event and run timeline avatars/gaps with chat messages
  (sm size + gap-2.5 instead of xs + gap-2)

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
3574a3bf49 Move user avatar outside content column to right margin
Use relative positioning with pr-8 reserved space and absolute
positioning for the avatar, so it sits outside the content column
boundary while the bubble's right edge aligns with the column edge.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
f94fe57d10 Polish issue chat actions and overflow
- Scale activity components (events, runs) to ~80% font size with
  xs avatars for a quieter visual weight
- Hide succeeded runs from the timeline; only show failed/errored
- Always show three-dots menu on agent comments with "Copy message"
  option, plus optional "View run" when available
- User avatar repositioned to top-right (items-start) of message
- Change "Me" → "You" in assignee labels for natural chat phrasing
  ("You updated this task")

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
94652c6079 Fix chat comment alignment, avatars, and layout polish
- Agent messages: avatar outside left (matching feed items alignment),
  always shown, consistently uses icon avatar instead of initials
- User messages: avatar outside right, action bar moved below the
  gray bubble, gray darkened to bg-muted
- System events: right-aligned when actor is the current user
- Run messages: use agent icon avatar consistently
- Pass actorType/actorId in event metadata for current-user detection

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
9131cc0355 Restyle issue chat comments for chat-like UX
User messages: right-aligned bubbles (85% max-width) with gray
background, no border. Hover reveals short date + copy icon.

Agent messages: borderless with avatar, name, date and three-dots
in header. Left-aligned action bar with icon-only copy, thumbs up,
and thumbs down. Thumbs down opens a floating popover for reason.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
f7410673fe Fix needs-work feedback panel closing immediately
The IssueChatCtx.Provider was opened but never closed, causing the
context to not properly wrap the thread. This, combined with the
stable component references via context (already in place), ensures
OutputFeedbackButtons state is preserved across re-renders when
feedback votes update.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
4a75d05969 Remove border and padding from chat thread outer container
Strip the rounded border, padding, background gradient, and shadow
from ThreadPrimitive.Root so the chat thread flows naturally without
a bordered wrapper container.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00
dotta
8ada49f31b Polish issue chat actions and overflow
Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 06:02:34 -05:00