Chat Autocomplete v2 Plan

plan.md

Chat Autocomplete V2 Plan

Overview

Enhanced chat autocomplete with smart suggestions and entity mentions. Users can reference tasks, projects, and areas inline using @ and # triggers, with context automatically injected for Claude.

Trigger Characters

Trigger	Entity Type	Search Target
@	Unified search	Tasks, Projects, AND Hub files
#	Areas	Area names
/	Commands	Slash commands (existing)

Unified @ Search:

• Single trigger searches all entity types
• Results grouped by type (Tasks, Projects, Hub Files)
• Smart ranking based on query match
• Hub files: partial filename matching (@email-tips → 2024-01-15-email-tips.md)

Mention Syntax

Mentions stored as: [[type:id|displayText]]

Entity mentions:

• Tasks: [[task:42|Review wireframes]]
• Projects: [[project:7|Client Website]]
• Areas: [[area:1|Work]]

Hub file mentions:

• [[hub:Jason/content/newsletters/2024-01-15-email-tips.md|email-tips]]
• Path relative to hub/ directory
• Display text is the matched portion

Example: Check [[hub:Jason/content/newsletters/2024-01-15-email-tips.md|email-tips]] and update [[task:42|Review wireframes]]

Architecture

Backend

New Search Endpoint:

GET /api/search/autocomplete?q=review&limit=10

Returns grouped results:

{
  "data": {
    "tasks": [{ "id": 42, "type": "task", "title": "Review wireframes", "subtitle": "Client Website · Work" }],
    "projects": [{ "id": 7, "type": "project", "title": "Review Portal", "subtitle": "Work" }],
    "hub_files": [{ "path": "Jason/content/newsletters/2024-01-review.md", "type": "hub", "title": "2024-01-review.md", "subtitle": "Jason · Newsletter" }]
  }
}

Hub File Indexing:

• Scans hub/ for content files (.md, excluding .cursor/rules/)
• Matches against filename (not full path)
• Returns path relative to hub/

MentionContextBuilder Service:

• Extracts mentions from message content using regex
• For entities: fetches full data (task details, project info, area)
• For Hub files: reads file content from disk
• Builds context string appended to Claude's prompt
• Stores mention metadata in message.metadata JSONB

Frontend

New Components:

components/chat/
├── AutocompleteMenu.tsx      # Unified menu for all triggers
├── MentionChip.tsx           # Styled mention pill in messages
├── MentionRenderer.tsx       # Parses/renders mentions in text
└── hooks/
    ├── useAutocomplete.ts    # Trigger detection, state management
    └── useDebouncedSearch.ts # API calls with 150ms debounce

Trigger Detection:

• Works anywhere in text (not just at start)
• Looks backwards from cursor for trigger character
• Extracts filter text between trigger and cursor

Flow:

1. User types @rev mid-sentence
2. useAutocomplete detects @ trigger, filter = "rev"
3. useDebouncedSearch calls API after 150ms
4. AutocompleteMenu shows matching tasks
5. User selects → mention syntax inserted
6. On send, MentionRenderer displays as styled chip
7. Backend extracts mentions, injects context for Claude

Context Injection

When message contains mentions, backend builds context:

User message: Check [[hub:Jason/content/newsletters/2024-01-email-tips.md|email-tips]] and update [[task:42|Review wireframes]]

---
Context for referenced entities:

Referenced Hub Files:
--- hub/Jason/content/newsletters/2024-01-email-tips.md ---
[Full file content here]
---

Referenced Tasks:
- Review wireframes (pending)
  Area: Work
  Project: Client Website
  Due: Feb 5
  Description: Review the new dashboard wireframes...

Claude receives this enriched prompt with full file contents for Hub files.

Key Files to Modify

• app/frontend/components/shell/ChatPanel.tsx - Replace SlashCommandMenu integration, add cursor tracking
• app/controllers/api/messages_controller.rb - Extract mentions, build context, store metadata
• config/routes.rb - Add search/autocomplete route

Key Files to Create

• app/controllers/api/search_controller.rb - Autocomplete endpoint (tasks, projects, hub files)
• app/services/mention_context_builder.rb - Extract and format entity context
• app/services/hub_file_indexer.rb - Scan and search hub/ directory
• app/frontend/components/chat/AutocompleteMenu.tsx - Unified autocomplete UI with grouped results
• app/frontend/components/chat/MentionChip.tsx - Styled mention display
• app/frontend/components/chat/MentionRenderer.tsx - Parse and render mentions
• app/frontend/components/chat/hooks/useAutocomplete.ts - Trigger detection logic
• app/frontend/components/chat/hooks/useDebouncedSearch.ts - Debounced API search

Performance

• 150ms debounce on API calls
• Max 10 suggestions per request
• Slash commands searched locally (no API)
• Request cancellation on query change

Verification

1. Type @ mid-sentence → see grouped results (Tasks, Projects, Hub Files)
2. Type @email → Hub files matching "email" appear in results
3. Type # → see area suggestions
4. Arrow keys navigate, Enter/Tab selects, Escape closes
5. Selected mention appears as styled chip in message
6. Hub file mention → Claude receives full file content
7. Task/Project mention → Claude receives entity details
8. Works on mobile (touch-friendly)