## Thinking Path
> - Paperclip orchestrates AI agents for zero-human companies
> - A core part of that is the operator experience around reading issue
state, agent chat, and sub-task structure
> - The current branch had a long run of issue-detail and issue-list UX
fixes that all improve how humans follow and steer active work
> - Those changes mostly live in the UI/chat surface and should be
reviewed together instead of mixed with workspace/runtime work
> - This pull request packages the issue-detail, chat, markdown, and
sub-issue list improvements into one standalone change
> - The benefit is a cleaner, less jumpy, more reliable issue workflow
on desktop and mobile without coupling it to unrelated server/runtime
refactors
## What Changed
- Stabilized issue chat runtime wiring, optimistic comment handling,
queued-comment cancellation, and composer anchoring during live updates
- Fixed several issue-detail rendering and navigation regressions
including placeholder bleed, local polling scope, mobile inbox-to-issue
transitions, and visible refresh resets
- Improved markdown and rich-content handling with advisory image
normalization, editor fallback behavior, touch mention recovery, and
`issue:` quicklook links
- Refined sub-issue behavior with parent-derived defaults, current-user
inheritance fixes, empty-state cleanup, and a reusable issue-list
presentation for sub-issues
- Added targeted UI tests for the new issue-detail, chat scroll/message,
placeholder-data, markdown, and issue-list behaviors
## Verification
- `pnpm vitest run ui/src/components/IssueChatThread.test.tsx
ui/src/components/MarkdownEditor.test.tsx
ui/src/components/IssuesList.test.tsx
ui/src/context/LiveUpdatesProvider.test.tsx
ui/src/lib/issue-chat-messages.test.ts
ui/src/lib/issue-chat-scroll.test.ts
ui/src/lib/issue-detail-subissues.test.ts
ui/src/lib/query-placeholder-data.test.tsx
ui/src/hooks/usePaperclipIssueRuntime.test.tsx`
## Risks
- Medium: this branch touches the highest-traffic issue-detail UI paths,
so regressions would show up as chat/thread or sub-issue UX glitches
- The changes are UI-heavy and would benefit from reviewer screenshots
or a quick manual browser pass before merge
## Model Used
- OpenAI Codex coding agent (GPT-5-class runtime in Codex CLI; exact
deployed model ID is not exposed in this environment), reasoning
enabled, tool use and local code execution enabled
## 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
- [ ] If this change affects the UI, I have included before/after
screenshots
- [ ] 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>
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>
Address two Greptile review comments:
1. Collapsed parent badge now shows total descendant count at all depths
rather than direct-child count only. Add `countDescendants` utility to
issue-tree.ts (recursive, uses existing childMap) and replace
`children.length` with it in the titleSuffix badge.
2. Add a useEffect that prunes stale IDs from `collapsedParents` whenever
the issues prop changes. Deleted or reassigned issues previously left
orphan IDs in localStorage indefinitely; the effect filters to only IDs
that appear as a parentId in the current issue list and persists the
cleaned array via updateView.
Add four unit tests for countDescendants: leaf node, single-level,
multi-level, and unknown ID.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Extract the inline tree-building logic from IssuesList into a pure
`buildIssueTree` function in lib/issue-tree.ts so it can be unit tested.
Add six tests covering: flat lists, parent-child grouping, multi-level
nesting, orphaned sub-tasks promoted to root, empty input, and list
order preservation.
Add two tests to IssueRow.test.tsx covering the new titleSuffix prop:
renders inline after the title when provided, and renders cleanly when
omitted.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Move collapsedParents from ephemeral useState into IssueViewState,
which is already serialised to localStorage under the scoped key.
Navigating away and back now restores the exact collapsed/expanded
state the user left the list in.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Replace the boolean isChild flag with a numeric depth counter.
Each depth level adds 16px left padding via inline style on the
wrapper div, so sub-tasks of sub-tasks (and deeper) are indented
proportionally rather than all aligning at the same level.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
When a parent issue is collapsed, its title is suffixed with
"(N sub-tasks)" so the count remains visible at a glance.
The suffix disappears when the parent is expanded.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
The base IssueRow has sm:pl-1 which overrides pl-6 at sm+ breakpoints.
Adding sm:pl-7 ensures the indent is visible at all screen sizes.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Sub-tasks are now grouped under their parent issue in the list view.
Parent issues with children show a chevron to collapse/expand their subtasks.
Child issues are visually indented to indicate hierarchy.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Keep issue search local to the loaded list, defer heavy result updates, and memoize the rendered list body so typing stays responsive.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Pills with semi-transparent backgrounds were using raw color luminance to pick
text color, ignoring the page background showing through. This caused unreadable
text on dark themes for mid-luminance colors like orange. Now composites the
rgba background over the actual page bg (dark/light) before computing WCAG
contrast ratios, and centralizes the logic in a shared color-contrast utility.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Priority is still supported as a feature (editable in issue properties,
used in filters), but no longer shown prominently in every issue row.
Affects inbox, issues list, my issues, and dashboard pages.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
- Add global font smoothing (antialiased) to body
- Add tabular-nums to all numeric displays: MetricCard values, Costs page,
AgentDetail token/cost grids and tables, IssueDetail cost summary,
Companies page budget display
- Replace markdown image hard border with subtle inset box-shadow overlay
- Replace all animate-ping status dots with calmer animate-pulse across
AgentDetail, IssueDetail, Agents, sidebar, kanban, issues list, and
active agents panel
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Add a "Project" filter section to the issues filter popover, following the
same pattern as the existing Assignee and Labels filters. Issues can now
be filtered by one or more projects from the filter dropdown.
Closes#129
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Move status icon to left column on mobile across issues list, inbox, and dashboard
- Hide priority icon on mobile (only show on desktop)
- Move unread indicator dot to right side vertically centered on mobile inbox
- Stale work section: show status icon instead of clock on mobile
- Desktop layout unchanged
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Removed the scroll-to-bottom button from IssuesList (wrong location)
and created a shared ScrollToBottom component. Added it to IssueDetail
and RunDetail pages. On mobile, the button sits above the bottom nav
to avoid overlap.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Add PriorityIcon and timeAgo to IssuesList mobile rows to match the
pattern used in Inbox and Dashboard. Align Dashboard row padding to
match Inbox. All mobile issue rows now show: title (2-line clamp),
then priority + status + identifier + relative time.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
On mobile, all issue rows now show title first (up to 2 lines),
with metadata (icons, identifier, timestamp) on a second line below.
Desktop layout is preserved as single-line rows.
Affected locations: Inbox recent issues, Inbox stale work,
Dashboard recent tasks, and IssuesList.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Debounces search input (300ms) and syncs it to a ?q= URL parameter so
searches persist across navigation and can be shared via URL.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Shows a floating arrow button in the bottom-right corner when the user
is more than 300px from the bottom of the issues list. Hides
automatically when near the bottom. Smooth-scrolls on click.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Previously, sorting was skipped when a search query was active, so
search results were only ordered by backend relevance ranking.
Now client-side sorting applies to search results too.
Also changed default sort from "created" to "updated" desc so most
recently updated issues appear first.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Rename all workspace packages from @paperclip/* to @paperclipai/* and
the CLI binary from `paperclip` to `paperclipai` in preparation for
npm publishing. Bump CLI version to 0.1.0 and add package metadata
(description, keywords, license, repository, files). Update all
imports, documentation, user-facing messages, and tests accordingly.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Changes the default sort from "status ascending" to "created descending"
so newest issues appear at the top. Also sets default groupBy to "none"
since date-based sorting works best as a flat list.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Previously, new companies with no saved view state defaulted to showing
only 'Active' issues (todo, in_progress, in_review, blocked). This
changes the default to show all issues, which is more useful when a
company has few issues.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Add ILIKE-based issue search across title, identifier, description,
and comments with relevance ranking. Add assigneeUserId filter and
allow agents to return issues to creator. Show assigned issue count
in sidebar badges. Add minCount param to live-runs endpoint. Add
activity charts (run activity, priority, status, success rate) to
dashboard. Improve active agents panel with recent run cards.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
The live badge was positioned after the assignee column, pushing the
date column out of alignment on rows with live agents. Move it before
the assignee so it doesn't displace the layout.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Adds `collapsedGroups` to the view state (persisted in localStorage),
so folding a status/priority/assignee group header is remembered across
page navigations and reloads.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Add PWA meta tags for iOS home screen. Fix mobile properties drawer with safe
area insets. Add image attachment button to comment thread. Improve sidebar
with collapsible sections, project grouping, and mobile bottom nav. Show
token and billing type breakdown on costs page. Fix inbox loading state to
show content progressively. Various mobile overflow and layout fixes.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Add org chart page with tree visualization and sidebar nav link
- Restructure issue detail into tabbed layout (comments/activity/sub-issues)
- Persist comment drafts to localStorage with debounce
- Add inline assignee picker to issues list with search
- Fix assignee clear to reset both agent and user assignee
- Fix InlineEditor nesting when rendering markdown content
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Create shared status-colors.ts module as single source of truth for all
status and priority color definitions. Replace hardcoded color classes in
StatusIcon, StatusBadge, PriorityIcon, NewIssueDialog, Agents, AgentDetail,
and DesignGuide. Fix inconsistent hues (in_progress was yellow in StatusIcon
but indigo in StatusBadge, blocked was red vs amber). Bump identifier text
from text-xs to text-sm and improve MetricCard label legibility.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Adds a new board/kanban view alongside the existing list view on the
Issues page. Users can toggle between views via a segmented control
in the toolbar. The preference persists in localStorage.
Board view features:
- Columns for all 7 status types (backlog through cancelled)
- Drag-and-drop cards between columns to update issue status
- Cards display identifier, title, priority, assignee, and live indicator
- Uses existing @dnd-kit library already in the project
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Set viewport-fit=cover and disable user scaling for mobile PWA feel
- Wrap assignee/project popover lists in scrollable containers
- Remove rounded-t-sm from stacked chart bars for cleaner rendering
- Prevent filter bar icons from shrinking on narrow screens
- Show "Board" instead of raw user IDs in activity feeds and toasts
- Surface server error message in health API failures
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Make Filter/Sort/Group buttons icon-only on small screens (< 640px)
- Make "New Issue" button icon-only on small screens
- Show filter count badge on mobile instead of full text
- Reduce gaps between toolbar items on mobile
- Hide date column and "Live" text on small screens for issue rows
- Add touch-action: manipulation to prevent double-tap zoom on mobile
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
