Add Customer Activity Timeline

[brapifra]

📋 Summary

This PR creates a new Customer Activity view that allows organization admins to see the lifecycle on a specific customer.

The activity view shows a timeline of all events, but presented in a much nicer way in terms of UX:

• Consecutive items (e.g. Subscription renewed) get grouped (e.g "[PLAN NAME] subscription renewed 5 times")
• Each item in the timeline also has a tone: positive, warning, danger. This helps users quickly glance if something requires their attention in regards to a customer.
• Less-relevant events are omitted from this view or shown in a more subtle way (e.g. order.paid and balance.order events are a bit redundant when a subscription gets renewed, so we hide them)

🎯 What

• Added a reusable Timeline component. It could potentially live in the ui package if it made sense to reuse it across other packages.
• Reused existing useInfiniteEvents hook to fetch all the lifecycle-relevant events
• Added a new "Activity" tab in the customer page
• Added business logic to group, filter out and format events into concise timeline items

🤔 Why

The current events view is not a really helpful UI to quickly check the lifecycle of a specific customer. It's hard to follow what happened when there are many events, it's also hard to differ positive from negative events...

🧪 Testing

• I have tested these changes locally
• All existing tests pass (uv run task test for backend, pnpm test for frontend)
• I have added new tests for new functionality
  Added tests for the business logic
• I have run linting and type checking (uv run task lint && uv run task lint_types for backend)

Test Instructions

1. Run the web app locally
2. Select a customer
3. Click on the new "Activity" view

🖼️ Screenshots/Recordings

With a "Non-paid renewal" warning:

📝 Additional Notes

• Rather than deviating from the existing way of paginating items in the app (by for example implementing infinite scrolling), I decided to reuse the existing Load more button to load more items.
• Didn't have enough time to implement virtualization on the timeline, and since this is also not implemented in the Events page, it feels like it can be deferred to a future PR where list virtualization across potentially long lists in the app is implemented.
• There are some existing behaviors and bugs that affect this new feature which are worth discussing and revisiting:
  • Selecting "All time" in the range selector doesn't return the correct events. This is also affecting the Events pages, for example.
  • The grouping select component (Daily, hourly...) at the top-right doesn't do anything for quite a few pages, such as the Events page. It should probably be hidden in those cases.
• The event grouping/filtering logic works correctly but is more convoluted than I'd like. Given more time, I'd refactor it to make it a bit more modular and type-dependent. This way adding a new event would be a single config entry, and you would get TS errors if there is some missing config at compile time.

✅ Pre-submission Checklist

• My code follows the project's style guidelines
• I have performed a self-review of my code
• I have commented my code where necessary
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have updated the relevant tests
• All tests pass locally
• AI/LLM Policy: If I used AI assistance, I have tested and executed the code locally (not just "vibe-coded")

[vercel]

@brapifra is attempting to deploy a commit to the polar-sh Team on Vercel.

A member of the Team first needs to authorize it.