Skip to content

Conversation

@Masked-Kunsiquat
Copy link
Owner

Add comprehensive history timeline UI for viewing all changes to a trip. Follows three-layer architecture (engine → hooks → UI) as specified in AUTOMERGE_IMPLEMENTATION_PLAN.md.

Engine Layer (Pure Functions):

  • history-parser.ts: Parse Automerge.getHistory() into structured changes
  • format-changes.ts: Transform parsed changes into human-readable UI text

Hooks Layer (React Integration):

  • use-trip-history.ts: Load Automerge doc and parse operation log
  • use-formatted-history.ts: Combine history + participants for formatted output

UI Layer (Components):

  • HistoryTimeline.tsx: FlatList timeline of all changes (newest-first)
  • ChangeDetailCard.tsx: Expandable card with field-level change details
  • TripHistoryScreen.tsx: Full screen history view with loading/error states

Integration:

  • Added History card to Trip Dashboard (TripActionCards)
  • Created route: /trips/[id]/history
  • Supports all change types: trip metadata, participants, expenses, settlements
  • Human-readable descriptions (e.g., "Alice paid $50.00", "Updated trip name")
  • Relative timestamps (e.g., "2 hours ago", "3 days ago")
  • Field-by-field diffs in expandable cards
  • Empty state handling for trips without Automerge docs

Testing:

  • All files pass TypeScript type-check
  • All files pass ESLint validation
  • Uses deterministic error handling (createAppError)
  • Follows accessibility guidelines (screen reader labels, touch targets)

Implements Phase 3 tasks from AUTOMERGE_IMPLEMENTATION_PLAN.md.

🤖 Generated with Claude Code

Add comprehensive history timeline UI for viewing all changes to a trip.
Follows three-layer architecture (engine → hooks → UI) as specified in
AUTOMERGE_IMPLEMENTATION_PLAN.md.

**Engine Layer (Pure Functions):**
- history-parser.ts: Parse Automerge.getHistory() into structured changes
- format-changes.ts: Transform parsed changes into human-readable UI text

**Hooks Layer (React Integration):**
- use-trip-history.ts: Load Automerge doc and parse operation log
- use-formatted-history.ts: Combine history + participants for formatted output

**UI Layer (Components):**
- HistoryTimeline.tsx: FlatList timeline of all changes (newest-first)
- ChangeDetailCard.tsx: Expandable card with field-level change details
- TripHistoryScreen.tsx: Full screen history view with loading/error states

**Integration:**
- Added History card to Trip Dashboard (TripActionCards)
- Created route: /trips/[id]/history
- Supports all change types: trip metadata, participants, expenses, settlements
- Human-readable descriptions (e.g., "Alice paid $50.00", "Updated trip name")
- Relative timestamps (e.g., "2 hours ago", "3 days ago")
- Field-by-field diffs in expandable cards
- Empty state handling for trips without Automerge docs

**Testing:**
- All files pass TypeScript type-check
- All files pass ESLint validation
- Uses deterministic error handling (createAppError)
- Follows accessibility guidelines (screen reader labels, touch targets)

Implements Phase 3 tasks from AUTOMERGE_IMPLEMENTATION_PLAN.md.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Dec 30, 2025

Important

Review skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.


Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

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.

2 participants